/* ============================================================
   ACTOREIN — Accessibility settings sidebar
   The macOS-style window becomes a full-height right sidebar:
   compact header with the section pills on top, settings below.
   Loaded after settings.css (priority 215).
   ============================================================ */
@media (min-width: 721px) {
    #ac-settings[open] {
        align-items: stretch;
        justify-content: flex-end;
        padding: 0;
    }
    /* Anchored to the physical right edge in every language. */
    html[dir="rtl"] #ac-settings[open],
    html[lang^="fa"] #ac-settings[open] { direction: ltr; }
    html[dir="rtl"] #ac-settings .ac-settings__window,
    html[lang^="fa"] #ac-settings .ac-settings__window { direction: rtl; }

    #ac-settings .ac-settings__window {
        flex-direction: column;
        width: min(420px, 100%);
        height: 100vh;
        height: 100dvh;
        max-height: none;
        border-radius: 18px 0 0 18px;
        box-shadow: -28px 0 80px rgba(6, 18, 31, 0.38);
        animation: ac-settings-sheet-in 0.42s cubic-bezier(0.22, 0.9, 0.24, 1) both;
    }
    @keyframes ac-settings-sheet-in {
        from { opacity: 0; transform: translateX(100%); }
        to { opacity: 1; transform: none; }
    }

    #ac-settings .ac-settings__sidebar {
        flex: 0 0 auto;
        width: 100%;
        height: auto;
        padding: 10px 12px 0;
        border-inline-end: 0 !important;
        border-bottom: 1px solid var(--as-border) !important;
    }
    #ac-settings .ac-settings__titlebar { padding: 0 0 8px 2px; }
    #ac-settings .ac-settings__nav {
        flex: 0 0 auto;
        flex-direction: row;
        gap: 6px;
        padding: 0 0 10px;
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: none;
    }
    #ac-settings .ac-settings__nav::-webkit-scrollbar { display: none; }
    #ac-settings .ac-settings__nav-item {
        flex: 0 0 auto;
        width: auto;
        min-height: 30px;
        padding: 5px 11px;
        border-radius: 999px;
    }
    #ac-settings .ac-settings__nav-item.is-active { border-radius: 999px; }
    #ac-settings .ac-settings__nav-label { overflow: visible; text-overflow: clip; }

    #ac-settings .ac-settings__panes { padding: 18px 16px 20px; }
    #ac-settings .ac-settings__pane { max-width: none; }
    #ac-settings .ac-settings__pane-title { font-size: 18px !important; }
    #ac-settings .ac-settings__row--font { flex-direction: column; align-items: flex-start; }
    #ac-settings .ac-settings__foot { padding: 10px 16px; }
}

@media (prefers-reduced-motion: reduce) {
    #ac-settings .ac-settings__window { animation: none !important; }
}
html.ac-access-motion #ac-settings .ac-settings__window { animation: none !important; }