/* =========================================================================
   PRFactory — Color tokens (the ONLY dual-palette token file)
   Values copied verbatim from the chosen mockup
   C:\temp\PRFactory\mockups\06-developer-dark-dual\styles.css
   (dark :root L18-79, light overrides L154-220).

   Theme resolution (Epic 17 owner decision, no JS / no <script>):
     1. Default (no explicit user override): CSS prefers-color-scheme.
        Dark is the canonical :root; light is applied when the OS asks
        for it via @media (prefers-color-scheme: light).
     2. Explicit user override: a [data-theme="dark"|"light"] attribute
        emitted on <html> server-side from the prf-theme cookie. The
        attribute selectors below have higher specificity than the
        media-query block, so an explicit choice always wins the cascade.
   No gradients in either mode — flat fills only.
   ========================================================================= */

:root {
  /* ===== DARK MODE COLOR TOKENS (default) ============================== */
  /* Native scrollbars and form widgets follow the theme. */
  color-scheme: dark;

  /* ---- Surfaces (deep neutral ink, NOT pure black) ---- */
  --color-bg-base:        #0d1117;   /* app canvas */
  --color-bg-sunken:      #0a0d12;   /* behind cards / wells */
  --color-surface-1:      #131a23;   /* primary panels / cards */
  --color-surface-2:      #19222e;   /* raised panels / hover */
  --color-surface-3:      #212c3a;   /* popovers, active rows */
  --color-sidebar-bg:     #090c11;   /* app shell rail */
  --color-sidebar-active:  #16202c;

  /* ---- Borders / hairlines (layered elevation, not heavy shadows) ---- */
  --color-border:         #232f3e;
  --color-border-strong:  #31415440;
  --color-border-soft:    #1c2530;
  --color-divider:        #1a2330;

  /* ---- Text ---- */
  --color-text:           #e6edf3;   /* primary */
  --color-text-secondary: #aab6c4;   /* body / labels */
  --color-text-muted:     #8b98a5;   /* meta / captions */
  --color-text-faint:     #4a5867;   /* placeholders */
  --color-text-on-accent: #04121b;

  /* ---- One confident accent: cool cyan ---- */
  --color-accent:         #34d1bf;   /* primary actions / active */
  --color-accent-hover:   #4ee0cf;
  --color-accent-press:   #25b3a3;
  --color-accent-soft:    #34d1bf1f;  /* tint fills */
  --color-accent-line:    #34d1bf3d;  /* tint borders */
  --color-accent-text:    #5fe3d2;   /* accent text on dark */

  /* ---- Semantic (used sparingly, for meaning only) ---- */
  --color-success:        #3fb950;
  --color-success-soft:   #3fb9501f;
  --color-success-line:   #3fb95040;
  --color-success-text:   #56d364;

  --color-warning:        #d9a23b;
  --color-warning-soft:   #d9a23b1f;
  --color-warning-line:   #d9a23b40;
  --color-warning-text:   #e3b341;

  --color-danger:         #e5534b;
  --color-danger-soft:    #e5534b1f;
  --color-danger-line:    #e5534b40;
  --color-danger-text:    #ff7b72;

  --color-info:           #539bf5;
  --color-info-soft:      #539bf51f;
  --color-info-line:      #539bf540;
  --color-info-text:      #6cb6ff;

  --color-neutral-soft:   #aab6c41a;
    --color-neutral-line:   #aab6c433;

  /* Epic 24 E2: third repository monogram hue (cycles with accent/info). */
  --repo-1: var(--color-accent);
  --repo-1-soft: var(--color-accent-soft);
  --repo-1-line: var(--color-accent-line);
  --repo-2: var(--color-info);
  --repo-2-soft: var(--color-info-soft);
  --repo-2-line: var(--color-info-line);
  --repo-3: #b083f0;
  --repo-3-soft: #b083f01f;
  --repo-3-line: #b083f040;

  /* select / search caret glyph color (mode-dependent so it's a token) */
  --glyph-stroke: %236e7d8d;

  /* dotted backdrop texture color */
  --texture-dot: rgba(255,255,255,0.018);
}

/* ========================================================================
   LIGHT MODE token values.
   Defined once via a custom property block and applied through two
   selectors: the OS-preference media query (default when no explicit
   override) and the explicit [data-theme="light"] attribute (always
   wins, higher specificity). Mostly minimal-crisp: cool near-neutral
   grays, light canvas, near-black ink, ONE restrained indigo accent.
   Subtle surface + shadow refinement. NO GRADIENTS.
   ======================================================================== */

/* Explicit user override → light (highest precedence). */
[data-theme="light"] {
  color-scheme: light;
  /* ---- Surfaces ---- */
  --color-bg-base:        #fbfbfc;   /* app canvas, very light cool gray */
  --color-bg-sunken:      #f6f7f8;   /* table heads / inset wells */
  --color-surface-1:      #ffffff;   /* primary panels / cards */
  --color-surface-2:      #f7f8fa;   /* raised panels / hover (soft tint) */
  --color-surface-3:      #eef0f3;   /* popovers / active rows */
  --color-sidebar-bg:     #ffffff;   /* near-white shell rail */
  --color-sidebar-active:  #f1f1fb;  /* faint indigo wash */

  /* ---- Borders / hairlines ---- */
  --color-border:         #e7e9ec;
  --color-border-strong:  #d5d8dd;
  --color-border-soft:    #eef0f2;
  --color-divider:        #edeef1;

  /* ---- Text ---- */
  --color-text:           #16181d;   /* near-black ink */
  --color-text-secondary: #3b3f48;
  --color-text-muted:     #6b7280;
  --color-text-faint:     #9ca3af;
  --color-text-on-accent: #ffffff;

  /* ---- The ONE restrained accent: indigo ---- */
  --color-accent:         #4f46e5;
  --color-accent-hover:   #4338ca;
  --color-accent-press:   #3730a3;
  --color-accent-soft:    #eef0fe;
  --color-accent-line:    #d9dcfb;
  --color-accent-text:    #4f46e5;

  /* ---- Semantic (meaning only — soft tint badges, small dots) ---- */
  --color-success:        #15803d;
  --color-success-soft:   #ecf6ef;
  --color-success-line:   #cfe6d7;
  --color-success-text:   #146c34;

  --color-warning:        #a16207;
  --color-warning-soft:   #f9f3e6;
  --color-warning-line:   #ecdfbf;
  --color-warning-text:   #8f5706;

  --color-danger:         #b42318;
  --color-danger-soft:    #fbeeed;
  --color-danger-line:    #f0d2cf;
  --color-danger-text:    #b42318;

  --color-info:           #1d4ed8;
  --color-info-soft:      #eaf0fc;
  --color-info-line:      #d2def7;
  --color-info-text:      #1d4ed8;

  --color-neutral-soft:   #1618210d;
  --color-neutral-line:   #1618211f;

  /* Epic 24 E2: third repository monogram hue (cycles with accent/info). */
  --repo-1: var(--color-accent);
  --repo-1-soft: var(--color-accent-soft);
  --repo-1-line: var(--color-accent-line);
  --repo-2: var(--color-info);
  --repo-2-soft: var(--color-info-soft);
  --repo-2-line: var(--color-info-line);
  --repo-3: #7c3aed;
  --repo-3-soft: #f3ecfe;
  --repo-3-line: #e2d5fb;

  /* select / search caret glyph color */
  --glyph-stroke: %236b7280;

  /* faint texture nearly invisible on light */
  --texture-dot: rgba(16,18,23,0.022);

  /* ---- Shadow refinement: real soft shadows on light surfaces ---- */
  --shadow-xs: 0 1px 2px rgba(16,18,23,0.04);
  --shadow-sm: 0 1px 2px rgba(16,18,23,0.05), 0 0 0 1px var(--color-border-soft);
  --shadow-md: 0 4px 12px rgba(16,18,23,0.07);
  --shadow-lg: 0 12px 28px rgba(16,18,23,0.12);
  --glow-accent: 0 0 0 1px var(--color-accent-line), 0 6px 20px -12px rgba(79,70,229,0.30);
}

/* Explicit user override → dark. Redeclared so it always beats the
   prefers-color-scheme: light media query below via specificity. */
[data-theme="dark"] {
  color-scheme: dark;
  --color-bg-base:        #0d1117;
  --color-bg-sunken:      #0a0d12;
  --color-surface-1:      #131a23;
  --color-surface-2:      #19222e;
  --color-surface-3:      #212c3a;
  --color-sidebar-bg:     #090c11;
  --color-sidebar-active:  #16202c;

  --color-border:         #232f3e;
  --color-border-strong:  #31415440;
  --color-border-soft:    #1c2530;
  --color-divider:        #1a2330;

  --color-text:           #e6edf3;
  --color-text-secondary: #aab6c4;
  --color-text-muted:     #8b98a5;
  --color-text-faint:     #4a5867;
  --color-text-on-accent: #04121b;

  --color-accent:         #34d1bf;
  --color-accent-hover:   #4ee0cf;
  --color-accent-press:   #25b3a3;
  --color-accent-soft:    #34d1bf1f;
  --color-accent-line:    #34d1bf3d;
  --color-accent-text:    #5fe3d2;

  --color-success:        #3fb950;
  --color-success-soft:   #3fb9501f;
  --color-success-line:   #3fb95040;
  --color-success-text:   #56d364;

  --color-warning:        #d9a23b;
  --color-warning-soft:   #d9a23b1f;
  --color-warning-line:   #d9a23b40;
  --color-warning-text:   #e3b341;

  --color-danger:         #e5534b;
  --color-danger-soft:    #e5534b1f;
  --color-danger-line:    #e5534b40;
  --color-danger-text:    #ff7b72;

  --color-info:           #539bf5;
  --color-info-soft:      #539bf51f;
  --color-info-line:      #539bf540;
  --color-info-text:      #6cb6ff;

  --color-neutral-soft:   #aab6c41a;
    --color-neutral-line:   #aab6c433;

  /* Epic 24 E2: third repository monogram hue (cycles with accent/info). */
  --repo-1: var(--color-accent);
  --repo-1-soft: var(--color-accent-soft);
  --repo-1-line: var(--color-accent-line);
  --repo-2: var(--color-info);
  --repo-2-soft: var(--color-info-soft);
  --repo-2-line: var(--color-info-line);
  --repo-3: #b083f0;
  --repo-3-soft: #b083f01f;
  --repo-3-line: #b083f040;

  --glyph-stroke: %236e7d8d;
  --texture-dot: rgba(255,255,255,0.018);
}

/* OS preference is light AND the user has NOT made an explicit choice.
   :root:not([data-theme]) keeps this from overriding an explicit
   [data-theme="dark"] selection (which has higher specificity anyway). */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --color-bg-base:        #fbfbfc;
    --color-bg-sunken:      #f6f7f8;
    --color-surface-1:      #ffffff;
    --color-surface-2:      #f7f8fa;
    --color-surface-3:      #eef0f3;
    --color-sidebar-bg:     #ffffff;
    --color-sidebar-active:  #f1f1fb;

    --color-border:         #e7e9ec;
    --color-border-strong:  #d5d8dd;
    --color-border-soft:    #eef0f2;
    --color-divider:        #edeef1;

    --color-text:           #16181d;
    --color-text-secondary: #3b3f48;
    --color-text-muted:     #6b7280;
    --color-text-faint:     #9ca3af;
    --color-text-on-accent: #ffffff;

    --color-accent:         #4f46e5;
    --color-accent-hover:   #4338ca;
    --color-accent-press:   #3730a3;
    --color-accent-soft:    #eef0fe;
    --color-accent-line:    #d9dcfb;
    --color-accent-text:    #4f46e5;

    --color-success:        #15803d;
    --color-success-soft:   #ecf6ef;
    --color-success-line:   #cfe6d7;
    --color-success-text:   #146c34;

    --color-warning:        #a16207;
    --color-warning-soft:   #f9f3e6;
    --color-warning-line:   #ecdfbf;
    --color-warning-text:   #8f5706;

    --color-danger:         #b42318;
    --color-danger-soft:    #fbeeed;
    --color-danger-line:    #f0d2cf;
    --color-danger-text:    #b42318;

    --color-info:           #1d4ed8;
    --color-info-soft:      #eaf0fc;
    --color-info-line:      #d2def7;
    --color-info-text:      #1d4ed8;

    --color-neutral-soft:   #1618210d;
    --color-neutral-line:   #1618211f;

    /* Epic 24 E2: third repository monogram hue (cycles with accent/info). */
    --repo-1: var(--color-accent);
    --repo-1-soft: var(--color-accent-soft);
    --repo-1-line: var(--color-accent-line);
    --repo-2: var(--color-info);
    --repo-2-soft: var(--color-info-soft);
    --repo-2-line: var(--color-info-line);
    --repo-3: #7c3aed;
    --repo-3-soft: #f3ecfe;
    --repo-3-line: #e2d5fb;

    --glyph-stroke: %236b7280;
    --texture-dot: rgba(16,18,23,0.022);

    --shadow-xs: 0 1px 2px rgba(16,18,23,0.04);
    --shadow-sm: 0 1px 2px rgba(16,18,23,0.05), 0 0 0 1px var(--color-border-soft);
    --shadow-md: 0 4px 12px rgba(16,18,23,0.07);
    --shadow-lg: 0 12px 28px rgba(16,18,23,0.12);
    --glow-accent: 0 0 0 1px var(--color-accent-line), 0 6px 20px -12px rgba(79,70,229,0.30);
  }
}
