/* ==========================================================================
   Settings Layout - Shared sidebar + content styles
   Loaded by (settings)/layout.js — applies to ALL settings subpages
   Uses !important to prevent per-page CSS from overriding sidebar
   ========================================================================== */

/* Sidebar: fixed, no scroll, compact */
.content-page .content-sidebar {
    overflow: hidden !important;
    padding-top: var(--spacing-lg) !important;
    gap: var(--spacing-xs) !important;
}

.content-page .content-sidebar::before {
    display: none !important;
}

.content-page .content-sidebar__section {
    margin-bottom: 2px !important;
}

.content-page .content-sidebar__section-title {
    padding: 4px 12px 2px !important;
}

.content-page .content-sidebar__section:last-child {
    margin-top: auto !important;
}

/* Discord card: compact */
.content-page .sidebar-discord {
    padding: 8px !important;
}

.content-page .sidebar-discord__icon {
    display: none !important;
}

.content-page .sidebar-discord__title {
    font-size: 12px !important;
}

.content-page .sidebar-discord__desc {
    font-size: 11px !important;
}

/* Content area: scrollable, hidden scrollbar */
.content-page .content-main {
    overflow-y: auto !important;
    scrollbar-width: none !important;
}

.content-page .content-main::-webkit-scrollbar {
    display: none !important;
}

/* Active sidebar item: keep original style, no flash */

/* Content stack: consistent max-width across all settings pages */
.content-page .content-main__stack {
    max-width: 720px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: var(--spacing-lg) 0 var(--spacing-xl) !important;
}

/* Dashboard needs wider for charts/tables */
.dashboard-settings-page .content-main__stack {
    max-width: 900px !important;
}

/* Page header (title + subtitle) */
.settings-page-header {
    margin-bottom: var(--spacing-lg);
}

.settings-page-header__title {
    font-size: var(--font-size-xl) !important;
    font-weight: 600;
    color: var(--color-text);
    margin: 0 0 4px 0;
}

.settings-page-header__subtitle {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin: 0;
}