/* ================= FORM CONTAINER ================= */

.thirdsecondbox{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:0 15px;
}

/* ================= FORM CARD ================= */

.submitform{

    padding:35px 30px;
    background:white;
    border:2px solid black;
    border-radius:10px;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
     width:50%;
    max-width:650px;
    margin:40px auto;
}

/* Mobile */

@media(max-width:768px){
    .submitform{
        width:100%;
        margin:20px auto;
    }
}

/* ================= HEADING ================= */

.appointmentbook{
    text-align:center;
    width:100%;
}

.appointmentbook h2{
    font-size:calc(22px + .3vw);
    margin-top:20px;
    color:black;
}

/* ================= LABELS ================= */

.submitform label{
    display:block;
    margin-bottom:6px;
    font-size:14px;
    color:black;
    text-align:left;
    font-weight:500;
}

/* ================= FIELD CONTAINER ================= */

.formdetails{
    width:100%;
    margin-bottom:18px;
}

/* ================= INPUTS ================= */

.formdet{
     width:100%;
    padding:12px 14px;
    border-radius:6px;
    border:1px solid black;
    background:white;
    color:black;
    font-size:14px;
    outline:none;
}

/* placeholder */

.formdet::placeholder{
    color:#666;
}

/* focus */

.formdet:focus{
    border:2px solid #c2185b;
}

/* dropdown */

select.formdet{
    cursor:pointer;
}

/* dropdown options fix */

select.formdet option{
    background:white;
    color:black;
}

/* textarea */

textarea.formdet{
    min-height:90px;
    resize:none;
}

/* ================= BUTTON ================= */

.submitform input[type="submit"]{
    width:100%;
    margin-top:15px;
    padding:14px;
    border-radius:8px;
    border:none;
    background:linear-gradient(135deg,#c2185b,#8e0e3c);
    color:white;
    font-size:16px;
    font-weight:600;
    cursor:pointer;
}

/* hover */

.submitform input[type="submit"]:hover{
    transform:translateY(-2px);
}

/* ================= DIVIDER ================= */

.headerunderline{
    width:60%;
    border:1px solid #af1f60;
    margin-bottom:2rem;
}