/*
 * ─────────────────────────────────────────────────────────────────────────────
 *  HookNest UI — Dark Theme
 *  Default theme — loaded as :root base values
 *
 *  Text:    #FFFFFF / #C0C0D0 / #909090
 *  Green:   #00E676   Red: #FF4C4C   Purple: #C8BCFF   Amber: #FFB74D
 *  Borders: rgba(255,255,255,0.16)   Page bg: #0E0E18
 * ─────────────────────────────────────────────────────────────────────────────
 */

:root {
  /* ── Structural Tokens (shared) ── */
  --radius-xl:    20px;
  --radius-card:  16px;
  --radius-inner: 11px;
  --radius-btn:   10px;
  --radius-sm:    8px;
  --radius-pill:  999px;

  --font:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'DM Mono', 'SF Mono', 'Consolas', monospace;

  --pad-card:     24px;

  /* ── Page / Card Backgrounds ── */
  --bg:           #0E0E18;
  --bg-card:      #17172A;
  --bg-inner:     #1F1F32;
  --bg-input:     #26263A;
  --bg-hover:     rgba(255,255,255,0.07);

  /* ── Gradient Surfaces ── */
  --bg-card-grad:   linear-gradient(155deg, #1e1e30 0%, #141420 100%);
  --bg-inner-grad:  linear-gradient(150deg, #24243a 0%, #1a1a2c 100%);
  --bg-chain-hdr:   #16162a;
  --bg-stat-base:   linear-gradient(150deg, #22223a 0%, #18182a 100%);
  --bg-stats-bar:   linear-gradient(180deg, #1a1a2c 0%, #16162a 100%);
  --bg-nav:         rgba(9,9,15,0.9);

  /* ── Text ── */
  --text:         #FFFFFF;
  --text-dim:     #C0C0D0;
  --text-muted:   #909090;
  --text-purple:  #C8BCFF;

  /* ── Brand / Purple ── */
  --p1:           #7C5CFC;
  --p2:           #9B7EFF;
  --grad:         linear-gradient(135deg, #7C5CFC 0%, #9B7EFF 100%);

  /* ── Semantic Colors ── */
  --green:        #00E676;
  --green-bg:     rgba(0,230,118,0.1);
  --green-ring:   rgba(0,230,118,0.25);
  --red:          #FF4C4C;
  --red-bg:       rgba(255,76,76,0.1);
  --red-ring:     rgba(255,76,76,0.25);
  --amber:        #FFB74D;

  /* ── Borders ── */
  --border:       rgba(255,255,255,0.16);
  --border-mid:   rgba(255,255,255,0.28);
  --border-focus: rgba(124,92,252,0.65);

  /* ── Shadows ── */
  --shadow-card:  0 8px 40px rgba(0,0,0,0.65), inset 0 1px 0 rgba(255,255,255,0.22), inset 1px 0 0 rgba(255,255,255,0.08);
  --shadow-raise: 0 16px 56px rgba(0,0,0,0.75), inset 0 1px 0 rgba(255,255,255,0.28), inset 1px 0 0 rgba(255,255,255,0.1);
}