/*==================================================
HIGHFIELD BOOKING MODAL
==================================================*/
.booking-modal{position:relative;border:none;border-radius:28px;overflow:hidden;background:#ffffff;box-shadow:0 35px 100px rgba(0,0,0,.20);}
.modal-dialog{max-width:1100px;}
.modal-backdrop.show{opacity:.78;backdrop-filter:blur(8px);}

/*==================================================
WRAPPER
==================================================*/
.booking-wrapper{display:grid;grid-template-columns:36% 64%;min-height:650px;}

/*==================================================
LEFT PANEL
==================================================*/
.booking-left{position:relative;overflow:hidden;background:#000;}
.booking-left img{width:100%;height:100%;object-fit:cover;transition:8s ease;}
.booking-modal:hover .booking-left img{transform:scale(1.08);}

/*==================================================
OVERLAY
==================================================*/
.booking-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:45px;color:#fff;background:linear-gradient(to top,rgba(40,18,20,.95),rgba(40,18,20,.20));}
.booking-tag{display:inline-flex;align-self:flex-start;padding:8px 18px;border-radius:50px;background:rgba(255,255,255,.12);backdrop-filter:blur(10px);text-transform:uppercase;letter-spacing:2px;font-size:.70rem;margin-bottom:20px;}
.booking-overlay h2{margin:0;color:#fff;font-size:3rem;line-height:1;letter-spacing:4px;}
.booking-overlay h5{color:#EED7A1;margin-top:8px;margin-bottom:25px;font-weight:400;}
.booking-stars{color:#D6B46A;font-size:20px;margin-bottom:20px;}
.booking-overlay p{line-height:1.8;color:rgba(255,255,255,.92);margin-bottom:25px;}
.booking-location{display:flex;align-items:center;gap:10px;color:#fff;}
.booking-location i{color:#D6B46A;}

/*==================================================
RIGHT PANEL
==================================================*/
.booking-right{padding:40px;background:#FAF7F2;}
.booking-header{margin-bottom:30px;}
.booking-header small{display:block;color:#8D6B45;letter-spacing:3px;text-transform:uppercase;font-size:.75rem;margin-bottom:10px;}
.booking-header h3{font-size:2.2rem;margin-bottom:8px;color:#2E1B17;}
.booking-header p{margin:0;color:#7A706B;}

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

/*.booking-right .row{row-gap:16px;}*/

/*==================================================
FIELDS
==================================================*/
.booking-field{position:relative;}
.booking-field i{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:#8D6B45;font-size:17px;z-index:2;}
.booking-field.textarea i{top:22px;transform:none;}
.booking-field input,.booking-field select,.booking-field textarea{width:100%;border:1px solid #E5DDD3;background:#fff;border-radius:16px;padding-left:52px;padding-right:18px;height:48px;font-size:.95rem;transition:.30s;box-shadow:none;}
.booking-field textarea{height:120px;padding-top:16px;resize:none;}
.booking-field input:focus,.booking-field select:focus,.booking-field textarea:focus{outline:none;border-color:#6C2334;box-shadow:0 0 0 4px rgba(108,35,52,.08);}
.booking-field input::placeholder,.booking-field textarea::placeholder{color:#999;}

/*==================================================
CHECKBOX
==================================================*/
.booking-check{display:flex;align-items:center;gap:10px;font-size:.9rem;color:#666;}
.booking-check input{width:18px;height:18px;}

/*==================================================
BOTTOM
==================================================*/
.booking-footer{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:20px;border-top:1px solid #ECE3D8;}
.booking-features{display:flex;gap:20px;flex-wrap:wrap;}
.booking-features span{display:flex;align-items:center;gap:8px;font-size:.9rem;color:#6A635E;}
.booking-features i{color:#6C2334;}

/*==================================================
BUTTON
==================================================*/
.booking-submit{display:flex;align-items:center;gap:10px;border:none;background:#6C2334;color:#fff;border-radius:50px;padding:15px 34px;font-weight:600;transition:.35s;}
.booking-submit:hover{background:#4C1825;transform:translateY(-2px);box-shadow:0 12px 30px rgba(76,24,37,.25);}

/*==================================================
CLOSE
==================================================*/
.booking-close{position:absolute;top:18px;right:18px;width:44px;height:44px;border:none;border-radius:50%;background:#6C2334;color:#fff;display:flex;align-items:center;justify-content:center;z-index:100;transition:.35s;}
.booking-close:hover{transform:rotate(90deg);background:#4C1825;}

/*==================================================
LARGE DESKTOP
==================================================*/
@media (min-width:1600px){
    .modal-dialog{max-width:1200px;}
    .booking-wrapper{grid-template-columns:380px 1fr;}
    .booking-right{padding:50px;}
}

/*==================================================
LAPTOP
==================================================*/
@media (max-width:1200px){
    .modal-dialog{max-width:980px;}
    .booking-wrapper{grid-template-columns:320px 1fr;}
    .booking-right{padding:35px;}
    .booking-overlay{padding:35px;}
    .booking-overlay h2{font-size:2.5rem;}
    .booking-header h3{font-size:2rem;}
}

/*==================================================
MOBILE
==================================================*/
@media (max-width:767px){
    .modal-dialog{margin:12px;}
    .booking-modal{border-radius:22px;}
    .booking-left{height:220px;}
    .booking-overlay{padding:25px;}
    .booking-overlay h2{font-size:1.8rem;}
    .booking-overlay h5{font-size:1rem;}
    .booking-location{font-size:.9rem;}
    .booking-right{padding:22px;}
    .booking-header{margin-bottom:20px;}
    .booking-header h3{font-size:1.6rem;}
    .booking-field input,.booking-field select{height:50px;}
    .booking-field textarea{height:110px;}
    .booking-footer{gap:15px;}
    .booking-features{justify-content:center;}
    .booking-submit{width:100%;justify-content:center;}
}

/*==================================================
SMALL MOBILE
==================================================*/
@media (max-width:575px){
    .booking-overlay{text-align:center;align-items:center;}
    .booking-tag{margin-bottom:15px;}
    .booking-overlay h2{font-size:1.6rem;}
    .booking-overlay p{display:none;}
    .booking-location{justify-content:center;}
    .booking-right{padding:20px;}
    .booking-header p{display:none;}
    .booking-close{width:40px;height:40px;top:12px;right:12px;}
    .booking-field{margin-bottom:6px;}
    .booking-submit{padding:14px 22px;}
    .booking-features{flex-direction:column;align-items:center;gap:10px;}
}

/*==================================================
320px DEVICES
==================================================*/
@media (max-width:380px){
    .booking-overlay h2{font-size:1.4rem;}
    .booking-overlay h5{font-size:.9rem;}
    .booking-header h3{font-size:1.4rem;}
    .booking-field input,.booking-field select{padding-left:46px;font-size:.9rem;}
    .booking-field i{left:15px;}
}

/*==================================================
MODAL ANIMATION
==================================================*/
.modal.fade .modal-dialog{transform:translateY(40px) scale(.96);transition:all .35s ease;}
.modal.show .modal-dialog{transform:translateY(0) scale(1);}

/*==================================================
SUCCESS
==================================================*/
.booking-success{text-align:center;padding:40px 20px;}
.success-icon{font-size:70px;color:#28a745;margin-bottom:25px;}
.booking-success h3{margin-bottom:15px;}
.booking-success p{color:#666;margin-bottom:18px;}
.reservation-number{background:#F8F5F0;border-radius:12px;padding:18px;margin:25px auto;font-size:15px;max-width:320px;}
.reservation-number strong{display:block;margin-top:8px;font-size:22px;color:#5A1E2C;}

/*==================================================
ALERT
==================================================*/
.booking-alert{border-radius:12px;margin-bottom:20px;}