/* ============================================================
   EAW FLYOUT-MENY — Off-Canvas mobilmeny
   Scope: .eaw-offcanvas (CSS Class på Off-Canvas-objektet, ID 913)

   OBS: Bakgrundsfärgen sätts i Off-Canvas Options → Design → Background Color.
   Använd #1C1B1B (--eaw-surface-dark), inte #071e3a.
   ============================================================ */


/* --- PANEL: fullbredd --- */

.eaw-offcanvas.awb-off-canvas--sliding-bar {
    width: 100vw !important;
    max-width: 100vw !important;
    min-height: 100dvh !important;
}

.eaw-offcanvas .awb-off-canvas__content {
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* Avada lägger ibland extra margin på .fusion-builder-row — nollställ */
.eaw-offcanvas .fusion-builder-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Action-raden (växlare + LinkedIn + Standardsortiment): centrera vertikalt */
.eaw-offcanvas .fusion-builder-row-inner {
    align-items: center !important;
}

/* Nolla kolumn-spacing-marginaler i flyouten (awb-spacing ger annars ~15px indraget) */
.eaw-offcanvas .fusion-column-wrapper {
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* --- STÄNG-KNAPP --- */

.eaw-offcanvas .awb-off-canvas__close-btn {
    position: fixed !important;
    top: 24px !important;
    right: 24px !important;
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--eaw-text-on-dark, #F5F4F2) !important;
    font-size: 36px !important;
    line-height: 1 !important;
    opacity: 1 !important;
    z-index: 200;
    border-radius: 50%;
    background: transparent;
    transition: background 0.2s ease, color 0.2s ease !important;
}

.eaw-offcanvas .awb-off-canvas__close-btn:hover {
    color: var(--eaw-gold, #B48A4A) !important;
    background: rgba(245, 244, 242, 0.08) !important;
}


/* --- BAKGRUNDSOVERLAY (halvtransparent yta bakom panelen) --- */

.eaw-offcanvas ~ .awb-off-canvas__overlay {
    background-color: rgba(0, 0, 0, 0.6) !important;
}


/* --- MENYLÄNKARNA --- */

.eaw-offcanvas .awb-menu__main-ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0 !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.eaw-offcanvas .awb-menu__main-li {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    width: 100% !important;
    border-bottom: 1px solid rgba(245, 244, 242, 0.12) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.eaw-offcanvas .awb-menu__main-a,
.eaw-offcanvas .awb-menu__main-a:visited {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    padding: 20px 0 !important;
    font-family: 'Fira Sans Condensed', 'Fira Sans', sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    color: var(--eaw-text-on-dark-muted, rgba(245, 244, 242, 0.7)) !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    transition: color 0.2s ease !important;
    background: transparent !important;
}

.eaw-offcanvas .awb-menu__main-a:hover,
.eaw-offcanvas .awb-menu__main-a:focus {
    color: var(--eaw-gold, #B48A4A) !important;
    background: transparent !important;
}

.eaw-offcanvas .current-menu-item > .awb-menu__main-a,
.eaw-offcanvas .current-menu-ancestor > .awb-menu__main-a,
.eaw-offcanvas .current_page_item > .awb-menu__main-a {
    color: var(--eaw-gold, #B48A4A) !important;
}

/* Dölj mobile collapse-trigger — menyn ska alltid visas expanderad i Off-Canvas */
.eaw-offcanvas .awb-menu__mobile-trigger,
.eaw-offcanvas .awb-menu__mobile-nav-button {
    display: none !important;
}

/* Tvinga menylistan synlig även om Avada satt den till hidden via mobile breakpoint */
.eaw-offcanvas .awb-menu__main-ul {
    display: flex !important;
}

/* --- SUBMENYER --- */

/* Dölj sub-indikatorpilar (Avadas dekorativa pilar bredvid länktext) */
.eaw-offcanvas .awb-menu__sub-indicator {
    display: none !important;
}

/* Sub-toggle — knappen är tom, rita chevron via ::after */
.eaw-offcanvas .awb-menu__open-nav-submenu_main {
    position: static !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-left: 6px !important;
    padding: 0;
    color: var(--eaw-text-on-dark-muted, rgba(245, 244, 242, 0.7));
    background: transparent;
    border: none;
    cursor: pointer;
    flex-shrink: 0;
}

.eaw-offcanvas .awb-menu__open-nav-submenu_main::before {
    display: none !important;
}

.eaw-offcanvas .awb-menu__open-nav-submenu_main::after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.2s ease, color 0.2s ease;
}

.eaw-offcanvas .awb-menu__open-nav-submenu_main[aria-expanded="true"]::after {
    transform: rotate(-135deg) translateY(2px);
}

.eaw-offcanvas .awb-menu__open-nav-submenu_main:hover {
    color: var(--eaw-gold, #B48A4A);
}

/* Sub-ul bryter till full bredd under länkraden */
.eaw-offcanvas .awb-menu__sub-ul {
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    border-left: none !important;
    border-top: 2px solid var(--eaw-gold, #B48A4A) !important;
    margin-left: 0 !important;
    margin-bottom: 8px !important;
}

/* Submeny-länkstil — matchar desktop, anpassad för fullbredd */
.eaw-offcanvas .awb-menu__sub-a,
.eaw-offcanvas .awb-menu__sub-a:visited {
    display: inline-flex !important;
    align-items: center !important;
    padding: 12px 0 12px 20px !important;
    font-family: 'Fira Sans', sans-serif !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    letter-spacing: 0.03em !important;
    text-transform: none !important;
    color: var(--eaw-text-on-dark-muted, rgba(245, 244, 242, 0.7)) !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
    transition: color 0.2s ease !important;
    background: transparent !important;
}

.eaw-offcanvas .awb-menu__sub-a::after {
    content: '→';
    flex-shrink: 0;
    margin-left: 10px;
    color: var(--eaw-gold, #B48A4A);
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.eaw-offcanvas .awb-menu__sub-a:hover,
.eaw-offcanvas .awb-menu__sub-a:focus {
    color: var(--eaw-gold, #B48A4A) !important;
    background: transparent !important;
}

.eaw-offcanvas .awb-menu__sub-a:hover::after,
.eaw-offcanvas .awb-menu__sub-a:focus::after {
    opacity: 1;
    transform: translateX(0);
}

.eaw-offcanvas .current-menu-item > .awb-menu__sub-a,
.eaw-offcanvas .current-menu-ancestor > .awb-menu__sub-a {
    color: var(--eaw-gold, #B48A4A) !important;
}

.eaw-offcanvas .awb-menu__main-background-default,
.eaw-offcanvas .awb-menu__main-background-active {
    display: none !important;
}


/* --- LOGOTYP I OFF-CANVAS --- */

.eaw-offcanvas .fusion-imageframe img {
    max-width: 160px !important;
    width: auto !important;
    height: auto !important;
    display: block;
}


/* --- SPRÅKVÄLJARE I OFF-CANVAS --- */

.eaw-offcanvas .eaw-lang-switcher {
    display: inline-flex;
    position: relative;
    flex: 0 0 auto;
    align-items: center;
    padding: 2px;
    border: 1px solid rgba(245, 244, 242, 0.12);
    border-radius: 999px;
    background: rgba(245, 244, 242, 0.05);
}

.eaw-offcanvas .eaw-lang-switcher svg {
    display: none;
}

.eaw-offcanvas .eaw-lang-switcher ul {
    display: flex;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.eaw-offcanvas .eaw-lang-switcher li {
    margin: 0;
}

.eaw-offcanvas .eaw-lang-switcher a {
    display: flex !important;
    align-items: center;
    padding: 5px 12px !important;
    border-radius: 999px;
    color: var(--eaw-text-on-dark-muted, rgba(245, 244, 242, 0.7)) !important;
    font-family: 'Fira Sans', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0.04em !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    transition: background 0.15s ease, color 0.15s ease;
}

.eaw-offcanvas .eaw-lang-switcher a:hover {
    color: var(--eaw-text-on-dark, #F5F4F2) !important;
}

.eaw-offcanvas .eaw-lang-switcher li.wpml-ls-current-language a {
    background: var(--eaw-gold, #B48A4A);
    color: #1C1B1B !important;
}

.eaw-offcanvas .eaw-lang-switcher li.wpml-ls-current-language .wpml-ls-link::before {
    color: #1C1B1B !important;
}

.eaw-offcanvas .eaw-lang-switcher .wpml-ls-native,
.eaw-offcanvas .eaw-lang-switcher .wpml-ls-flag {
    display: none;
}

.eaw-offcanvas .eaw-lang-switcher .wpml-ls-link::before {
    content: attr(hreflang);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}


/* --- SIDFOT I OFF-CANVAS --- */

.eaw-nav-footer-text p {
    color: var(--eaw-text-on-dark-faint, rgba(245, 244, 242, 0.5)) !important;
    font-family: 'Fira Sans', sans-serif !important;
    font-size: 0.85rem !important;
    line-height: 1.6 !important;
    margin-bottom: 0 !important;
}

.eaw-nav-footer-text a {
    color: var(--eaw-text-on-dark-muted, rgba(245, 244, 242, 0.7)) !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.eaw-nav-footer-text a:hover {
    color: var(--eaw-gold, #B48A4A) !important;
}


/* --- DÖLJ HEADER-SPRÅKVÄLJARE NÄR OFF-CANVAS ÄR ÖPPEN ---
   Avada lägger awb-oc-open på body när Off-Canvas är aktiv.
   Språkväljaren finns redan inuti Off-Canvas-panelen. */

body.awb-oc-open .fusion-tb-header .eaw-lang-switcher {
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.15s ease !important;
}


/* --- HAMBURGER-KNAPP I HEADERN ---
   Klassen "eaw-burger-btn" på kolumnen/containern som håller triggerknappen. */

@media (min-width: 1281px) {
    .eaw-burger-btn {
        display: none !important;
    }
}

@media (max-width: 1280px) {
    .eaw-burger-btn {
        display: flex !important;
    }
}


/* --- DÖLJ HEADER-ELEMENT PÅ MOBIL ---
   Dessa element finns redan i Off-Canvas-panelen och behövs inte i headern på mobil.
   - .eaw-lang-switcher: Code Block med befintlig klass — scopas till headern så Off-Canvas påverkas ej
   - .eaw-desktop-only: lägg klassen på LinkedIn och Boka möte via elementets Extras-flik i Header Builder */

@media (max-width: 1280px) {
    .fusion-tb-header .eaw-lang-switcher,
    .eaw-desktop-only {
        display: none !important;
    }
}


/* --- MOBILANPASSNING --- */

@media (max-width: 480px) {
    .eaw-offcanvas.awb-off-canvas--sliding-bar {
        width: 100vw !important;
    }

    .eaw-offcanvas .awb-menu__main-a {
        font-size: 1.3rem !important;
        padding: 16px 0 !important;
    }
}
