/* Design tokens: colours, type, spacing. Written for this app to match
   opsportal's look; every other stylesheet uses these, never raw values. */

:root {
    color-scheme: light;

    /* Brand */
    --navy: #07294b;
    --navy-edge: #2c5282;
    --navy-text-soft: #cbd5e1;
    --warning-on-dark: #fbbf24; /* amber that reads on the navy bars */
    --header-band: #dde5ee; /* the page title's band, under the menu */
    --header-band-border: #c8d3e0;
    --slate: #475569;       /* a menu group's title band */
    --slate-text: #e2e8f0;
    --blue: #3182ce;
    --blue-dark: #2c5282;
    --blue-tint: #ebf8ff;
    --blue-border: #bfdbfe;

    /* Text */
    --text: #2d3748;
    --text-secondary: #4a5568;
    --text-muted: #718096;
    --text-on-dark: #ffffff;
    --on-dark-border: rgba(255, 255, 255, 0.4);
    --on-dark-hover: rgba(255, 255, 255, 0.1);

    /* Surfaces and lines */
    --bg-page: #eef2f6;
    --bg-surface: #ffffff;
    --bg-hover: #f7fafc;
    --bg-subtle: #f9fafb;
    --border: #d1d5db;
    --border-light: #e5e7eb;
    --nav-border: #d8dee7;

    /* Status */
    --success: #15803d;
    --warning: #b45309;
    --error: #b91c1c;
    --error-tint: #fee2e2;
    --error-border: #fecaca;

    /* Type */
    --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    --text-xs: 11px;
    --text-sm: 13px;
    --text-md: 14px;
    --text-lg: 18px;
    --text-xl: 22px;

    /* Spacing */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 24px;
    --space-2xl: 32px;

    /* Shape */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
    --shadow-nav: 0 2px 5px rgba(15, 23, 42, 0.07);
    --shadow-dialog: 0 10px 25px rgba(0, 0, 0, 0.15);
    --focus-ring: 0 0 0 3px rgba(49, 130, 206, 0.15);
    --disabled-opacity: 0.5;

    /* Frame */
    --banner-height: 60px;
    --status-bar-height: 30px;
    /* Layering: the banner above the page, a pop-up list above anything it opens over */
    --z-banner: 100;
    --z-popup: 200;
    --dialog-width: 520px;
    --menu-width: 180px;
    --sub-nav-width: 220px;
    --icon-size: 16px;
    --icon-button-size: 32px;
    --control-height: 38px; /* text, date and search inputs, and drop-downs */
    --select-list-height: 260px;
    --dialog-large-width: 900px;
    --dialog-max-height: 90vh;
    --signature-image-height: 120px;
    --signature-pad-height: 200px;
    --column-min-width: 320px;
    --tile-min-width: 140px;
    --tile-active-rule: 2px;
    --search-width: 320px;
    --status-dot-size: 8px;
    --log-number-size: 28px;
    --log-tick-size: 22px;
    --log-header-rule: 4px;
    --label-spacing: 0.03em;
    --label-spacing-wide: 0.06em;
}