/* HNT.ROCKS theme tokens. Layout, spacing and radii stay outside this file. */
:root,
html[data-theme="light"] {
  color-scheme: light;

  --hnt-bg: #e4e7e6;
  --hnt-bg-deep: #6f6e6d;
  --hnt-surface: rgba(255, 255, 255, .78);
  --hnt-surface-strong: rgba(255, 255, 255, .91);
  --hnt-surface-solid: #f8f8f5;
  --hnt-surface-soft: #ededeb;
  --hnt-surface-input: #f0f0ed;
  --hnt-surface-hover: rgba(255, 255, 255, .96);
  --hnt-text: #30302e;
  --hnt-text-soft: #92918a;
  --hnt-text-faint: #aaa79f;
  --hnt-text-on-dark: #fff;
  --hnt-border: rgba(52, 48, 37, .16);
  --hnt-border-soft: rgba(52, 48, 37, .10);
  --hnt-divider: #e3dece;
  --hnt-shadow: rgba(35, 35, 33, .12);
  --hnt-overlay: rgba(28, 28, 27, .46);
  --hnt-dark: #30302e;
  --hnt-dark-soft: #3a3a37;
  --hnt-brand-red: #b64e44;
  --hnt-brand-red-hover: #a3423a;
  --hnt-brand-red-soft: rgba(182, 78, 68, .13);
  --hnt-brand-red-soft-hover: rgba(182, 78, 68, .20);
  --hnt-green: #78b41d;
  --hnt-yellow: #ffd55a;

  /* Shared component aliases used by the header and comms dock. */
  --hnt-text-strong: #30302e;
  --hnt-text-muted: var(--hnt-text-soft);
  --hnt-text-subtle: #62625d;
  --hnt-text-accent: #9b761e;
  --hnt-surface-card: #f5f5f2;
  --hnt-surface-card-strong: #fafaf8;
  --hnt-surface-control: rgba(255, 255, 255, .72);
  --hnt-surface-faint: rgba(255, 255, 255, .18);
  --hnt-surface-table: rgba(255, 255, 255, .76);
  --hnt-surface-panel: #f0f0ed;
  --hnt-accent: #ffd55a;
  --hnt-accent-strong: #ffcd4c;
  --hnt-accent-gold: #d6a84f;
  --hnt-accent-soft: rgba(255, 232, 160, .48);
  --hnt-accent-soft-hover: rgba(255, 232, 160, .72);
  --hnt-success: var(--hnt-green);
  --hnt-online: #7fb728;
  --hnt-warning: #ff9d2a;
  --hnt-danger: #b8463a;
  --hnt-purple: #8f73c9;
  --hnt-border-medium: rgba(52, 48, 37, .22);
  --hnt-border-strong: #575752;
  --hnt-progress-fill: var(--hnt-brand-red);
  --hnt-progress-track: rgba(47, 47, 44, .12);

  --ink: var(--hnt-text);
  --muted: var(--hnt-text-soft);
  --paper: var(--hnt-surface);
  --paper-strong: var(--hnt-surface-strong);
  --dark: var(--hnt-dark);
  --line: var(--hnt-divider);
  --darkred: var(--hnt-brand-red);
  --green: var(--hnt-green);
  --yellow: var(--hnt-yellow);
}

/*
 * Two selectors make the dark palette more specific than late :root blocks in
 * feed.css and comms-dock.css. This prevents those components from restoring
 * their light defaults after the theme files have loaded.
 */
:root[data-theme="dark"],
html[data-theme="dark"][data-theme-preference] {
  color-scheme: dark;

  --hnt-bg: #121210;
  --hnt-bg-deep: #080807;
  --hnt-surface: rgba(31, 31, 29, .88);
  --hnt-surface-strong: rgba(38, 38, 35, .96);
  --hnt-surface-solid: #20201e;
  --hnt-surface-soft: #292926;
  --hnt-surface-input: #2d2d29;
  --hnt-surface-hover: #33332f;
  --hnt-text: #f2e8d8;
  --hnt-text-soft: #aaa398;
  --hnt-text-faint: #7f7a72;
  --hnt-text-on-dark: #f8f1e6;
  --hnt-border: rgba(242, 232, 216, .15);
  --hnt-border-soft: rgba(242, 232, 216, .09);
  --hnt-divider: rgba(242, 232, 216, .13);
  --hnt-shadow: rgba(0, 0, 0, .34);
  --hnt-overlay: rgba(0, 0, 0, .68);
  --hnt-dark: #0d0d0c;
  --hnt-dark-soft: #181816;
  --hnt-brand-red: #c45b50;
  --hnt-brand-red-hover: #d2695e;
  --hnt-brand-red-soft: rgba(196, 91, 80, .16);
  --hnt-brand-red-soft-hover: rgba(196, 91, 80, .24);
  --hnt-green: #8fbd42;
  --hnt-yellow: #d8b34f;

  /* Shared component aliases used by the header and comms dock. */
  --hnt-text-strong: #f2e8d8;
  --hnt-text-muted: #aaa398;
  --hnt-text-subtle: #c7beb1;
  --hnt-text-accent: #d8b34f;
  --hnt-surface-card: #292926;
  --hnt-surface-card-strong: #20201e;
  --hnt-surface-control: rgba(41, 41, 38, .94);
  --hnt-surface-faint: rgba(242, 232, 216, .055);
  --hnt-surface-table: rgba(35, 35, 32, .96);
  --hnt-surface-panel: #242421;
  --hnt-accent: #d8b34f;
  --hnt-accent-strong: #e2bf62;
  --hnt-accent-gold: #d6a84f;
  --hnt-accent-soft: rgba(216, 179, 79, .16);
  --hnt-accent-soft-hover: rgba(216, 179, 79, .24);
  --hnt-success: #8fbd42;
  --hnt-online: #8fbd42;
  --hnt-warning: #d99a45;
  --hnt-danger: #c45b50;
  --hnt-purple: #a58bcf;
  --hnt-border-medium: rgba(242, 232, 216, .17);
  --hnt-border-strong: rgba(242, 232, 216, .28);
  --hnt-progress-fill: #c45b50;
  --hnt-progress-track: rgba(242, 232, 216, .13);

  --ink: var(--hnt-text);
  --muted: var(--hnt-text-soft);
  --paper: var(--hnt-surface);
  --paper-strong: var(--hnt-surface-strong);
  --dark: var(--hnt-dark);
  --line: var(--hnt-divider);
  --darkred: var(--hnt-brand-red);
  --green: var(--hnt-green);
  --yellow: var(--hnt-yellow);
}
