/* ---- With Sakhi custom overrides ---- */

/* ==========================================================================
   Buttons – site-wide brand colours
   Background #046BDB with white text; hover/focus flips to #ECC900 + black.
   The WhatsApp chat buttons and the Instagram feed loader keep their own
   colours, so they are excluded below.
   ========================================================================== */
.elementor-button,
a.elementor-button,
button.elementor-button,
.wp-block-button__link,
.more-link.link-background,
button.button-style,
button.booking_form_submit,
.booking_form .booking_form_submit,
.babe_booking_form .booking_form_submit,
.btn.button,
.btn-primary,
.btn-search,
input[type="submit"],
.wpcf7-form input[type="submit"],
.wpcf7-submit,
.mc4wp-form input[type="submit"] {
    background-color: #046BDB !important;
    border-color: #046BDB !important;
    color: #ffffff !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.elementor-button:hover,
.elementor-button:focus,
a.elementor-button:hover,
a.elementor-button:focus,
button.elementor-button:hover,
button.elementor-button:focus,
.wp-block-button__link:hover,
.wp-block-button__link:focus,
.more-link.link-background:hover,
.more-link.link-background:focus,
button.button-style:hover,
button.button-style:focus,
button.booking_form_submit:hover,
button.booking_form_submit:focus,
.booking_form .booking_form_submit:hover,
.booking_form .booking_form_submit:focus,
.babe_booking_form .booking_form_submit:hover,
.babe_booking_form .booking_form_submit:focus,
.btn.button:hover,
.btn.button:focus,
.btn-primary:hover,
.btn-primary:focus,
.btn-search:hover,
.btn-search:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
.wpcf7-form input[type="submit"]:hover,
.wpcf7-submit:hover,
.mc4wp-form input[type="submit"]:hover {
    background-color: #ECC900 !important;
    border-color: #ECC900 !important;
    color: #000000 !important;
}

/* Icons and inner spans follow the button's text colour */
.elementor-button .elementor-button-text,
.elementor-button .elementor-button-icon,
.elementor-button .elementor-button-icon i,
.elementor-button .elementor-button-icon svg,
button.button-style .elementor-button-icon,
button.booking_form_submit .elementor-button-icon,
button.booking_form_submit i {
    color: inherit !important;
    fill: currentColor !important;
}
.elementor-button:hover .elementor-button-text,
.elementor-button:hover .elementor-button-icon,
.elementor-button:hover .elementor-button-icon i,
.elementor-button:focus .elementor-button-text,
.elementor-button:focus .elementor-button-icon,
button.button-style:hover .elementor-button-icon,
button.button-style:hover i,
button.booking_form_submit:hover .elementor-button-icon,
button.booking_form_submit:hover i,
button.booking_form_submit:focus .elementor-button-icon,
button.booking_form_submit:focus i {
    color: #000000 !important;
}

/* Keep the WhatsApp buttons on WhatsApp green – the floating chat widget is
   left entirely alone, and the hero "Chat On WhatsApp" button keeps its brand
   colour. Every other button, including "View Availability", turns blue. */
.elementor-element-cb51188 .elementor-button {
    background-color: #017D67 !important;
    border-color: #017D67 !important;
    color: #ffffff !important;
}
.elementor-element-cb51188 .elementor-button:hover,
.elementor-element-cb51188 .elementor-button:focus {
    background-color: #ECC900 !important;
    border-color: #ECC900 !important;
    color: #000000 !important;
}

/* ==========================================================================
   Booking form
   ========================================================================== */

/* Extra services – keep long labels inside the card */
.booking_form .services_group,
.booking_form .service_item,
.booking_form .service_item label,
.booking_form .service_title,
.booking_form label {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.booking_form .service_item label,
.booking_form .services_group label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

/* ==========================================================================
   Tour cards
   ========================================================================== */

/* Thumbnail fills the card and every card keeps the same shape */
.babe_shortcode_block .grid-item:not(.babe_items_list) .item-thumb,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item_img {
    width: 100%;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
}
.babe_shortcode_block .grid-item:not(.babe_items_list) .item-thumb > img,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item_img > img,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item-thumb a > img,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item_img a > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Tour listings inside centre-aligned containers must still span full width */
.elementor-widget-babe-search-results,
.elementor-widget-babe-all-items {
    width: 100%;
    align-self: stretch;
}

/* ==========================================================================
   Single tour gallery – keep the slideshow a sane height whatever the
   source images are (portrait reels shots were making it ~1000px tall).
   ========================================================================== */
.elementor-widget-babe-item-slideshow .swiper-slide,
.elementor-widget-babe-item-slideshow .swiper-slide > a {
    display: block;
    height: 440px;
    overflow: hidden;
}
.elementor-widget-babe-item-slideshow .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}
@media (max-width: 1024px) {
    .elementor-widget-babe-item-slideshow .swiper-slide,
    .elementor-widget-babe-item-slideshow .swiper-slide > a {
        height: 360px;
    }
}
@media (max-width: 767px) {
    .elementor-widget-babe-item-slideshow .swiper-slide,
    .elementor-widget-babe-item-slideshow .swiper-slide > a {
        height: 260px;
    }
}

/* ==========================================================================
   Tour cards & single tour: price and title colours
   ========================================================================== */

/* Price (₹ symbol + amount) in brand blue, everywhere it appears */
.currency_amount,
.currency_amount .currency_symbol,
.item_info_price .currency_amount,
.babe_shortcode_block .currency_amount,
.price_from .currency_amount,
.elementor-widget-babe-item-price-from .currency_amount,
.babe_price .currency_amount,
.booking_form .currency_amount {
    color: #046BDB !important;
}

/* Tour title turns brand blue on hover */
.item_title a,
.babe_shortcode_block .item_title a,
.item-title a,
h3.item_title a,
h4.item_title a {
    transition: color .2s ease;
}
.item_title a:hover,
.item_title a:focus,
.babe_shortcode_block .item_title a:hover,
.babe_shortcode_block .item_title a:focus,
.item-title a:hover,
.item-title a:focus,
h3.item_title a:hover,
h4.item_title a:hover {
    color: #046BDB !important;
}

/* Tour grids: let 1fr tracks shrink, otherwise a long location line blows one
   column up and squeezes the rest to zero width. */
.babe_shortcode_block_inner.d-grid > * {
    min-width: 0;
}
.babe_shortcode_block_inner.d-grid .item_info_address,
.babe_shortcode_block_inner.d-grid .item_title {
    overflow-wrap: anywhere;
}

/* ==========================================================================
   Links: the normal state keeps the theme's own text colour, so body copy,
   post titles and meta stay black. Brand blue is used for hover/focus only.
   ========================================================================== */
.entry-content a:not(.elementor-button):not(.button):not([class*="btn"]):hover,
.entry-content a:not(.elementor-button):not(.button):not([class*="btn"]):focus,
.elementor-widget-text-editor a:not(.elementor-button):hover,
.elementor-widget-text-editor a:not(.elementor-button):focus,
.elementor-widget-theme-post-content a:not(.elementor-button):hover,
.babe_post_content a:not(.elementor-button):hover,
.item_content a:not(.elementor-button):hover,
.elementor-widget-babe-item-content a:not(.elementor-button):hover,
.block_faq_content a:hover,
.post_content a:not(.elementor-button):hover,
.comment-content a:hover,
.post_title a:hover,
.entry-title a:hover {
    color: #046BDB !important;
}

/* ==========================================================================
   Booking form
   ========================================================================== */

/* Extra services – keep long labels inside the card */
.booking_form .services_group,
.booking_form .service_item,
.booking_form .service_item label,
.booking_form .service_title,
.booking_form label {
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.booking_form .service_item label,
.booking_form .services_group label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

/* ==========================================================================
   Tour cards
   ========================================================================== */

/* Thumbnail fills the card and every card keeps the same shape */
.babe_shortcode_block .grid-item:not(.babe_items_list) .item-thumb,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item_img {
    width: 100%;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
}
.babe_shortcode_block .grid-item:not(.babe_items_list) .item-thumb > img,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item_img > img,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item-thumb a > img,
.babe_shortcode_block .grid-item:not(.babe_items_list) .item_img a > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Tour listings inside centre-aligned containers must still span full width */
.elementor-widget-babe-search-results,
.elementor-widget-babe-all-items {
    width: 100%;
    align-self: stretch;
}

/* ==========================================================================
   Single tour gallery – keep the slideshow a sane height whatever the
   source images are (portrait reels shots were making it ~1000px tall).
   ========================================================================== */
.elementor-widget-babe-item-slideshow .swiper-slide,
.elementor-widget-babe-item-slideshow .swiper-slide > a {
    display: block;
    height: 440px;
    overflow: hidden;
}
.elementor-widget-babe-item-slideshow .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}
@media (max-width: 1024px) {
    .elementor-widget-babe-item-slideshow .swiper-slide,
    .elementor-widget-babe-item-slideshow .swiper-slide > a {
        height: 360px;
    }
}
@media (max-width: 767px) {
    .elementor-widget-babe-item-slideshow .swiper-slide,
    .elementor-widget-babe-item-slideshow .swiper-slide > a {
        height: 260px;
    }
}

/* ==========================================================================
   Tour cards & single tour: price and title colours
   ========================================================================== */

/* Price (₹ symbol + amount) in brand blue, everywhere it appears */
.currency_amount,
.currency_amount .currency_symbol,
.item_info_price .currency_amount,
.babe_shortcode_block .currency_amount,
.price_from .currency_amount,
.elementor-widget-babe-item-price-from .currency_amount,
.babe_price .currency_amount,
.booking_form .currency_amount {
    color: #046BDB !important;
}

/* Tour title turns brand blue on hover */
.item_title a,
.babe_shortcode_block .item_title a,
.item-title a,
h3.item_title a,
h4.item_title a {
    transition: color .2s ease;
}
.item_title a:hover,
.item_title a:focus,
.babe_shortcode_block .item_title a:hover,
.babe_shortcode_block .item_title a:focus,
.item-title a:hover,
.item-title a:focus,
h3.item_title a:hover,
h4.item_title a:hover {
    color: #046BDB !important;
}

/* Tour grids: let 1fr tracks shrink, otherwise a long location line blows one
   column up and squeezes the rest to zero width. */
.babe_shortcode_block_inner.d-grid > * {
    min-width: 0;
}
.babe_shortcode_block_inner.d-grid .item_info_address,
.babe_shortcode_block_inner.d-grid .item_title {
    overflow-wrap: anywhere;
}

/* ==========================================================================
   Links inside page/post/tour content use the brand blue. Navigation, footer
   and buttons keep their own colours.
   ========================================================================== */
.entry-content a:not(.elementor-button):not(.button):not([class*="btn"]),
.elementor-widget-text-editor a:not(.elementor-button),
.elementor-widget-theme-post-content a:not(.elementor-button),
.babe_post_content a:not(.elementor-button),
.item_content a:not(.elementor-button),
.elementor-widget-babe-item-content a:not(.elementor-button),
.block_faq_content a,
.post_content a:not(.elementor-button),
.comment-content a {
    color: #046BDB;
    text-decoration: none;
    transition: color .2s ease;
}
.entry-content a:not(.elementor-button):not(.button):not([class*="btn"]):hover,
.elementor-widget-text-editor a:not(.elementor-button):hover,
.elementor-widget-theme-post-content a:not(.elementor-button):hover,
.babe_post_content a:not(.elementor-button):hover,
.item_content a:not(.elementor-button):hover,
.elementor-widget-babe-item-content a:not(.elementor-button):hover,
.block_faq_content a:hover,
.post_content a:not(.elementor-button):hover,
.comment-content a:hover {
    color: #046BDB;
    text-decoration: underline;
}

/* Sidebar list style (Last Minute Deals) keeps its own small thumb + text row */
.babe_items_list .item_title,
.babe_items_list .item_title a {
    overflow-wrap: normal;
    word-break: normal;
}

/* ==========================================================================
   Headings: one fluid scale for every device.
   clamp(min, preferred, max) — the middle value grows with the viewport, so
   headings shrink smoothly on phones without any breakpoint jumps.

   Only H2 is forced (it was a flat 40px everywhere and had to come down).
   H1/H3/H4 get the scale as a default, so any heading that was deliberately
   sized — the logo lockup, card titles, small labels — keeps its own size.
   ========================================================================== */
h1,
.entry-content h1 {
    font-size: clamp(1.75rem, 1.15rem + 2.6vw, 2.5rem);
    line-height: 1.18;
}
h2:not(.item_title):not(.block_faq_title):not(.elementor-icon-box-title),
.elementor-widget-heading h2.elementor-heading-title {
    font-size: clamp(1.5rem, 1.05rem + 1.9vw, 2.125rem) !important;
    line-height: 1.22 !important;
}
h3,
h4,
.entry-content h3,
.entry-content h4 {
    line-height: 1.28;
}
h3 {
    font-size: clamp(1.25rem, 0.98rem + 1.15vw, 1.625rem);
}
h4 {
    font-size: clamp(1.125rem, 0.98rem + 0.6vw, 1.375rem);
}

/* Headings that are part of a component, not page structure, keep their size */
.item_title,
.item_title a,
.block_faq_title,
.babe_items_list .item_title,
.elementor-widget-babe-item-title h1,
.elementor-widget-babe-item-title h2,
.site-branding h1,
.site-branding h2 {
    font-size: revert !important;
    line-height: inherit !important;
}