/* angry-leader.css - Theme for Angry Leader */

/* Import required foundation systems */
@import url('../global/global-core.css');
@import url('../global/form-core.css');
@import url('../global/content-block-core.css');
@import url('../global/blog-foundation.css');

[data-brand="angry-leader"] {
  /* Base palette */
  --bg: #050509;  /* near black */
  --fg: #f9fafb;
  --surface: color-mix(in srgb, var(--bg) 90%, #000000);
  --surface-2: color-mix(in srgb, var(--bg) 82%, #000000);

  /* Brand colors */
  --primary: #1f2933;   /* dark slate */
  --accent: #f97316;    /* angry orange */
  --accent-2: #ef4444;  /* rage red */

  /* Text/link tokens */
  --heading: var(--fg);
  --link: var(--accent);
  --link-hover: #fb923c;

  /* Nav */
  --nav-bg: color-mix(in srgb, var(--surface) 92%, transparent);
  --nav-border: color-mix(in srgb, var(--accent) 35%, transparent);
  --nav-link: var(--fg);
  --nav-link-hover: var(--accent);
  --nav-brand-color: var(--accent);

  /* Hero */
  --hero-bg: radial-gradient(900px 360px at 0% -10%, color-mix(in srgb, var(--accent) 18%, transparent), transparent),
             radial-gradient(900px 360px at 100% 0%, color-mix(in srgb, var(--accent-2) 14%, transparent), transparent),
             var(--bg);
  --hero-title: var(--heading);
  --hero-subtitle: color-mix(in srgb, var(--fg) 78%, transparent);

  /* Cards */
  --card-bg: color-mix(in srgb, var(--surface) 94%, transparent);
  --card-border: color-mix(in srgb, var(--primary) 20%, transparent);
  --card-border-hover: color-mix(in srgb, var(--accent) 30%, transparent);

  /* Buttons */
  --btn-bg: linear-gradient(45deg, var(--accent), color-mix(in srgb, var(--accent) 70%, var(--accent-2)));
  --btn-fg: var(--fg);
  --btn-border: transparent;

  /* Forms */
  --form-bg: var(--surface);
  --form-border: color-mix(in srgb, var(--accent) 32%, transparent);
  --label: var(--accent);
  --input-bg: color-mix(in srgb, var(--bg) 85%, #000000);
  --input-border: color-mix(in srgb, var(--fg) 12%, transparent);
  --input-fg: var(--fg);
  --focus: var(--accent);
  --focus-ring: color-mix(in srgb, var(--accent) 25%, transparent);

  --brand-on-primary: #020617;
}

/* Generated by scripts/prepare-assets.mjs (derive-contrast-tokens.mjs). */
[data-layout="ledger"][data-brand="angry-leader"] {
  --accent-text: #000000;
  --ledger-muted: #808792;
}