/*
Theme Name: Irene Held – Divi Child Theme
Theme URI: https://ireneheld.ch
Description: Child Theme for Divi
Author: Irene Held
Author URI: https://ireneheld.ch
Version: 2.4.0-rc14
Template: Divi
*/

/* =========================================================
   MOBILE NAVIGATION – DRILL-DOWN
   Uses the existing WordPress / Divi menu structure.
   Maximum intended depth: 3 levels.
   ========================================================= */

@media (max-width: 980px) {

    .et_pb_menu .mobile_nav.opened .et_mobile_menu,
    .et_mobile_nav_menu .mobile_nav.opened .et_mobile_menu {
        display: block !important;
        visibility: visible !important;
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100dvh !important;
        margin: 0 !important;
        padding: 90px 25px 40px !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
        background: #fff !important;
        border: 0 !important;
        z-index: 99999 !important;
    }

    .mobile_nav.opened .et_mobile_menu,
    .mobile_nav.opened .et_mobile_menu ul,
    .mobile_nav.opened .et_mobile_menu li {
        margin: 0 !important;
        padding-left: 0 !important;
        list-style: none !important;
    }

    .mobile_nav.opened .et_mobile_menu li {
        position: relative !important;
        width: 100% !important;
        text-align: left !important;
    }

    /* Typographic hierarchy: Angebote + Methoden are the primary entry points. */
    .mobile_nav.opened .et_mobile_menu > li > a,
    .mobile_nav.opened .et_mobile_menu > li > .ih-drill-trigger {
        font-size: 18px !important;
        line-height: 1.4 !important;
    }

    .mobile_nav.opened .et_mobile_menu > li:nth-child(1) > a,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(1) > .ih-drill-trigger,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(2) > a,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(2) > .ih-drill-trigger {
        font-size: 22px !important;
        line-height: 1.35 !important;
    }

    /* A little breathing room between the two primary entries and the rest. */
    .mobile_nav.opened .et_mobile_menu > li:nth-child(2) {
        margin-bottom: 12px !important;
    }

    /* Secondary root links form a compact visual block. */
    .mobile_nav.opened .et_mobile_menu > li:nth-child(3) > a,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(3) > .ih-drill-trigger,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(4) > a,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(4) > .ih-drill-trigger,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(5) > a,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(5) > .ih-drill-trigger,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(6) > a,
    .mobile_nav.opened .et_mobile_menu > li:nth-child(6) > .ih-drill-trigger {
        padding-top: 9px !important;
        padding-bottom: 9px !important;
    }

    .mobile_nav.opened .et_mobile_menu .sub-menu li > a,
    .mobile_nav.opened .et_mobile_menu .children li > a,
    .mobile_nav.opened .et_mobile_menu .sub-menu .ih-drill-trigger,
    .mobile_nav.opened .et_mobile_menu .children .ih-drill-trigger {
        font-size: 18px !important;
        line-height: 1.4 !important;
    }

    .mobile_nav.opened .et_mobile_menu .ih-mobile-back button {
        font-size: 16px !important;
        line-height: 1.4 !important;
    }

    .mobile_nav.opened .et_mobile_menu li > a,
    .mobile_nav.opened .et_mobile_menu .ih-drill-trigger {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        position: relative !important;
        padding: 14px 42px 14px 0 !important;
        border: 0 !important;
        border-bottom: 0 !important;
        background: transparent !important;
        color: inherit !important;
        font: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
        text-align: left !important;
        opacity: 1 !important;
        cursor: pointer !important;
        min-height: 44px !important;
    }

    /* The original Divi parent link stays in the DOM for structure/accessibility,
       but our dedicated button handles drill-down on mobile. */
    .mobile_nav.opened .et_mobile_menu li.ih-has-drill > a.ih-parent-link {
        display: none !important;
    }

    .mobile_nav.opened .et_mobile_menu .ih-drill-trigger::after {
        content: "" !important;
        position: absolute !important;
        right: 7px !important;
        top: 50% !important;
        width: 9px !important;
        height: 9px !important;
        border-top: 2px solid currentColor !important;
        border-right: 2px solid currentColor !important;
        transform: translateY(-50%) rotate(45deg) !important;
    }

    /* “Über mich” is secondary in the root hierarchy, so its drill arrow is quieter. */
    .mobile_nav.opened .et_mobile_menu > li:nth-child(3) > .ih-drill-trigger::after {
        width: 7px !important;
        height: 7px !important;
        border-top-width: 1.5px !important;
        border-right-width: 1.5px !important;
    }

    .mobile_nav.opened .et_mobile_menu .sub-menu,
    .mobile_nav.opened .et_mobile_menu .children {
        display: none !important;
        visibility: hidden !important;
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100dvh !important;
        margin: 0 !important;
        padding: 90px 25px 40px !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
        background: #fff !important;
        z-index: 100000 !important;
    }

    .mobile_nav.opened .et_mobile_menu .sub-menu.ih-depth-3,
    .mobile_nav.opened .et_mobile_menu .children.ih-depth-3 {
        z-index: 100001 !important;
    }

    .mobile_nav.opened .et_mobile_menu .sub-menu.ih-panel-open,
    .mobile_nav.opened .et_mobile_menu .children.ih-panel-open {
        display: block !important;
        visibility: visible !important;
    }

    .mobile_nav.opened .et_mobile_menu .ih-mobile-back {
        border-bottom: 0 !important;
        margin-bottom: 8px !important;
    }

    .mobile_nav.opened .et_mobile_menu .ih-mobile-back button {
        display: block !important;
        width: 100% !important;
        padding: 10px 0 16px !important;
        border: 0 !important;
        background: transparent !important;
        color: inherit !important;
        font: inherit !important;
        text-align: left !important;
        cursor: pointer !important;
    }

    .mobile_nav.opened .et_mobile_menu .ih-mobile-back button::before {
        content: "‹";
        display: inline-block;
        margin-right: 10px;
        font-size: 1.5em;
        line-height: 0;
        vertical-align: -0.08em;
    }

    .mobile_nav .mobile_menu_bar {
        position: fixed !important;
        top: 20px !important;
        right: 25px !important;
        z-index: 100002 !important;
    }

    .mobile_nav.opened .mobile_menu_bar::before {
        content: "×" !important;
        font-family: Arial, sans-serif !important;
        font-size: 44px !important;
        font-weight: 300 !important;
        line-height: 1 !important;
    }

    /* Termin button: mirrors the pill-style CTA used in the desktop navigation. */
    .mobile_nav.opened .et_mobile_menu > li.menu-btn-mobile {
        padding-top: 14px !important;
    }

    .mobile_nav.opened .et_mobile_menu > li.menu-btn-mobile > a {
        display: inline-block !important;
        width: auto !important;
        min-width: 160px !important;
        padding: 15px 25px 12px !important;
        background: #82357A !important;
        color: #fff !important;
        border: 0 !important;
        border-radius: 32px !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25), 0 3px 6px rgba(0, 0, 0, 0.15) !important;
        font-size: 18px !important;
        font-weight: 400 !important;
        line-height: 1 !important;
        text-align: center !important;
    }

    .mobile_nav.opened .et_mobile_menu > li.menu-btn-mobile > a:hover,
    .mobile_nav.opened .et_mobile_menu > li.menu-btn-mobile > a:focus-visible {
        opacity: 0.9 !important;
    }

    .mobile_nav.opened .et_mobile_menu .mobile-toggle {
        display: none !important;
    }
}

/* =========================================================
   DESKTOP MEGA MENU - ANGEBOTE
   ========================================================= */

@media (min-width: 981px) {

    .ih-angebote-mega .ih-angebote-panel {
        display: none !important;
    }

    .ih-angebote-mega .ih-angebote-panel.is-active {
        display: flex !important;
        flex-direction: column !important;
    }
}

/* Desktop Angebote: current page and selected topic. */
@media (min-width: 981px) {
    /* Show the current page without relying on colour alone. */
    .ih-angebote-mega a[data-ih-current-page="1"] {
        color: #111 !important;
        font-weight: 700 !important;
    }

    /* Divi Blurb: title/description can override the parent link weight. */
    .ih-angebote-mega a[data-ih-current-page="1"] :is(.et_pb_module_header, .et_pb_blurb_description, p, span),
    .ih-angebote-mega .et_pb_blurb:has(a[data-ih-current-page="1"]) :is(.et_pb_module_header, .et_pb_blurb_description, .et_pb_blurb_description p) {
        color: #111 !important;
        font-weight: 700 !important;
    }

    .ih-angebote-mega .ih-angebote-trigger {
        cursor: pointer;
    }

    /* Bold only text inside the selected topic, never the arrow/icon. */
    .ih-angebote-mega .ih-angebote-trigger.is-active .et_pb_module_header,
    .ih-angebote-mega .ih-angebote-trigger.is-active .et_pb_blurb_description p,
    .ih-angebote-mega .ih-angebote-trigger.is-active .et_pb_blurb_description a {
        font-weight: 700 !important;
        text-decoration: none !important;
    }

    /* Divi 5 Link modules in column 2: bold their text, not the arrow. */
    .ih-angebote-mega .ih-angebote-trigger.is-active,
    .ih-angebote-mega .ih-angebote-trigger.is-active :is(a, p, .et_pb_text_inner),
    .ih-angebote-mega .ih-angebote-trigger.is-active a span:not([class*="icon"]),
    .ih-angebote-mega .ih-angebote-trigger.is-active .et_pb_module_header {
        font-weight: 700 !important;
        text-decoration: none !important;
    }
}