/**
 * Global Scrollbar Styles
 * Phase 15: CSS Themes Fix
 * Unified scrollbar styling for all themes
 */

/* ========== Light Theme (Default) ========== */
:root {
    --scrollbar-width: 8px;
    --scrollbar-track: var(--background);
    --scrollbar-thumb: var(--border);
    --scrollbar-thumb-hover: var(--border-dark);
}

/* ========== WebKit Scrollbars (Chrome, Safari, Edge) ========== */
*::-webkit-scrollbar {
    width: var(--scrollbar-width);
    height: var(--scrollbar-width);
}

*::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
    border-radius: 4px;
}

*::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: 4px;
    border: 2px solid var(--scrollbar-track);
    transition: background 0.2s ease;
}

*::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

*::-webkit-scrollbar-corner {
    background: var(--scrollbar-track);
}

/* ========== Firefox Scrollbars ========== */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

/* ========== Dark Theme ========== */
[data-theme="dark"],
.theme-dark {
    --scrollbar-width: 8px;
    --scrollbar-track: var(--background);
    --scrollbar-thumb: var(--border);
    --scrollbar-thumb-hover: var(--border-light);
}

/* ========== High Contrast Theme ========== */
[data-theme="high-contrast"],
.theme-high-contrast {
    --scrollbar-width: 12px; /* Толще для лучшей видимости */
    --scrollbar-track: var(--background);
    --scrollbar-thumb: var(--border);
    --scrollbar-thumb-hover: var(--accent);
}

[data-theme="high-contrast"] *::-webkit-scrollbar-thumb {
    border: 3px solid var(--scrollbar-track); /* Толще граница */
    border-radius: 6px;
}

[data-theme="high-contrast"] *::-webkit-scrollbar-thumb:hover {
    background: var(--accent);
    border-color: var(--accent);
}

[data-theme="high-contrast"] * {
    scrollbar-width: auto; /* Толще в Firefox */
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

/* ========== High Contrast Dark Variant ========== */
@media (prefers-color-scheme: dark) {
    [data-theme="high-contrast"] {
        --scrollbar-width: 12px;
        --scrollbar-track: var(--background);
        --scrollbar-thumb: var(--border);
        --scrollbar-thumb-hover: var(--accent);
    }
}

/* ========== Specific Elements ========== */

/* Sidebar scrollbar */
.app-sidebar::-webkit-scrollbar,
.nav-sublist::-webkit-scrollbar,
.admin-nav-sublist::-webkit-scrollbar {
    width: var(--scrollbar-width);
}

.app-sidebar::-webkit-scrollbar-thumb,
.nav-sublist::-webkit-scrollbar-thumb,
.admin-nav-sublist::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: 4px;
}

/* Content areas */
.viewer-content::-webkit-scrollbar,
.document-list::-webkit-scrollbar,
.table-container::-webkit-scrollbar,
.code-view::-webkit-scrollbar {
    width: var(--scrollbar-width);
    height: var(--scrollbar-width);
}

/* Modal scrollbars */
.modal-content::-webkit-scrollbar,
.modal-body::-webkit-scrollbar {
    width: var(--scrollbar-width);
}

/* Dropdown scrollbars */
.dropdown-menu::-webkit-scrollbar,
.select-dropdown::-webkit-scrollbar {
    width: var(--scrollbar-width);
}

/* Mobile optimization */
@media (max-width: 768px) {
    :root {
        --scrollbar-width: 6px; /* Тоньше на мобильных */
    }
    
    [data-theme="high-contrast"] {
        --scrollbar-width: 10px; /* Но в high contrast толще */
    }
}

