/* The website's own design tokens: its landing page, table and chrome values, and
   the older stylesheets' names pointed at the shared ones. The brand, ink, lines,
   surfaces, status colours and shapes are tpblib.brand's, in static/css/brand.css
   (GENERATED — `python -m tpblib.brand static/css/brand.css` after a tpblib bump;
   tests/general/test_shared_styles.py fails while it lags the installed tpblib).
   Both load first in base.html and in every Dash app
   (dash_registry.get_external_styles), so a Django page and the iframe inside it
   read the same values. A stylesheet uses var(--ctm-*) and never a literal:
   test_shared_styles.py fails a new hex colour anywhere else. */

:root {
    /* Public landing page: dark editorial panel and its readable accents. */
    --ctm-landing-dark: #201b2b;
    --ctm-landing-muted: #bfb7ce;
    --ctm-landing-accent: #c8b0f0;

    /* Surfaces the website alone uses */
    --ctm-edit-bg: #eef9ff; /* an assumption cell the user can type in */
    --ctm-edit-bg-strong: #d8efff;

    /* Chrome */
    --ctm-header-h: 53px; /* 52px bar + its 1px rule */
    --ctm-header-bg: var(--ctm-fill);
    --ctm-pagebar-h: 45px;
    --ctm-sidebar-w: 248px;

    /* The names the older stylesheets read, pointed at the tokens. */
    --font-color: var(--ctm-ink);
    --button-color: var(--ctm-brand);
    --button-hover-color: var(--ctm-brand-600);
    --button-text-color: var(--ctm-surface);
    --input-bg-color: var(--ctm-surface);
    --input-text-color: var(--ctm-ink);
    --input-border-color: var(--ctm-line-strong);
    --body-bg-color: var(--ctm-canvas);
    --container-bg-overlay: var(--ctm-surface);
    --nav-hover-bg: rgba(111, 66, 193, 0.1);
    --nav-hover-shadow: none;
    --error-bg-color: var(--ctm-danger-50);
    --error-border-color: var(--ctm-danger-line);
    --error-text-color: var(--ctm-danger-ink);
    --header-bg-color: var(--ctm-header-bg);
    --common-button-max-width: 400px; /* auth buttons and inputs */
    --section-accent-bg: var(--ctm-brand-50);
    --section-accent-border: var(--ctm-brand);
}
