/* Override style.css */
body {
    font-family: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}

.form-control {
    font-family: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}

.owl-carousel.home-slider,
.owl-carousel.home-slider .slider-item,
.owl-carousel.home-slider .slider-item .slider-text {
    height: 92vh !important;
}
.hero-wrap {
  text-shadow: 0 0 10px black;
}

/* Auto-resize the hero title to fit nicely across devices */
.hero-wrap .bread {
    font-size: clamp(24px, 5vw + 0.5rem, 48px) !important;
    line-height: 1.1;
    word-break: break-word;
    overflow-wrap: anywhere;
    text-wrap: balance;
    hyphens: auto;
}

.owl-carousel.home-slider .slider-item .slider-text {
    text-shadow: 0px 0px 10px #13468f;
}

.btn.btn-primary {
    background: #256abb;
    border: 1px solid #256abb;
    color: #fff;
}
.btn.btn-primary:hover {
    border: 1px solid #256abb;
    color: #256abb;
}
.btn.btn-primary.btn-outline-primary:hover {
    border: 1px solid transparent;
    background: #256abb;
    color: #fff;
}

.booking-form .form-group,
.booking-form .btn-primary {
    border-radius: 5px;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #368fc9;
    border-color: #368fc9;
}

.booking-form .btn-primary:hover {
    /* border: 1px solid #256abb; */
    background: #368fc9;
    color: #fff;
    /* color: #256abb; */
}

.heading-section h2:after, .heading-section h2:before {
    background: #256abb;
}
a {
    color: #256abb;
}
a:hover {
    color: #256abb;
}
.booking-form .form-group label {
    color: #256abb;
}
.room .text ul.list li span {
    color: #256abb;
}
.room .text span.price:after {
    background: #256abb94;
}
.room .text h3 {
  font-size: 26px;
    /* font-size: clamp(18px, 5vw + 0.5rem, 26px) !important;
    line-height: 1.1;
    word-break: break-word;
    overflow-wrap: anywhere;
    text-wrap: balance;
    hyphens: auto; */
}
.room .text span.price {
    font-size: 21px;
}

@media (min-width: 992px) {
    /* .ftco-booking .container {
        margin-top: -75vh !important;
    } */
}

@media (min-width: 768px) {
  .ftco-booking .container div[class*=col-] {
    margin-bottom: 18px;
  }
  .ftco-booking .container {
      margin-top: -75vh;
  }
  .owl-carousel .row.no-gutters .col-md-12.ftco-animate {
      padding-top: 360px;
  }
  .owl-carousel .carousel-company-logo {
      width: 250px !important;
  }
}

@media (max-width: 767px) {
  .owl-carousel .carousel-company-logo {
      width: 180px !important;
  }
  .booking-form .form-control {
    border: 1px solid #ced4da !important;
    padding: 0.375rem 0.75rem;
  }
  .booking-form .form-group .icon {
    right: 13px !important;
  }
  .ftco-booking .container div[class*=col-] {
    margin-bottom: 0px;
  }
}
@media (max-width: 576px) {
  .hero-wrap,
  .hero-wrap .container,
  .hero-wrap .row,
  .hero-wrap .ftco-animated {
    height: 25vh !important;
    max-height: 25vh !important;
  }

  /* .hero-wrap .slider-text .bread {
    font-size: 40px;
  } */

  .owl-carousel.home-slider .slider-item .slider-text h2 {
    font-size: 18px;
  }
}

@media (max-width: 575px) {
  
}

.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
    width: 35px !important;
    height: 35px !important;
    font-size: 15px !important;
}
.daterangepicker td.off.disabled {
    color: #dc3545 !important; /* Bootstrap danger/red */
    background: #f8d7da !important; /* Optional: light red background */
}
.daterangepicker td.in-range {
    background-color: #9ce0ff !important;
    border-color: transparent !important;
    color: #000 !important;
    border-radius: 0 !important;
}
/* .daterangepicker td.off.disabled.active.start-date {
    background-color: #357ebd !important;
    border-color: transparent !important;
    color: #fff !important;
    text-decoration: none !important;
} */
.daterangepicker td.off.disabled.active.start-date,
.daterangepicker td.off.disabled.active.end-date {
    background-color: #ffc107 !important;
    color: #000 !important;
    text-decoration: line-through !important;
    border-color: transparent !important;
}
.daterangepicker td.off.disabled.in-range {
    background-color: #fff3cd !important;
    color: #856404 !important;
    text-decoration: line-through !important;
    border-color: transparent !important;
}
.daterangepicker td.in-range.end-date {
    background-color: #357ebd !important;
    border-color: transparent !important;
    color: #fff !important;
    text-decoration: none !important;
}
.daterangepicker td.off.ends {
    visibility: hidden !important;
    pointer-events: none !important;
    height: 0px !important;
}

.modal-dialog.modal-xl {
    max-width: 1200px !important;
}
div.dataTables_wrapper div.dataTables_length select {
    width: 60px !important;
}
/* @media (max-width: 768px) {
    .daterangepicker {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        left: 0 !important;
        right: 0 !important;
        border-radius: 0 !important;
    }
    .daterangepicker .drp-calendar,
    .daterangepicker .drp-buttons {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100vw !important;
    }
} */
@media (min-width: 576px) {
    .modal-dialog.modal-lg {
        max-width: 700px !important;
    }
}
@media (max-width: 576px) {
    .daterangepicker {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        height: 100% !important;
        max-width: 100% !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        z-index: 9999 !important;
        margin: 0 !important;
        box-shadow: none !important;
    }
    .daterangepicker .drp-calendar,
    .daterangepicker .drp-buttons {
        width: 100% !important;
    }
    .daterangepicker .drp-calendar {
        min-width: 0 !important;
        max-width: 100vw !important;
    }
    .daterangepicker .drp-buttons {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #fff;
        z-index: 10000;
    }
    .daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
        width: 35px !important;
        height: 5.5vh !important;
        font-size: 15px !important;
    }
}

/* Animate */
@keyframes shake {
    0% { transform: translateX(0); }
    20% { transform: translateX(-8px); }
    40% { transform: translateX(8px); }
    60% { transform: translateX(-8px); }
    80% { transform: translateX(8px); }
    100% { transform: translateX(0); }
}
.room-bookings-animate {
    animation: shake 0.5s;
    background: #fff3cd !important; /* yellow highlight */
    border-radius: 4px;
    transition: background 1s;
}

/* Bootstrap Popover */
#guest-selector-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    z-index: 1040 !important; /* below popover (1060) and guest-selector-group (1051) */
}

.popover-backdrop-focus.show-popover {
    position: relative !important;
    z-index: 1051 !important; /* above backdrop, below popover */
}

.popover {
    z-index: 1060 !important;
}

.children-age-container {
    max-height: 25vh;
    overflow-x: auto;
}

.popover .form-control {
    height: 40px !important;
}

body.guest-selector-open {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
    left: 0 !important;
}

@media (max-width: 576px) {
  .guest-selector-popover {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 1rem !important;
    border: none !important;
    border-radius: 0 !important;
    transform: none !important;
    background-color: #fff !important;
  }

  .guest-selector-popover .arrow {
    display: none !important;
  }

  .guest-selector-popover .popover-body {
    height: 100%;
    overflow-y: auto;
    padding: 1rem;
  }

  .guest-selector-popover .popover-body::before {
    content: "";
    display: block;
    height: 40px;
  }

  .children-age-container {
    max-height: 53vh;
    min-height: 53vh;
  }

  .guest-selector-popover .popover-body {
    max-height: 100vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

