/* Africa Collection responsive refinements. Framework files and Server Connect data stay unchanged. */
.ac-responsive-dialog { width: 75%; }
.ac-itinerary-stay .card-img-top { aspect-ratio: 16 / 10; object-fit: cover; }
.ac-itinerary-day-copy, .ac-itinerary-day-images { min-width: 0; }
.ac-itinerary-summary-enquire { min-height: 48px; background: #98181b; border-color: #98181b; color: #fff; }
.ac-itinerary-summary-enquire:hover { background: #751316; border-color: #751316; color: #fff; }

@media (max-width: 991.98px) {
  .ac-nav .navbar-nav { width: 100%; }
  .ac-nav .dropdown-menu { max-width: 100%; }
  .ac-nav .dropdown-menu .container { padding-inline: 0; }
  .ac-nav .navbar-nav > .nav-link,
  .ac-nav .navbar-nav > .nav-item > .nav-link { min-height: 48px; padding: .75rem 0 !important; display: flex; align-items: center; }
  .ac-nav .dropdown-item { overflow-wrap: anywhere; }
  .ac-nav .dropdown-menu .nav-link { padding-block: .65rem; }
  .ac-itinerary-day-images img { width: 100%; height: auto; border-radius: .75rem; }
}

@media (max-width: 767.98px) {
  /* Constrain the actual layouts instead of masking overflow with overflow-x:hidden. */
  #slideshow_main_page, #slideshow_main_page .swiper-slide { max-width: 100%; }
  .ac-nav .navbar > a[href^="tel:"] { font-size: clamp(1rem, 4.4vw, 1.4rem); letter-spacing: .04rem; }
  .ac2024_col_bg_grey3 .list-group-horizontal { flex-wrap: wrap; justify-content: center; row-gap: .75rem; max-width: 100%; }
  .ac-nav .navbar-toggler { min-width: 48px; min-height: 44px; }
  .ac-itinerary-view #slideshow_main_page,
  .ac-itinerary-view #slideshow_main_page .swiper-slide {
    height: 76vh !important;
    height: 76svh !important;
    min-height: 520px;
    max-height: 680px;
  }
  .ac-itinerary-view #slideshow_main_page::after {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, rgba(0,0,0,.18), transparent 35%, rgba(0,0,0,.64));
  }
  .ac-itinerary-view .ac-slideshow-overlay-wording {
    top: auto !important; bottom: 1.5rem; padding-inline: 1.25rem; height: auto;
  }
  .ac-itinerary-view .ac-slideshow-overlay-wording > div {
    top: auto; transform: none; width: 100%; float: none !important;
  }
  .ac-itinerary-view .ac-slideshow-overlay-wording .main-ss-heading {
    font-size: clamp(1.2rem, 5.2vw, 1.65rem); line-height: 1.2; letter-spacing: .08rem;
  }
  .ac-itinerary-view .ac-slideshow-overlay-wording .main-ss-heading small { display: block; font-size: .8em; margin-top: .4rem; }
  .ac-itinerary-view .ac-slideshow-overlay-wording .btn { font-size: 1rem; min-height: 48px; background: #98181b; border-color: #98181b; color: #fff; }
  .ac-itinerary-view .ac-slideshow-overlay-wording .btn:hover { background: #751316; border-color: #751316; }
  .ac-itinerary-page { font-size: 1rem; line-height: 1.65; }
  .ac-itinerary-page .ac2024_6 { letter-spacing: .015rem; }
  .ac-itinerary-page .ac2024_7 { letter-spacing: .07rem; }
  #ac-itinerary-detail { padding: 1rem 1.25rem; }
  #ac-itinerary-detail h1 { font-size: clamp(1.6rem, 6.5vw, 2rem); line-height: 1.2; }
  #ac-itinerary-detail .text-justify { text-align: left !important; }
  .ac-itinerary-summary > .container { padding-inline: 1.25rem; }
  .ac-itinerary-summary p { overflow-wrap: anywhere; }
  .ac-itinerary-price { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #b5bdad; }
  .ac-itinerary-price > .row { margin-inline: 0; }
  .ac-itinerary-price #repeat_itineraries_symbols { justify-content: flex-start !important; flex-wrap: wrap; gap: .75rem; }
  .ac-itinerary-price #repeat_itineraries_symbols img { margin-left: 0 !important; max-height: 36px; width: auto; }
  .ac-itinerary-price .mt-4 { margin-top: 1rem !important; }
  .ac-itinerary-tabs { position: sticky; top: 0; z-index: 1010; padding: .25rem .5rem !important; }
  #navTabs1_tabs { flex-wrap: nowrap; gap: .25rem; margin: 0; padding: 0 !important; }
  #navTabs1_tabs .nav-item { flex: 1 1 0; min-width: 0; padding: 0 !important; }
  #navTabs1_tabs .nav-link {
    display: flex; align-items: center; justify-content: center; min-height: 52px;
    padding: .65rem .25rem; font-size: .78rem; letter-spacing: .025rem; border-bottom-width: 3px;
  }
  .ac-itinerary-days { border-left: 0 !important; margin-inline: 0; padding-inline: 1.25rem !important; }
  .ac-itinerary-day { padding-bottom: 1.5rem !important; border-color: #d9ded5 !important; }
  .ac-itinerary-day + .ac-itinerary-day { padding-top: .75rem; }
  .ac-itinerary-day-copy .ac-bigger-leadingB { line-height: 1.75; }
  .ac-itinerary-day-copy img { max-width: 100%; height: auto; }
  .ac-itinerary-day-copy figure { max-width: 100%; margin-inline: 0; }
  .ac-itinerary-day-images { padding-top: 0; }
  .ac-itinerary-day-images img { max-height: 320px; object-fit: cover; }
  .ac-itinerary-stay { margin-bottom: 1.5rem; padding-bottom: 1rem; }
  .ac-itinerary-stay .card-header { font-size: 1.25rem !important; line-height: 1.3; padding-top: .75rem; }
  .ac-itinerary-stay .card-text { line-height: 1.65; }
  .ac-itinerary-stay .btn { min-height: 48px; font-size: 1rem; }
  .ac-itinerary-information { padding-inline: 1.25rem; }
  .ac-itinerary-information .accordion .card-header { margin-bottom: .75rem !important; border-radius: .5rem; }
  .ac-itinerary-information .accordion .btn { width: 100%; min-height: 48px; padding: .85rem; text-align: left; white-space: normal; }
  .ac-itinerary-information .card-body { padding-inline: .25rem; }
  .ac-itinerary-information .ac-itin-inc-exc-wording p { line-height: 1.65; margin-bottom: .75rem; }
  .ac-itinerary-information #repeat_ac_2024_travel_tips > .col-6 { flex: 0 0 100%; width: 100%; }
  .ac-itinerary-enquire { padding-bottom: 1.25rem; }
  .ac-itinerary-enquire .btn { width: 100%; min-height: 48px; }
  .ac-itinerary-page .ac2024_3p5rem { font-size: 2.5rem; }
  #repeat_weather { row-gap: .5rem; }
  #repeat_weather > div { padding-inline: .25rem; }
  #repeat_weather > div > span { border-radius: .4rem; font-size: .72rem; letter-spacing: 0; }
  #repeat_weather_classifications { row-gap: .25rem; }
  .ac-itinerary-map > .row { flex-direction: column; }
  .ac-itinerary-map-route { width: 100% !important; order: 2; padding: .75rem 1.25rem !important; }
  .ac-itinerary-map-route #repeat_map_days { height: auto !important; max-height: none; overflow-y: visible !important; }
  .ac-itinerary-map-route #repeat_map_days > div { margin-right: 0 !important; }
  .ac-itinerary-map-route #repeat_map_days img.img-fluid:not(.symbol-styler-ac) { max-height: 160px; width: 100%; object-fit: cover; }
  .ac-itinerary-map-canvas { width: 100% !important; order: 1; height: 360px; height: clamp(300px, 52svh, 440px); }
  .ac-itinerary-map-canvas #leafletmap1 { height: 100% !important; }
  .ac-itinerary-map-canvas > img { width: 100%; object-fit: contain !important; }
  #page_modal_enquire .ac-responsive-dialog,
  #page_modal_accommodation .ac-responsive-dialog { width: auto; max-width: none; margin: .75rem; }
  #page_modal_enquire .modal-body,
  #page_modal_accommodation .modal-body { padding: 3.75rem 1rem 1.25rem; }
  #page_modal_enquire .btn-close,
  #page_modal_accommodation .btn-close { width: 44px; height: 44px; padding: 0; }
  #page_modal_enquire .form-group { margin-bottom: 1rem; }
  #page_modal_enquire .form-control { font-size: 16px; min-height: 46px; }
  #page_modal_enquire textarea.form-control { min-height: 140px; }
  #page_modal_accommodation .modal-body img { max-width: 100%; }
}

/* Small-screen polish from on-device review. Most layout changes use Bootstrap utilities in the templates. */
@media (max-width: 767.98px) {
  .ac-holiday-steps h3 { font-size: 2.5rem; }
  #newsletter_signup_form button[type="submit"] { min-width: 52px; }
  #swiper-discover-destinations,
  #swiper_accom_widget_dest_page { --swiper-navigation-sides-offset: .5rem !important; }
  #swiper_accom_widget_dest_page { position: relative !important; }
  #swiper-discover-destinations .swiper-button-prev,
  #swiper-discover-destinations .swiper-button-next,
  #swiper_accom_widget_dest_page .swiper-button-prev,
  #swiper_accom_widget_dest_page .swiper-button-next {
    width: 44px; height: 44px; margin-top: -22px; border-radius: 50%;
    background: #fff; color: #69765c; box-shadow: 0 2px 8px rgba(0,0,0,.2); z-index: 20;
    touch-action: manipulation;
  }
  #swiper-discover-destinations .swiper-button-prev::after,
  #swiper-discover-destinations .swiper-button-next::after,
  #swiper_accom_widget_dest_page .swiper-button-prev::after,
  #swiper_accom_widget_dest_page .swiper-button-next::after { font-size: 18px; -webkit-text-stroke: 0; font-weight: 700; }
}
@media (hover: none) {
  #swiper-discover-destinations .zoom:hover { transform: none; }
}

/* Leaflet gives some children their own pointer-events; lock those too in scroll-page mode. */
.ac-itinerary-map-canvas #leafletmap1.pe-none * { pointer-events: none !important; }

/* Keep carousel controls in their own strip, clear of card titles and prices. */
@media (max-width: 767.98px) {
  #swiper-discover-the-best,
  #swiper-discover-destinations { padding-bottom: 72px; }
  #swiper-discover-the-best .swiper-button-prev,
  #swiper-discover-the-best .swiper-button-next,
  #swiper-discover-destinations .swiper-button-prev,
  #swiper-discover-destinations .swiper-button-next {
    top: auto; bottom: 8px; margin-top: 0; width: 48px; height: 48px;
    background: #fff; color: #98181b; border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0,0,0,.2); z-index: 20; touch-action: manipulation;
  }
  #swiper-discover-the-best .swiper-button-prev,
  #swiper-discover-destinations .swiper-button-prev { left: calc(50% - 60px); }
  #swiper-discover-the-best .swiper-button-next,
  #swiper-discover-destinations .swiper-button-next { right: calc(50% - 60px); }
  #swiper-discover-the-best .swiper-button-prev::after,
  #swiper-discover-the-best .swiper-button-next::after,
  #swiper-discover-destinations .swiper-button-prev::after,
  #swiper-discover-destinations .swiper-button-next::after {
    font-size: 22px; -webkit-text-stroke: 2px; font-weight: 700;
  }
}
[aria-controls="ac_route_stops"][aria-expanded="false"] .ac-route-hide,
[aria-controls="ac_route_stops"][aria-expanded="true"] .ac-route-show { display: none; }

/* Match the original red/white carousel controls on desktop as well. */
@media (min-width: 768px) {
  #swiper-discover-destinations .swiper-button-prev,
  #swiper-discover-destinations .swiper-button-next {
    margin-top: -30px; background: #fff; border-radius: 50%;
    width: 60px; height: 60px; color: #98181b;
  }
  #swiper-discover-destinations .swiper-button-prev::after,
  #swiper-discover-destinations .swiper-button-next::after {
    font-size: x-large; -webkit-text-stroke: thick;
  }
}
@media (max-width: 767.98px) {
  /* The section already supplies spacing; avoid an extra gap after its last stay. */
  .ac-itinerary-day .card-deck > .ac-itinerary-stay:last-child { margin-bottom: 0; padding-bottom: 0; }
}

/* Keep the original desktop close treatment and the roomier mobile control. */
@media (min-width: 768px) {
  .modal .ac-responsive-close {
    width: 36px; height: 36px; padding: 0; margin: 0 !important;
    top: -18px !important; right: -18px !important;
    border: 2px solid #fff; background-color: #000 !important;
    background-image: none; box-shadow: 0 1px 4px rgba(0,0,0,.25);
  }
  .modal .ac-responsive-close::before {
    content: ""; position: absolute; inset: 0;
    background: var(--bs-btn-close-bg) center / 14px 14px no-repeat;
    filter: invert(1);
  }
}
/* Shared navigation for accommodation, travel-tip and activity modal slideshows. */
.ac-gallery-modal .swiper-button-prev,
.ac-gallery-modal .swiper-button-next {
  width: 48px; height: 48px; margin-top: -24px; color: #fff;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
}
.ac-gallery-modal .swiper-button-prev::after,
.ac-gallery-modal .swiper-button-next::after { font-size: 44px; -webkit-text-stroke: 0; font-weight: 400; }
@media (max-width: 767.98px) {
  #page_modal_travel_tips .ac-responsive-dialog { width: auto; max-width: none; margin: .75rem; }
  #page_modal_travel_tips .modal-body { padding: 3.75rem 1rem 1.25rem; }
  #page_modal_travel_tips .btn-close { width: 44px; height: 44px; padding: 0; }
  #page_modal_travel_tips .modal-body img { max-width: 100%; height: auto; }
  .ac-itinerary-information .ac-itin-inc-exc-wording p { position: relative; }
  .ac-itinerary-information .ac-itin-inc-exc-wording p::before {
    top: .825em; margin-top: -3px;
  }
  #swiper_accommodation_detail { height: clamp(280px, 85vw, 440px); }
  #swiper_accommodation_detail .swiper-slide,
  #swiper_accommodation_detail .swiper-slide img { width: 100%; height: 100%; }
  #swiper_accommodation_detail .swiper-slide img { object-fit: cover; }
}

@media (max-width: 767.98px) {
  #page_modal_activities .ac-responsive-dialog { width: auto; max-width: none; margin: .75rem; }
  #page_modal_activities .modal-body { padding: 3.75rem 1rem 1.25rem; }
  #page_modal_activities .btn-close { width: 44px; height: 44px; padding: 0; }
  #page_modal_activities .modal-body img { max-width: 100%; height: auto; }
  .ac-gallery-modal .swiper-button-prev::after,
  .ac-gallery-modal .swiper-button-next::after { font-size: 32px; -webkit-text-stroke: 1.5px; }
}

/* APIS uses Bootstrap's responsive grid; keep narrow fields comfortable to fill. */
.ac-apis-page fieldset { min-width: 0; }
.ac-apis-page .form-group { margin-bottom: 1rem; }
.ac-apis-page label { display: inline-block; margin-bottom: .35rem; }
@media (max-width: 767.98px) {
  .ac-apis-page { padding-inline: 1.25rem; }
  .ac-apis-page .text-justify { text-align: left !important; }
  .ac-apis-page .form-control { min-width: 0; max-width: 100%; min-height: 48px; font-size: 16px; }
  .ac-apis-page .form-check-input { width: 1.25rem; height: 1.25rem; }
  .ac-apis-page .form-check-label { padding-left: .5rem; }
}

@media (max-width: 767.98px) {
  .ac-apis-header .ac-nav { background-color: #69765c; }
  .ac-apis-header .navbar > a[href^="tel:"] { color: #fff !important; }
}

/* The older outline class sets white text without a fill; give APIS explicit states. */
#btn_apis_send { color: #98181b; background-color: #fff; border-color: #98181b; }
#btn_apis_send:hover, #btn_apis_send:focus-visible, #btn_apis_send:active {
  color: #fff; background-color: #98181b; border-color: #98181b;
}
#btn_apis_send:disabled { color: #fff; background-color: #69765c; border-color: #69765c; opacity: 1; }
.ac-apis-page .form-floating > label { margin-bottom: 0; }

/* Enquiry fields use the same native Bootstrap floating labels as APIS. */
#page_modal_enquire fieldset { min-width: 0; }
#page_modal_enquire .form-floating > label { margin-bottom: 0; }
#btn_enquiry_send { color: #fff; background-color: #98181b; border-color: #98181b; }
#btn_enquiry_send:hover, #btn_enquiry_send:focus-visible, #btn_enquiry_send:active {
  color: #fff; background-color: #751316; border-color: #751316;
}
#btn_enquiry_send:disabled { color: #fff; background-color: #69765c; border-color: #69765c; opacity: 1; }

@media (max-width: 767.98px) {
  #page_modal_enquire .form-check-input { width: 1.25rem; height: 1.25rem; }
  #page_modal_enquire .modal-footer.d-grid { justify-content: stretch; }
}
