/*
Ueberschreibt die Django-Admin-Farben (hell UND dunkel) mit dem Corporate
Design von KanzlAI StB M. Schwarz, passend zu den Mitarbeiterseiten.

Primaer-Rot:  #A5342C   Dunkelgrau: #343433   Tiefschwarz: #181717
*/

/* HELL (Standardansicht, auch wenn ueber den Umschalter oben rechts explizit
   "hell" gewaehlt wird) */
html[data-theme="light"],
:root {
    --primary: #343433;
    --secondary: #181717;
    --accent: #a5342c;
    --primary-fg: #ffffff;

    --body-fg: #181717;
    --body-bg: #ffffff;
    --body-quiet-color: #5a5a59;
    --body-medium-color: #343433;
    --body-loud-color: #181717;

    --header-color: #f0f0f0;
    --header-branding-color: var(--accent);
    --header-bg: var(--secondary);
    --header-link-color: var(--primary-fg);

    --breadcrumbs-fg: #f0f0f0;
    --breadcrumbs-link-fg: #ffffff;
    --breadcrumbs-bg: var(--primary);

    --link-fg: #a5342c;
    --link-hover-color: #8a2b24;
    --link-selected-fg: #a5342c;

    --hairline-color: #e8e8e8;
    --border-color: #dddddd;

    --darkened-bg: #f5f5f5;
    --selected-bg: #f3e9e8;
    --selected-row: #f8f0ef;

    --button-fg: #ffffff;
    --button-bg: #a5342c;
    --button-hover-bg: #8a2b24;
    --default-button-bg: #343433;
    --default-button-hover-bg: #5a5a59;
}

/* DUNKEL (automatisch nach Systemeinstellung oder ueber den Umschalter) */
@media (prefers-color-scheme: dark) {
    :root {
        --primary: #343433;
        --secondary: #181717;
        --accent: #a5342c;
        --primary-fg: #ffffff;

        --body-fg: #f0f0f0;
        --body-bg: #181717;
        --body-quiet-color: #c9c9c9;
        --body-medium-color: #dcdcdc;
        --body-loud-color: #ffffff;

        --header-color: #f0f0f0;
        --header-branding-color: var(--accent);
        --header-bg: var(--secondary);
        --header-link-color: var(--primary-fg);

        --breadcrumbs-fg: #dcdcdc;
        --breadcrumbs-link-fg: #f0f0f0;
        --breadcrumbs-bg: var(--primary);

        --link-fg: #c1726b;
        --link-hover-color: #d99089;
        --link-selected-fg: #c1726b;

        --hairline-color: #3d3d3c;
        --border-color: #454544;

        --darkened-bg: #343433;
        --selected-bg: #2a2a29;
        --selected-row: #3d2321;

        --button-fg: #ffffff;
        --button-bg: #a5342c;
        --button-hover-bg: #8a2b24;
        --default-button-bg: #8a2b24;
        --default-button-hover-bg: #a5342c;
        --close-button-bg: #454544;
        --close-button-hover-bg: #5a5a59;
    }
}

html[data-theme="dark"] {
    --primary: #343433;
    --secondary: #181717;
    --accent: #a5342c;
    --primary-fg: #ffffff;

    --body-fg: #f0f0f0;
    --body-bg: #181717;
    --body-quiet-color: #c9c9c9;
    --body-medium-color: #dcdcdc;
    --body-loud-color: #ffffff;

    --header-color: #f0f0f0;
    --header-branding-color: var(--accent);
    --header-bg: var(--secondary);
    --header-link-color: var(--primary-fg);

    --breadcrumbs-fg: #dcdcdc;
    --breadcrumbs-link-fg: #f0f0f0;
    --breadcrumbs-bg: var(--primary);

    --link-fg: #c1726b;
    --link-hover-color: #d99089;
    --link-selected-fg: #c1726b;

    --hairline-color: #3d3d3c;
    --border-color: #454544;

    --darkened-bg: #343433;
    --selected-bg: #2a2a29;
    --selected-row: #3d2321;

    --button-fg: #ffffff;
    --button-bg: #a5342c;
    --button-hover-bg: #8a2b24;
    --default-button-bg: #8a2b24;
    --default-button-hover-bg: #a5342c;
    --close-button-bg: #454544;
    --close-button-hover-bg: #5a5a59;
}