/* ============================================================
   BFT BOOKING MODAL — COMPACT FINAL
   ============================================================ */

#bookingModal{
    --m-green:#477050;
    --m-green-soft:rgba(71,112,80,.12);
    --m-border:#d4cec6;
    --m-ink:#111;

    padding:12px !important;
}


#bookingModal .modal-overlay{
    background:rgba(12,12,12,.62) !important;

    backdrop-filter:blur(3px) !important;
}


/* ============================================================
   PANEL
   ============================================================ */

#bookingModal .modal-content{
    width:100% !important;
    max-width:580px !important;

    max-height:87vh !important;

    padding:
        18px
        20px
        0 !important;

    background:#fff !important;

    border-radius:15px !important;

    border:
        1px solid
        rgba(0,0,0,.11) !important;

    box-shadow:
        0 25px 70px
        rgba(0,0,0,.25) !important;

    overflow-y:auto !important;
}


/* título */
#bookingModal .modal-content > h2{
    margin:
        0
        42px
        13px
        0 !important;

    font-size:18px !important;
    line-height:1.05 !important;

    color:#111 !important;
}


/* X */
#bookingModal #modalClose{
    top:12px !important;
    right:13px !important;

    width:30px !important;
    height:30px !important;

    padding:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:#f1f1f1 !important;
    color:#555 !important;

    border:0 !important;
    border-radius:50% !important;

    font-size:19px !important;
}


#bookingModal #modalClose:hover{
    background:#111 !important;
    color:#fff !important;
}


/* ============================================================
   TOUR SUMMARY
   ============================================================ */

#bookingModal #bookingSummary{
    margin-bottom:14px !important;

    padding:
        11px
        13px !important;

    background:
        linear-gradient(
            135deg,
            #f8faf8,
            #f6f3ef
        ) !important;

    border:
        1px solid
        #ddd7d0 !important;

    border-left:
        3px solid
        var(--m-green) !important;

    border-radius:9px !important;
}


#bookingModal .booking-summary-tour{
    margin-bottom:4px !important;

    font-size:13px !important;
    line-height:1.2 !important;

    font-weight:800 !important;

    color:#111 !important;
}


#bookingModal .booking-summary-meta{
    margin-top:3px !important;

    font-size:10.5px !important;
    line-height:1.45 !important;

    color:#575757 !important;

    opacity:1 !important;
}


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

#bookingModal #bookingForm{
    padding-bottom:64px !important;
}


#bookingModal .form-row{
    display:grid !important;

    grid-template-columns:
        repeat(
            2,
            minmax(0,1fr)
        ) !important;

    gap:10px !important;

    margin-bottom:9px !important;
}


#bookingModal .form-group{
    gap:3px !important;
}


#bookingModal .form-group label{
    margin:0 !important;

    font-size:9.5px !important;
    line-height:1.2 !important;

    font-weight:750 !important;

    color:#333 !important;
}


#bookingModal
.form-group input,
#bookingModal
.form-group select,
#bookingModal
.form-group textarea{
    width:100% !important;

    min-height:34px !important;
    height:34px !important;

    padding:
        5px
        8px !important;

    background:#fff !important;
    color:#111 !important;

    border:
        1px solid
        #cec8c0 !important;

    border-radius:7px !important;

    box-shadow:none !important;

    font-size:10.5px !important;
}


#bookingModal
.form-group textarea{
    min-height:60px !important;
    height:auto !important;
}


#bookingModal
.form-group input:focus,
#bookingModal
.form-group select:focus,
#bookingModal
.form-group textarea:focus{
    outline:none !important;

    border-color:
        var(--m-green) !important;

    box-shadow:
        0 0 0 2px
        var(--m-green-soft) !important;
}


#bookingModal .form-error{
    color:#a12631 !important;

    font-size:9px !important;

    min-height:0 !important;
}


/* ============================================================
   CAPTCHA
   ============================================================ */

#bookingModal .booking-captcha-wrap{
    display:flex !important;

    flex-direction:column !important;

    align-items:flex-start !important;

    margin:
        3px
        0
        10px !important;
}


#bookingModal #bookingRecaptcha{
    transform:
        scale(.86) !important;

    transform-origin:
        left top !important;

    margin-bottom:-10px !important;
}


/* ============================================================
   STICKY ACTIONS
   ============================================================ */

#bookingModal .form-actions{
    position:sticky !important;

    bottom:0 !important;
    z-index:20 !important;

    display:grid !important;

    grid-template-columns:
        minmax(0,1fr)
        100px !important;

    gap:8px !important;

    margin:
        3px
        -20px
        0 !important;

    padding:
        10px
        20px
        12px !important;

    background:
        linear-gradient(
            to bottom,
            rgba(255,255,255,.90),
            #fff 25%
        ) !important;

    border-top:
        1px solid
        #eeeae4 !important;
}


#bookingModal #bookSubmitBtn{
    min-height:36px !important;
    height:36px !important;

    padding:
        6px
        12px !important;

    background:#111 !important;
    color:#fff !important;

    border:
        1px solid
        #111 !important;

    border-radius:7px !important;

    font-size:10.5px !important;
    font-weight:800 !important;

    box-shadow:none !important;
}


#bookingModal #bookSubmitBtn:hover{
    background:
        var(--m-green) !important;

    border-color:
        var(--m-green) !important;
}


#bookingModal #bookCancelBtn{
    min-height:36px !important;
    height:36px !important;

    padding:
        6px
        10px !important;

    background:#f2f2f2 !important;
    color:#333 !important;

    border:
        1px solid
        #d2d2d2 !important;

    border-radius:7px !important;

    font-size:10px !important;
    font-weight:700 !important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:600px){

    #bookingModal{
        padding:6px !important;
    }


    #bookingModal .modal-content{
        max-height:94vh !important;

        padding:
            15px
            12px
            0 !important;

        border-radius:12px !important;
    }


    #bookingModal .modal-content > h2{
        font-size:17px !important;
    }


    #bookingModal .form-row{
        grid-template-columns:
            1fr !important;

        gap:8px !important;
    }


    #bookingModal .form-actions{
        grid-template-columns:
            1fr
            82px !important;

        margin:
            3px
            -12px
            0 !important;

        padding:
            9px
            12px
            10px !important;
    }


    #bookingModal #bookingRecaptcha{
        transform:
            scale(.78) !important;

        margin-bottom:-17px !important;
    }
}
