/**
 * Sol menü — alt kategoriler (flyout masaüstü, akordeon mobil)
 */

.side-nav .dropdown-content {
    display: none;
    position: absolute;
    min-width: 200px;
    margin: 0;
    padding: 8px 0;
    box-sizing: border-box;
    list-style: none;
    background: linear-gradient(
        160deg,
        rgba(44, 50, 60, 0.72) 0%,
        rgba(28, 34, 44, 0.78) 100%
    ) !important;
    backdrop-filter: blur(24px) saturate(1.45);
    -webkit-backdrop-filter: blur(24px) saturate(1.45);
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 12px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 12px 32px rgba(0, 0, 0, 0.32);
    z-index: 300 !important;
    pointer-events: auto;
}

/* Body portal flyout — sidebar-flyout.js */
.sidebar-flyout-panel,
.side-nav .dropdown.is-flyout-open .dropdown-content.sidebar-flyout-panel {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    position: fixed !important;
    z-index: 15000 !important;
}

.sidebar-flyout-panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: -12px;
    width: 12px;
    height: 100%;
    pointer-events: auto;
}

.side-nav .dropdown-content a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 10px 16px !important;
    color: rgba(255, 255, 255, 0.92) !important;
    text-decoration: none !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    white-space: nowrap;
}

.side-nav .dropdown-content a:hover,
.side-nav .dropdown-content a:focus-visible,
.sidebar-flyout-panel a:hover,
.sidebar-flyout-panel a:focus-visible {
    background: rgba(1, 177, 175, 0.28) !important;
    color: #fff !important;
}

/* ---- Masaüstü flyout ---- */
@media (min-width: 992px) {
    .side-nav {
        overflow-x: visible !important;
        overflow-y: auto !important;
        z-index: 45 !important;
    }

    .side-nav:hover,
    .side-nav.is-flyout-active,
    .side-nav:has(.dropdown:hover),
    .side-nav:has(.dropdown.is-flyout-open) {
        z-index: 200 !important;
        overflow-x: visible !important;
        overflow-y: auto !important;
    }

    .side-nav > ul,
    .side-nav > ul:first-of-type,
    .side-nav > ul:first-of-type > li,
    .side-nav ul li,
    .side-nav .dropdown {
        overflow: visible !important;
    }

    .side-nav > ul:first-of-type {
        max-height: none !important;
        overflow: visible !important;
    }

    .side-nav .dropdown {
        position: relative !important;
        display: block !important;
        width: 100% !important;
    }

    .side-nav .dropdown.dropdown--has-children > a {
        cursor: pointer;
    }

    .side-nav .dropdown.is-flyout-open > a {
        background: rgba(255, 255, 255, 0.08) !important;
        border-radius: 10px;
    }

    .side-nav .dropdown-content {
        position: absolute !important;
        left: calc(100% + 2px) !important;
        top: 0 !important;
        right: auto !important;
        bottom: auto !important;
        width: max(240px, max-content) !important;
        min-width: 240px !important;
        max-width: min(340px, calc(100vw - 420px)) !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        z-index: 500 !important;
        transform: none !important;
    }

    .side-nav .dropdown.is-flyout-open .dropdown-content {
        display: block !important;
    }

    .side-nav .dropdown:hover,
    .side-nav .dropdown:focus-within,
    .side-nav .dropdown.is-flyout-open {
        z-index: 510;
    }

    .side-nav .dropdown-content a {
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

/* ---- Mobil / tablet akordeon ---- */
@media (max-width: 991px) {
    .sidebar-flyout-panel {
        position: static !important;
        left: auto !important;
        top: auto !important;
        z-index: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .side-nav .dropdown {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        overflow: visible !important;
    }

    .side-nav .dropdown > a {
        display: flex !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    .side-nav .dropdown-content {
        display: none !important;
        position: static !important;
        left: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 6px 0 10px !important;
        padding: 6px 0 8px !important;
        border-radius: 12px !important;
        box-shadow: none !important;
        background: rgba(255, 255, 255, 0.06) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
        z-index: auto !important;
    }

    .side-nav .dropdown-content::before,
    .sidebar-flyout-panel::before {
        display: none !important;
    }

    .side-nav .dropdown:hover .dropdown-content,
    .side-nav .dropdown:focus-within .dropdown-content,
    .side-nav .dropdown.is-flyout-open .dropdown-content {
        display: none !important;
    }

    .side-nav.is-open .dropdown.is-expanded .dropdown-content {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        max-height: none !important;
        overflow: visible !important;
        height: auto !important;
    }

    .side-nav ul,
    .side-nav ul li {
        overflow: visible !important;
    }

    .side-nav.is-open .dropdown-content a {
        padding: 12px 14px 12px 42px !important;
        font-size: 14px !important;
        white-space: normal !important;
        pointer-events: auto !important;
        cursor: pointer;
        touch-action: manipulation;
        -webkit-tap-highlight-color: rgba(1, 177, 175, 0.2);
        min-height: 44px;
        box-sizing: border-box;
        display: flex !important;
        align-items: center;
    }

    .side-nav.is-open .dropdown--has-children > a {
        cursor: pointer;
        touch-action: manipulation;
    }

    .side-nav.is-open .dropdown.dropdown--has-children > a::after {
        content: "▾";
        margin-left: auto;
        font-size: 0.75rem;
        opacity: 0.55;
        flex-shrink: 0;
    }

    .side-nav.is-open .dropdown.is-expanded > a::after {
        transform: rotate(180deg);
        opacity: 0.85;
    }
}