/* CCD Vault shared design variables. Dark theme is the default. */
:root,
:root[data-theme="dark"],
html[data-theme="dark"] {
    color-scheme: dark;

    /* Surfaces */
    --bg-primary: #061522;
    --bg-secondary: #0d2033;
    --background-secondary: #0d2033;
    --bg-tertiary: #17314a;
    --bg-quaternary: #244461;
    --bg-hover: rgba(82, 165, 255, 0.12);
    --card-bg: #0d2033;
    --card-background: #0d2033;
    --surface-color: #0d2033;
    --input-bg: #17314a;
    --secondary-bg: #244461;

    /* Text */
    --text-primary: #f4f8ff;
    --text-secondary: #c5d6e8;
    --text-muted: #86a4bf;
    --text-on-primary: #ffffff;
    --text-on-status-paused: #d7e3f0;

    /* Lines and elevation */
    --border-color: rgba(134, 164, 191, 0.22);
    --border-light: rgba(134, 164, 191, 0.14);
    --shadow: rgba(0, 0, 0, 0.38);
    --shadow-lg: rgba(0, 0, 0, 0.52);
    --card-shadow: none;

    /* Brand and states */
    --accent-primary: #4aa8ff;
    --accent-secondary: #2388ec;
    --primary-color: #4aa8ff;
    --primary-dark: #2388ec;
    --primary-soft: rgba(74, 168, 255, 0.16);
    --info-color: #4aa8ff;
    --success: #34d399;
    --success-color: #34d399;
    --warning: #fbbf24;
    --warning-color: #fbbf24;
    --danger: #fb7185;
    --danger-color: #fb7185;
    --error-color: #fb7185;
    --danger-dark: #e11d48;
    --danger-strong: #e11d48;
    --status-paused: #3b4656;

    /* Soft state fills */
    --info-light: rgba(74, 168, 255, 0.12);
    --success-light: rgba(52, 211, 153, 0.12);
    --warning-light: rgba(251, 191, 36, 0.13);
    --danger-light: rgba(251, 113, 133, 0.13);

    /* Shared components */
    --page-header-bg: linear-gradient(135deg, rgba(74, 168, 255, 0.13) 0%, rgba(74, 168, 255, 0.04) 100%);
    --list-entry-bg: linear-gradient(135deg, rgba(74, 168, 255, 0.08) 0%, rgba(74, 168, 255, 0.03) 100%);
    --list-entry-bg-hover: rgba(74, 168, 255, 0.12);

    /* Sidebar */
    --sidebar-width: 280px;
    --sidebar-background: #061522;
    --sidebar-surface: rgba(255, 255, 255, 0.055);
    --sidebar-active: rgba(74, 168, 255, 0.17);
    --danger-soft: rgba(251, 113, 133, 0.14);
    --font-body: 'Source Sans 3', sans-serif;
    --transition: all 0.2s ease;
}

html[data-theme="light"],
:root[data-theme="light"] {
    color-scheme: light;

    --bg-primary: #f5fbff;
    --bg-secondary: #e9f4fd;
    --background-secondary: #e9f4fd;
    --bg-tertiary: #dcebf8;
    --bg-quaternary: #c8ddf0;
    --bg-hover: rgba(35, 136, 236, 0.10);
    --card-bg: #e9f4fd;
    --card-background: #e9f4fd;
    --surface-color: #e9f4fd;
    --input-bg: #dcebf8;
    --secondary-bg: #c8ddf0;

    --text-primary: #0b2440;
    --text-secondary: #37536f;
    --text-muted: #6c849c;
    --text-on-primary: #ffffff;
    --text-on-status-paused: #37536f;

    --border-color: rgba(87, 115, 143, 0.18);
    --border-light: rgba(87, 115, 143, 0.12);
    --shadow: rgba(15, 35, 60, 0.08);
    --shadow-lg: rgba(15, 35, 60, 0.14);
    --card-shadow: none;

    --accent-primary: #2388ec;
    --accent-secondary: #0d6fd1;
    --primary-color: #2388ec;
    --primary-dark: #0d6fd1;
    --primary-soft: rgba(35, 136, 236, 0.13);
    --info-color: #2388ec;
    --success: #059669;
    --success-color: #059669;
    --warning: #d97706;
    --warning-color: #d97706;
    --danger: #e11d48;
    --danger-color: #e11d48;
    --error-color: #e11d48;
    --danger-dark: #be123c;
    --danger-strong: #be123c;
    --status-paused: #d8e4f0;

    --info-light: rgba(35, 136, 236, 0.12);
    --success-light: rgba(5, 150, 105, 0.12);
    --warning-light: rgba(217, 119, 6, 0.12);
    --danger-light: rgba(225, 29, 72, 0.12);

    --page-header-bg: linear-gradient(135deg, rgba(35, 136, 236, 0.12) 0%, rgba(35, 136, 236, 0.04) 100%);
    --list-entry-bg: linear-gradient(135deg, rgba(35, 136, 236, 0.07) 0%, rgba(35, 136, 236, 0.03) 100%);
    --list-entry-bg-hover: rgba(35, 136, 236, 0.10);

    --sidebar-background: #f7fbff;
    --sidebar-surface: rgba(35, 136, 236, 0.085);
    --sidebar-active: rgba(35, 136, 236, 0.14);
    --danger-soft: rgba(225, 29, 72, 0.10);
}
