/**
 * Dark Mode Overrides
 * Applied when [data-theme="dark"] is set on html element
 */

[data-theme="dark"] {
    /* Background colors */
    --bg-primary: #191919;
    --bg-secondary: #242424;
    --bg-tertiary: #2e2e2e;

    /* Text colors */
    --text-primary: #e3e2e0;
    --text-secondary: #9b9a97;
    --text-tertiary: #787774;

    /* Border colors */
    --border-primary: #373737;
    --border-secondary: #2e2e2e;

    /* Accent colors (keep same but adjust brightness) */
    --accent: #2ea3f2;
    --accent-hover: #5db8f5;

    /* Shadows */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.5);

    /* Status colors - adjusted for dark mode */
    --success-bg: rgba(46, 125, 50, 0.15);
    --success-text: #81c784;

    --warning-bg: rgba(245, 124, 0, 0.15);
    --warning-text: #ffb74d;

    --danger-bg: rgba(211, 47, 47, 0.15);
    --danger-text: #e57373;

    --info-bg: rgba(2, 136, 209, 0.15);
    --info-text: #64b5f6;
}

/* Inputs & Forms */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    background: var(--bg-secondary);
    border-color: var(--border-primary);
    color: var(--text-primary);
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
    border-color: var(--accent);
    background: var(--bg-tertiary);
}

/* Code blocks */
[data-theme="dark"] code,
[data-theme="dark"] pre {
    background: var(--bg-secondary);
    border-color: var(--border-primary);
}

/* Images - slight opacity reduction */
[data-theme="dark"] img {
    opacity: 0.9;
}

[data-theme="dark"] img:hover {
    opacity: 1;
}

/* Scrollbars */
[data-theme="dark"] ::-webkit-scrollbar {
    background: var(--bg-secondary);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--border-primary);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--text-tertiary);
}