/*
 * Shared design tokens for the Ashby suite (todo / screen / roadmap).
 * Canonically hosted on screen.ashby.space and loaded cross-origin by
 * todo (plain <link> tags aren't subject to CORS). Roadmap doesn't load
 * this file directly (it's a separate React/Tailwind build) but keeps its
 * own @theme brand colors in sync with --primary/--primary-hover here —
 * see the comment in roadmap/client/src/index.css.
 *
 * Extracted from screen/css/styles.css, which used to define this block
 * inline — moved here so todo can share it instead of maintaining a
 * second, drift-prone copy.
 */
:root {
    color-scheme: light;
    --bg: #fbe8e1;
    --surface: #ffffff;
    --surface-alt: #fafafa;
    --border: #e1e4e8;
    --text: #1f2328;
    --text-muted: #6b7280;
    --primary: #f9573a;
    --primary-hover: #e6432a;
    --danger: #dc2626;
    --danger-hover: #b91c1c;
    --radius: 8px;

    --badge-bg: #eef2ff;
    --badge-recording-bg: #fff7ed;
    --badge-recording-text: #c2410c;
    --badge-shared-bg: #f0fdf4;
    --badge-shared-text: #15803d;

    --error-bg: #fef2f2;
    --error-border: #fecaca;
    --success-bg: #f0fdf4;
    --success-border: #bbf7d0;
    --success-text: #15803d;

    --token-bg: #f0fdf4;
    --token-border: #bbf7d0;

    --overlay-bg: rgba(15, 17, 21, 0.5);
    --skeleton-shine: rgba(255, 255, 255, 0.6);
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --bg: #15171c;
        --surface: #1c1f26;
        --surface-alt: #23262e;
        --border: #2e323b;
        --text: #e6e8eb;
        --text-muted: #9aa1ac;
        --primary: #ff7a5c;
        --primary-hover: #ff9d85;
        --danger: #f87171;
        --danger-hover: #fb9d9d;

        --badge-bg: rgba(79, 140, 246, 0.16);
        --badge-recording-bg: rgba(251, 146, 60, 0.16);
        --badge-recording-text: #fb923c;
        --badge-shared-bg: rgba(74, 222, 128, 0.14);
        --badge-shared-text: #4ade80;

        --error-bg: rgba(248, 113, 113, 0.12);
        --error-border: rgba(248, 113, 113, 0.4);
        --success-bg: rgba(74, 222, 128, 0.12);
        --success-border: rgba(74, 222, 128, 0.4);
        --success-text: #4ade80;

        --token-bg: rgba(74, 222, 128, 0.1);
        --token-border: rgba(74, 222, 128, 0.35);

        --overlay-bg: rgba(0, 0, 0, 0.6);
        --skeleton-shine: rgba(255, 255, 255, 0.08);
    }
}