/**
 * Savilva — özel mobil yan menü (.sv-mobile-drawer)
 * Masaüstü (≥968px) gizli; frame.scss cbp-spmenu genişlik kurallarını geçersiz kılar.
 */

@media (min-width: 968px) {
    #cbp-spmenu-s1.sv-mobile-drawer {
        display: none !important;
    }
}

@media (max-width: 967px) {
    #cbp-spmenu-s1.sv-mobile-drawer {
        /* Tüm yüzey tonları — .header-type-2 üst şerit (#2f3234) ile aynı aile */
        --sv-drawer-anthracite: var(--sv-header-bg);
        --sv-drawer-anthracite-deep: var(--sv-header-bg);
        --sv-drawer-anthracite-soft: var(--sv-header-bg-elevated);
        --sv-drawer-anthracite-muted: var(--sv-header-bg-hover);
        --sv-drawer-border: var(--sv-header-border);
        --sv-drawer-text: var(--sv-header-text);
        --sv-drawer-text-muted: rgba(255, 255, 255, 0.68);
        --sv-drawer-accent: var(--sv-dealer-primary);
        --sv-drawer-accent-hover: var(--sv-dealer-primary-hover);
    }

    body.cbp-spmenu-push-toleft {
        left: 0 !important;
    }

    #cbp-spmenu-s1.sv-mobile-drawer {
        position: fixed;
        inset: 0;
        z-index: 1200;
        width: 100% !important;
        max-width: none !important;
        height: 100% !important;
        top: 0 !important;
        right: auto !important;
        left: 0 !important;
        bottom: 0;
        margin: 0;
        padding: 0;
        background: transparent;
        border: none;
        box-shadow: none;
        pointer-events: none;
        visibility: hidden;
        transition: visibility 0.35s ease;
    }

    #cbp-spmenu-s1.sv-mobile-drawer.cbp-spmenu-open {
        pointer-events: auto;
        visibility: visible;
    }

    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__backdrop {
        position: absolute;
        inset: 0;
        background: rgba(47, 50, 52, 0.62);
        opacity: 0;
        transition: opacity 0.35s ease;
        -webkit-tap-highlight-color: transparent;
    }

    #cbp-spmenu-s1.sv-mobile-drawer.cbp-spmenu-open .sv-mobile-drawer__backdrop {
        opacity: 1;
    }

    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__panel {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(92vw, 420px);
        max-width: 420px;
        display: flex;
        flex-direction: column;
        background: var(--sv-drawer-anthracite);
        color: var(--sv-drawer-text);
        box-shadow: -12px 0 48px rgba(0, 0, 0, 0.35);
        transform: translateX(100%);
        transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
        will-change: transform;
        overflow: hidden;
    }

    #cbp-spmenu-s1.sv-mobile-drawer.cbp-spmenu-open .sv-mobile-drawer__panel {
        transform: translateX(0);
    }

    /* Üst bar */
    .sv-mobile-drawer__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        flex-shrink: 0;
        padding: 14px 16px 14px 18px;
        background: var(--sv-drawer-anthracite-deep);
        border-bottom: 1px solid var(--sv-drawer-border);
        color: var(--sv-drawer-text);
    }

    .sv-mobile-drawer__head::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 3px;
        background: var(--sv-drawer-accent);
        pointer-events: none;
    }

    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__head {
        position: relative;
    }

    .sv-mobile-drawer__brand {
        display: flex;
        align-items: center;
        min-height: 44px;
        text-decoration: none;
    }

    .sv-mobile-drawer__brand img {
        display: block;
        height: 26px;
        width: auto;
        max-width: 150px;
        filter: brightness(0) invert(1);
    }

    /* Eski tema .close-menu — sağ üst × işareti */
    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__close.close-menu {
        flex-shrink: 0;
        display: block;
        min-width: 44px;
        min-height: 44px;
        margin: 0;
        padding: 8px 4px 8px 12px;
        border: none;
        border-radius: 0;
        background: transparent;
        color: var(--sv-drawer-text);
        font-family: inherit;
        font-size: 17px;
        line-height: 1;
        text-align: right;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: color 0.2s ease, opacity 0.2s ease;
    }

    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__close-mark {
        display: block;
        font-size: 28px;
        font-weight: 300;
        line-height: 1;
        letter-spacing: 0;
    }

    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__close.close-menu:hover {
        color: #fff;
        opacity: 0.92;
    }

    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__close.close-menu:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(150, 13, 13, 0.45);
        border-radius: 8px;
    }

    /* Bayi aksiyonları */
    .sv-mobile-drawer__actions {
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 16px 18px;
        background: var(--sv-drawer-anthracite);
        border-bottom: 1px solid var(--sv-drawer-border);
    }

    .sv-mobile-drawer__action {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 48px;
        padding: 12px 16px;
        border-radius: 12px;
        font-family: Poppins, system-ui, sans-serif;
        font-size: 0.9rem;
        font-weight: 600;
        line-height: 1.25;
        text-decoration: none;
        color: var(--sv-drawer-text);
        border: 1px solid var(--sv-drawer-border);
        background: var(--sv-drawer-anthracite-soft);
        box-shadow: none;
        transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    }

    .sv-mobile-drawer__action i {
        width: 1.25rem;
        text-align: center;
        font-size: 1rem;
        flex-shrink: 0;
    }

    .sv-mobile-drawer__action:active {
        transform: scale(0.98);
    }

    .sv-mobile-drawer__action--green {
        background: var(--sv-drawer-accent);
        border-color: rgba(150, 13, 13, 0.55);
        color: #fff;
    }

    .sv-mobile-drawer__action--green:hover {
        background: var(--sv-drawer-accent-hover);
        border-color: var(--sv-drawer-accent-hover);
        color: #fff;
    }

    .sv-mobile-drawer__action--blue {
        background: transparent;
        border-color: rgba(255, 255, 255, 0.22);
        color: var(--sv-drawer-text);
    }

    .sv-mobile-drawer__action--blue:hover {
        background: var(--sv-drawer-anthracite-muted);
        border-color: rgba(255, 255, 255, 0.32);
        color: #fff;
    }

    /* Menü listesi */
    .sv-mobile-drawer__scroll {
        flex: 1 1 auto;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .sv-mobile-drawer__list {
        list-style: none;
        margin: 0;
        padding: 8px 0 16px;
    }

    .sv-mobile-drawer__item {
        border-bottom: 1px solid var(--sv-drawer-border);
    }

    .sv-mobile-drawer__row {
        display: flex;
        align-items: stretch;
        min-height: 52px;
    }

    .sv-mobile-drawer__link {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        padding: 14px 8px 14px 20px;
        font-family: Poppins, system-ui, sans-serif;
        font-size: 0.95rem;
        font-weight: 500;
        line-height: 1.35;
        color: var(--sv-drawer-text);
        text-decoration: none;
        transition: color 0.15s ease, background 0.15s ease;
    }

    .sv-mobile-drawer__link:hover {
        color: #fff;
        background: rgba(255, 255, 255, 0.06);
    }

    .sv-mobile-drawer__item.is-open > .sv-mobile-drawer__row .sv-mobile-drawer__link {
        color: #fff;
        background: rgba(255, 255, 255, 0.04);
    }

    .sv-mobile-drawer__expand {
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 52px;
        min-height: 52px;
        margin: 0;
        padding: 0;
        border: none;
        border-left: 1px solid var(--sv-drawer-border);
        background: transparent;
        color: var(--sv-drawer-text-muted);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: background 0.15s ease, color 0.15s ease;
    }

    .sv-mobile-drawer__expand:hover {
        background: rgba(255, 255, 255, 0.06);
        color: #fff;
    }

    .sv-mobile-drawer__item.is-open > .sv-mobile-drawer__row .sv-mobile-drawer__expand {
        color: var(--sv-drawer-accent-hover);
    }

    .sv-mobile-drawer__chevron {
        font-size: 12px;
        transition: transform 0.25s ease;
    }

    .sv-mobile-drawer__item.is-open > .sv-mobile-drawer__row .sv-mobile-drawer__chevron {
        transform: rotate(180deg);
    }

    .sv-mobile-drawer__sublist {
        list-style: none;
        margin: 0;
        padding: 0 0 8px;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: max-height 0.35s ease, opacity 0.25s ease;
    }

    .sv-mobile-drawer__item.is-open > .sv-mobile-drawer__sublist {
        max-height: 1200px;
        opacity: 1;
        background: rgba(0, 0, 0, 0.14);
    }

    .sv-mobile-drawer__sublink {
        display: block;
        padding: 11px 20px 11px 32px;
        font-family: Poppins, system-ui, sans-serif;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 1.35;
        color: var(--sv-drawer-text-muted);
        text-decoration: none;
        transition: color 0.15s ease, background 0.15s ease;
    }

    .sv-mobile-drawer__sublink:hover {
        color: #fff;
        background: rgba(255, 255, 255, 0.05);
    }

    .sv-mobile-drawer__subitem--nested .sv-mobile-drawer__sublink {
        padding-left: 48px;
        font-size: 0.8125rem;
        color: var(--sv-drawer-text-muted);
    }

    .sv-mobile-drawer__subitem--nested .sv-mobile-drawer__sublink::before {
        content: "—";
        margin-right: 8px;
        opacity: 0.5;
    }

    /* Alt bölüm */
    .sv-mobile-drawer__foot {
        flex-shrink: 0;
        padding: 14px 18px calc(14px + env(safe-area-inset-bottom, 0px));
        background: var(--sv-drawer-anthracite-deep);
        border-top: 1px solid var(--sv-drawer-border);
    }

    .sv-mobile-drawer__foot-link {
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 44px;
        padding: 10px 14px;
        margin-bottom: 12px;
        border-radius: 10px;
        background: var(--sv-drawer-anthracite-soft);
        border: 1px solid var(--sv-drawer-border);
        font-family: Poppins, system-ui, sans-serif;
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--sv-drawer-text);
        text-decoration: none;
        transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    }

    .sv-mobile-drawer__foot-link:hover {
        background: var(--sv-drawer-anthracite-muted);
        border-color: rgba(255, 255, 255, 0.18);
        color: #fff;
    }

    .sv-mobile-drawer__foot-link i {
        color: var(--sv-drawer-accent-hover);
    }

    .sv-mobile-drawer__langs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    .sv-mobile-drawer__lang {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 36px;
        padding: 6px 14px;
        border-radius: 999px;
        border: 1px solid var(--sv-drawer-border);
        background: var(--sv-drawer-anthracite-soft);
        font-family: Poppins, system-ui, sans-serif;
        font-size: 0.8125rem;
        font-weight: 500;
        color: var(--sv-drawer-text-muted);
        text-decoration: none;
        transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
    }

    .sv-mobile-drawer__lang:hover {
        border-color: rgba(255, 255, 255, 0.22);
        background: var(--sv-drawer-anthracite-muted);
        color: var(--sv-drawer-text);
    }

    .sv-mobile-drawer__lang.is-active {
        background: var(--sv-drawer-accent);
        border-color: var(--sv-drawer-accent);
        color: #fff;
    }
}

@media (max-width: 380px) {
    #cbp-spmenu-s1.sv-mobile-drawer .sv-mobile-drawer__panel {
        width: 100vw;
        max-width: 100vw;
    }
}