/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/

/* Home Slider Gradient Overlay */
.home-slide .fusion-column-wrapper::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, rgba(0, 193, 199, 0.5) 0%, rgba(0, 94, 97, 0.1) 100%);
  z-index: 1;
  pointer-events: none;
  border-radius: 15px; /* Match the slide's border radius */
}

.home-slide .fusion-column-wrapper > * {
  position: relative;
  z-index: 2;
}

/* Home Slider Height and Vertical Centering */
.home-slide .fusion-column-wrapper {
  min-height: 500px;
  height: 500px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 60px 50px !important;
}
.fusion-search-button .fusion-search-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.fusion-search-button .fusion-search-submit .fontawesome-icon {
  margin-right: 0;
  font-size: 28px;
  padding: 5px;
  line-height: 1;
  pointer-events: none;
}

.learn-more-link {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
	gap: 0.5rem;
  text-decoration: none;
}

.learn-more-link:hover,
.learn-more-link:focus {
}

.learn-more-link::after {
  content: "\f105";
  font-family: "awb-icons";
  font-size: 1.1em;
  line-height: 1;
  flex: 0 0 auto;
  position: relative;
  top: 0px;
}


.external-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.external-link::after {
  content: "\e916";
  font-family: "interface";
  font-size: 1em;
  line-height: 1;
  color: currentColor;
  flex: 0 0 auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* MENU */
.awb-menu_icons-right .awb-menu__sub-a:has(.awb-menu__i_sub) > span {
    display: flex;
    align-items: center;
    width: 100%;
}
.awb-menu_icons-right .awb-menu__i_sub {
    order: 1;
    margin-left: auto;
    flex-shrink: 0;
    order: 1;
    margin-left: auto;
    flex-shrink: 0;
    padding-inline-start: 1em;
    padding-inline-end: 0em;
}

/* ── Search: cancel button — white X for header live search ── */
.fusion-live-search-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    display: inline-block;
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    opacity: 0.7;
    margin-right: 6px;
}
.fusion-live-search-input::-webkit-search-cancel-button:hover {
    opacity: 1;
}

/* ── Search: cancel button — dark X for page search form ── */
.fusion-search-form:not(.fusion-live-search) input.s::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
    display: none;
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23212934' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    opacity: 0.5;
    margin-right: 6px;
}
.fusion-search-form:not(.fusion-live-search) input.s::-webkit-search-cancel-button:hover {
    opacity: 0.9;
}

/* ── Search: always show submit icon in white ── */
/* Search: page search form uses the header-style icon layout. */
.fusion-search-form:not(.fusion-live-search) .fusion-search-form-content {
    position: relative;
    display: flex;
    align-items: center;
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-field,
.fusion-search-form:not(.fusion-live-search) .fusion-search-field label {
    display: block;
    width: 100%;
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-field label {
    position: relative;
}

.fusion-search-form:not(.fusion-live-search) input.s {
    padding-left: 68px !important;
    padding-right: 58px !important;
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-button {
    position: absolute;
    top: 50%;
    left: 22px;
    z-index: 2;
    width: 34px;
    height: 34px;
    transform: translateY(-50%);
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-button .fusion-search-submit .fontawesome-icon {
    font-size: 32px;
    padding: 0;
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-clear {
    position: absolute;
    top: 50%;
    right: 22px;
    z-index: 2;
    display: none;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    opacity: 0.65;
    transform: translateY(-50%);
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-clear::before,
.fusion-search-form:not(.fusion-live-search) .fusion-search-clear::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 28px;
    height: 2px;
    background: #212934;
    border-radius: 2px;
    transform-origin: center;
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-clear::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-clear::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.fusion-search-form:not(.fusion-live-search) .fusion-search-clear:hover,
.fusion-search-form:not(.fusion-live-search) .fusion-search-clear:focus {
    opacity: 0.95;
}

.fusion-search-form:not(.fusion-live-search) input.s:not(:placeholder-shown) + .fusion-search-clear,
.fusion-search-form:not(.fusion-live-search) input.s:focus + .fusion-search-clear {
    display: block;
}

.fusion-search-button .fusion-search-submit,
.fusion-search-button .fusion-search-submit .fontawesome-icon {
    color: #ffffff !important;
}

/* ── Search: page search form submit icon in dark ── */
.fusion-search-form:not(.fusion-live-search) .fusion-search-button .fusion-search-submit,
.fusion-search-form:not(.fusion-live-search) .fusion-search-button .fusion-search-submit .fontawesome-icon {
    color: #212934 !important;
}

/* ── Search: smooth fade for submit button when loader toggles ── */
.fusion-search-button .fusion-search-submit {
    transition: opacity 0.35s ease;
}
.fusion-search-button:has(.fusion-slider-loading[style*="display: block"]) .fusion-search-submit {
    opacity: 0;
    pointer-events: none;
}

/* ── Search: loader fade-in so it doesn't overlap the icon during fade-out ── */
.fusion-search-button .fusion-slider-loading {
    animation:
        fusion-rotate 0.8s infinite linear,
        fadeInLoader 0.35s ease 0.35s both;
}
@keyframes fadeInLoader {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── Scrollspy sidebar anchor nav ── */

/* Strip Avada's current-menu-item active background/colour from ALL sub-li items —
   scrollspy JS will control which one is active.
   White background prevents the outer current-menu-parent teal from bleeding through. */
.has-anchor-scrollspy > .menu-item {
    transition: background-color 0.2s ease;
}
.has-anchor-scrollspy > .menu-item > .awb-menu__sub-a {
    color: var(--awb-submenu-color, #212934) !important;
    font-weight: normal !important;
}
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active) {
    background-color: var(--awb-color2);

}

/* current-menu-item without scrollspy active: keep default submenu colour */
/*
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active) > .awb-menu__sub-a {
    color: var(--awb-submenu-color, #212934)
    font-weight: normal !important;
}

 .awb-menu__sub-li.expanded, .awb-menu__sub-li.hover, .awb-menu__sub-li:focus-within, .awb-menu__sub-li:hover {
    background-color: var(--awb-submenu-active-bg) !important;
	 color: var(--awb-submenu-active-color) !important;
}
/* Reset all menu items that Avada marks as current, except the actual scrollspy-active item */
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active) > .awb-menu__sub-a {
  color: var(--awb-submenu-color, #212934) !important;
  font-weight: normal !important;
}

/* Restore active/hover background on the LI */
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active):hover,
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active).hover,
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active).expanded,
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active):focus-within {
  background-color: var(--awb-submenu-active-bg) !important;
}

/* Restore active/hover text color on the anchor */
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active):hover > .awb-menu__sub-a,
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active).hover > .awb-menu__sub-a,
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active).expanded > .awb-menu__sub-a,
.has-anchor-scrollspy > .menu-item.current-menu-item:not(.awb-scrollspy-active):focus-within > .awb-menu__sub-a {
  color: var(--awb-submenu-active-color) !important;
}

/* Active sub-level item: restore the full Avada active treatment */
.has-anchor-scrollspy > .menu-item.awb-scrollspy-active {
    background-color: var(--awb-color2) !important;
}
.has-anchor-scrollspy > .menu-item.awb-scrollspy-active > .awb-menu__sub-a {
    color: #000 !important;
    font-weight: 600 !important;
}

/* ── Scrollspy: main-level items (awb-menu__main-a links) ── */

/* Suppress active background span on all main-li items */
.has-anchor-scrollspy > .awb-menu__main-li .awb-menu__main-background-active {
    opacity: 0 !important;
    transition: opacity 0.2s ease;
}
/*
.has-anchor-scrollspy > .awb-menu__main-li.current-menu-item:not(.awb-scrollspy-active) > .awb-menu__main-a {
    color: var(--awb-color, #212934) !important;
    font-weight: normal !important;
}*/
 .awb-menu__sub-li.expanded, .awb-menu__sub-li.hover, .awb-menu__sub-li:focus-within, .awb-menu__sub-li:hover {
    background-color: var(--awb-submenu-active-bg) !important;
	 color: var(--awb-submenu-active-color) !important;
}

/* Active main-level item: restore Avada active treatment */
.has-anchor-scrollspy > .awb-menu__main-li.awb-scrollspy-active .awb-menu__main-background-active {
    opacity: 1 !important;
}
.has-anchor-scrollspy > .awb-menu__main-li.awb-scrollspy-active > .awb-menu__main-a {
    color: var(--awb-active-color, #ffffff) !important;
    font-weight: 600 !important;
}


/* ── Sticky sidebar: scrollable when stuck and overflowing ──
   overflow-y:auto + scrollbar-gutter:stable are always on .awb-sticky
   so the 4px gutter is permanently reserved — no layout shift when the
   scrollbar appears. JS adds .awb-sticky--scrollable to activate the
   max-height only when the column is actually stuck and overflowing. */
.awb-sticky {
    overflow-y: auto;
    scrollbar-gutter: stable;
}
.awb-sticky--scrollable {
    max-height: calc(100vh - var(--awb-sticky-offset, 0px));
}
.admin-bar .awb-sticky--scrollable {
    max-height: calc(100vh - var(--awb-sticky-offset, 0px) - 32px);
}

.policy-card .fusion-title {
    min-height: 1.5lh;
}

/* ── Homepage: destination slider card matches video column height ──
   Add class "home-destinations-col" to the right 1/3 column in the
   Avada builder (column → General → CSS Class).
   The column already has align-self:stretch set in the builder, so it
   grows to the row height when the video is taller. These rules cascade
   height:100% through Avada's nested wrappers so the card fills it.   */
.home-destinations-col .fusion-column-wrapper,
.home-destinations-col .awb-swiper {
    height: 100%;
}
.home-destinations-col .fusion-content-tb {
    flex: 1 1 auto;
}
/* Cascade into the post-card content template's inner structure */
.home-destinations-col .fusion-content-tb > .fusion-fullwidth,
.home-destinations-col .fusion-content-tb .fusion-builder-row,
.home-destinations-col .fusion-content-tb .fusion-layout-column,
.home-destinations-col .fusion-content-tb .fusion-layout-column > .fusion-column-wrapper {
    height: 100%;
}

/* Image Carousel: aspect-ratio support added via child-theme builder control. */
.fusion-image-carousel.has-aspect-ratio .fusion-image-wrapper {
    overflow: hidden;
}
.fusion-image-carousel.has-aspect-ratio .fusion-image-wrapper img {
    aspect-ratio: var(--awb-aspect-ratio);
    object-position: var(--awb-object-position, 50% 50%);
    object-fit: cover;
    width: 100%;
    display: block;
}

/* ── Global thin scrollbar ──────────────────────────────────────────
   Applied to every scrollable element. Firefox uses scrollbar-width/
   scrollbar-color; Webkit uses the pseudo-element API.              */

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #d0d0d0 transparent;
}
/* Webkit (Chrome / Edge / Safari) */
::-webkit-scrollbar {
    width: 4px;
    height: 4px; /* horizontal scrollbars */
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-button {
    display: none;
}
::-webkit-scrollbar-thumb {
    background: #d0d0d0;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #00AAA6;
}