/* Only layouts.app loads this file. Public client pages, mail and PDFs do not. */
:root {
    color-scheme: light;
    --canvas: #f3f5f8;
    --surface: #ffffff;
    --surface-muted: #f0f3f7;
    --ink: #182334;
    --muted: #526174;
    --line: #ced6e0;
    --border-strong: #8896a8;
    --input-bg: #ffffff;
    --input-border: #8896a8;
    --disabled-bg: #e6eaf0;
    --shadow: 0 18px 50px rgb(15 23 42 / 10%);
    --danger: #a62636;
    --danger-hover: #881b2b;
    --danger-soft: #fff0f2;
    --danger-border: #c66772;
    --on-danger: #ffffff;
    --warning: #805200;
    --warning-soft: #fff5d6;
    --warning-border: #b88725;
    --success: #23603c;
    --success-soft: #eaf6ee;
    --success-border: #5c9c71;
    --accent: #245bc2;
    --accent-hover: #1d49a0;
    --accent-text: var(--accent-text-light, #1d49a0);
    --accent-soft: var(--accent-soft-light, #ecf2ff);
    --accent-border: var(--accent-border-light, #6688bd);
    --focus-ring: var(--accent-text);
    /* Existing component aliases, resolved in the same element. */
    --brand: var(--accent);
    --brand-dark: var(--accent-hover);
}

:root[data-accent="blue"] {
    --accent: #245bc2;
    --accent-hover: #1d49a0;
    --accent-text-light: #1d49a0;
    --accent-soft-light: #ecf2ff;
    --accent-border-light: #6688bd;
    --accent-text-dark: #adcaff;
    --accent-soft-dark: #213658;
    --accent-border-dark: #789ed4;
}
.accent-swatch-blue { background: #245bc2; color: #245bc2; }

:root[data-accent="violet"] {
    --accent: #7040b8;
    --accent-hover: #592c98;
    --accent-text-light: #592c98;
    --accent-soft-light: #f4efff;
    --accent-border-light: #9976bd;
    --accent-text-dark: #d4b6ff;
    --accent-soft-dark: #342747;
    --accent-border-dark: #ad8acf;
}
.accent-swatch-violet { background: #7040b8; color: #7040b8; }

:root[data-accent="green"] {
    --accent: #276847;
    --accent-hover: #1d5237;
    --accent-text-light: #1d5237;
    --accent-soft-light: #eaf6ee;
    --accent-border-light: #649477;
    --accent-text-dark: #a4ddbc;
    --accent-soft-dark: #213c31;
    --accent-border-dark: #72aa8c;
}
.accent-swatch-green { background: #276847; color: #276847; }

:root[data-accent="orange"] {
    --accent: #9c430b;
    --accent-hover: #7e3307;
    --accent-text-light: #7e3307;
    --accent-soft-light: #fff1e5;
    --accent-border-light: #b7825b;
    --accent-text-dark: #ffc297;
    --accent-soft-dark: #432e22;
    --accent-border-dark: #c38e68;
}
.accent-swatch-orange { background: #9c430b; color: #9c430b; }

:root[data-accent="red"] {
    --accent: #b03245;
    --accent-hover: #902638;
    --accent-text-light: #902638;
    --accent-soft-light: #fff0f2;
    --accent-border-light: #b87680;
    --accent-text-dark: #ffb8c3;
    --accent-soft-dark: #442a35;
    --accent-border-dark: #c98897;
}
.accent-swatch-red { background: #b03245; color: #b03245; }

:root[data-accent="neutral"] {
    --accent: #4d596a;
    --accent-hover: #394454;
    --accent-text-light: #394454;
    --accent-soft-light: #eef1f5;
    --accent-border-light: #7d8a9b;
    --accent-text-dark: #d5deeb;
    --accent-soft-dark: #303c4d;
    --accent-border-dark: #8fa0b7;
}
.accent-swatch-neutral { background: #4d596a; color: #4d596a; }

:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] {
    color-scheme: dark;
    --canvas: #111821;
    --surface: #1b2532;
    --surface-muted: #253141;
    --ink: #edf2f8;
    --muted: #b5c1d1;
    --line: #46566c;
    --border-strong: #7b8da5;
    --input-bg: #17212d;
    --input-border: #7b8da5;
    --disabled-bg: #303e50;
    --shadow: 0 18px 50px rgb(0 0 0 / 30%);
    --danger: #ffb3bf;
    --danger-hover: #ffd1d8;
    --danger-soft: #431f2a;
    --danger-border: #be677c;
    --on-danger: #43111c;
    --warning: #f8d37a;
    --warning-soft: #3c321e;
    --warning-border: #b6994d;
    --success: #9edbb3;
    --success-soft: #1b382b;
    --success-border: #6baf84;
    --accent-text: var(--accent-text-dark, #adcaff);
    --accent-soft: var(--accent-soft-dark, #213658);
    --accent-border: var(--accent-border-dark, #789ed4);
}
@media (prefers-color-scheme: dark) {
    :root[data-theme="system"] {
        color-scheme: dark;
        --canvas: #111821;
        --surface: #1b2532;
        --surface-muted: #253141;
        --ink: #edf2f8;
        --muted: #b5c1d1;
        --line: #46566c;
        --border-strong: #7b8da5;
        --input-bg: #17212d;
        --input-border: #7b8da5;
        --disabled-bg: #303e50;
        --shadow: 0 18px 50px rgb(0 0 0 / 30%);
        --danger: #ffb3bf;
        --danger-hover: #ffd1d8;
        --danger-soft: #431f2a;
        --danger-border: #be677c;
        --on-danger: #43111c;
        --warning: #f8d37a;
        --warning-soft: #3c321e;
        --warning-border: #b6994d;
        --success: #9edbb3;
        --success-soft: #1b382b;
        --success-border: #6baf84;
        --accent-text: var(--accent-text-dark, #adcaff);
        --accent-soft: var(--accent-soft-dark, #213658);
        --accent-border: var(--accent-border-dark, #789ed4);
    }
}