/* Final colour pass for feature styles loaded after codex-theme.css. */

#settingsView .settings-backdrop {
    background: rgba(41, 39, 35, 0.78) !important;
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
}

#settingsView .settings-window {
    background: var(--modal-bg) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 24px 60px rgba(35, 30, 24, 0.24) !important;
}

#settingsView .settings-tabs {
    background: var(--bg-sidebar) !important;
    border-color: var(--border-color) !important;
}

#settingsView .settings-card,
#settingsView .settings-close-btn {
    background: var(--codex-surface) !important;
    border-color: var(--border-color) !important;
    box-shadow: none !important;
}

#settingsView .settings-tab-btn.active {
    background: var(--logicum-active-bg) !important;
    border-color: var(--logicum-active-border) !important;
    box-shadow: inset 3px 0 0 var(--logicum-active-accent) !important;
}

#settingsView .settings-avatar-edit,
#settingsView #settings-tab-ai .ai-settings-heading-icon {
    background: var(--accent-color) !important;
    color: var(--accent-text) !important;
    box-shadow: none !important;
}

/* The study area shares the product palette instead of keeping a blue-black theme. */
:root {
    --study-workspace-bg: #2a2927;
    --study-surface: #312f2c;
    --study-surface-raised: #373531;
    --study-border: #48443f;
    --study-border-soft: #3d3a35;
    --study-text-muted: #b8b2a9;
}

body.light-mode {
    --study-workspace-bg: #f3f0e9;
    --study-surface: #faf7f1;
    --study-surface-raised: #fffaf3;
    --study-border: #d5cec3;
    --study-border-soft: #e1dbd1;
    --study-text-muted: #6e6860;
}

body.study-workspace-active #quizView,
body.study-workspace-active #noteView,
body.study-workspace-active #interrogationView,
body.study-workspace-active #mindMapView,
#studyHelperTabBar.browser-tabs-container,
#mediaTabBar.browser-tabs-container {
    background: var(--study-workspace-bg) !important;
    border-color: var(--study-border) !important;
}

.learning-card-icon,
body.light-mode .learning-card-icon {
    color: var(--accent-color) !important;
}


/* Muted earth tones keep individual study tools recognizable without a
   rainbow dashboard. Orange remains the focal category. */
.study-tool-card--mindmap {
    --card-accent: #9a777a;
    --card-glow: rgba(154, 119, 122, 0.10);
    --card-icon-bg: rgba(154, 119, 122, 0.12);
    --card-icon-border: rgba(154, 119, 122, 0.24);
    --card-icon-color: #c69598;
    --card-icon-glow: rgba(154, 119, 122, 0.22);
    --card-tag-bg: rgba(154, 119, 122, 0.08);
    --card-tag-border: rgba(154, 119, 122, 0.18);
    --card-tag-hover: rgba(154, 119, 122, 0.13);
}

.study-tool-card--quiz {
    --card-accent: #d9703f;
    --card-glow: rgba(217, 112, 63, 0.10);
    --card-icon-bg: rgba(217, 112, 63, 0.12);
    --card-icon-border: rgba(217, 112, 63, 0.24);
    --card-icon-color: #e99a6f;
    --card-icon-glow: rgba(217, 112, 63, 0.22);
    --card-tag-bg: rgba(217, 112, 63, 0.08);
    --card-tag-border: rgba(217, 112, 63, 0.18);
    --card-tag-hover: rgba(217, 112, 63, 0.13);
}

.study-tool-card--notes {
    --card-accent: #778b6d;
    --card-glow: rgba(119, 139, 109, 0.10);
    --card-icon-bg: rgba(119, 139, 109, 0.12);
    --card-icon-border: rgba(119, 139, 109, 0.24);
    --card-icon-color: #a6b89a;
    --card-icon-glow: rgba(119, 139, 109, 0.22);
    --card-tag-bg: rgba(119, 139, 109, 0.08);
    --card-tag-border: rgba(119, 139, 109, 0.18);
    --card-tag-hover: rgba(119, 139, 109, 0.13);
}

.study-tool-card--interrogation {
    --card-accent: #aa805f;
    --card-glow: rgba(170, 128, 95, 0.10);
    --card-icon-bg: rgba(170, 128, 95, 0.12);
    --card-icon-border: rgba(170, 128, 95, 0.24);
    --card-icon-color: #d0a27d;
    --card-icon-glow: rgba(170, 128, 95, 0.22);
    --card-tag-bg: rgba(170, 128, 95, 0.08);
    --card-tag-border: rgba(170, 128, 95, 0.18);
    --card-tag-hover: rgba(170, 128, 95, 0.13);
}


body.light-mode #settingsView .settings-backdrop {
    background: rgba(235, 231, 222, 0.78) !important;
}

/* Keep notification settings on the same continuous surface as the other
   settings rows instead of giving each row a separate tinted panel. */
#settingsView #settings-tab-notifications .notification-settings-grid {
    gap: 0;
}

#settingsView #settings-tab-notifications .notification-setting-row {
    padding: 20px 0;
    border-radius: 0;
    border-bottom: 1px solid var(--border-color);
    background: transparent !important;
}