/* ═══════════════════════════════════════════
   Theme: Gold (default) — WillemHair Site
   Switch themes by swapping this file.
   ═══════════════════════════════════════════ */

:root {
  /* Core palette */
  --color-orange: #fc9210;
  --color-gold: #ffc959;
  --color-brown: #773d00;
  --color-lemon: #f7e468;
  --color-dark: #1b1207;

  /* Semantic tokens */
  --color-primary: #fea802;
  --color-primary-hover: #edf028;
  --color-text: var(--color-dark);
  --color-heading: var(--color-brown);
  --color-footer: #000000;

  /* Background */
  --bg-body: radial-gradient(circle at top, #fff7c7 0%, var(--color-lemon) 35%, var(--color-gold) 70%, var(--color-orange) 100%);

  /* Moving lines */
  --lines-color-1: rgba(255, 201, 89, 0.22);
  --lines-color-2: rgba(119, 61, 0, 0.1);

  /* Nav buttons */
  --nav-bg: #c5a334;
  --nav-border: #c9750e;
  --nav-color: #ffffff;
  --nav-active-bg: #773d00;
  --nav-active-border: #421600;
  --nav-active-color: #f7e468;

  /* Icon buttons (social) */
  --icon-btn-bg: #fea802;
  --icon-btn-border: #fea802;
  --icon-btn-hover-bg: #edf028;

  /* Badge */
  --badge-bg: var(--color-brown);
  --badge-color: var(--color-lemon);

  /* Shadows */
  --shadow-sm: 0 6px 14px rgba(119, 61, 0, 0.3);
  --shadow-md: 0 6px 16px rgba(119, 61, 0, 0.3);
  --shadow-lg: 0 10px 22px rgba(119, 61, 0, 0.12);

  /* Cards (earn, docs, etc.) */
  --card-bg: rgba(255, 255, 255, 0.75);
  --card-border: rgba(119, 61, 0, 0.2);
  --card-shadow: 0 8px 18px rgba(119, 61, 0, 0.12);

  /* Focus ring */
  --focus-color: #f7931a;

  /* CTA */
  --cta-bg: linear-gradient(180deg, #fea802 0%, #ecf129 100%);
  --cta-color: #421600;
  --cta-border: #fea802;

  /* Contract link */
  --contract-link-color: #000000;
  --contract-link-hover: var(--color-brown);

  /* Icon action */
  --icon-action-border: var(--color-brown);
  --icon-action-bg: var(--color-lemon);
  --icon-action-hover-bg: var(--color-gold);
  --icon-action-color: var(--color-brown);

  /* Tokenomics chart */
  --chart-slice-outline: #fff4c7;
  --chart-label-color: #3a220a;
  --chart-label-percent: #f08400;
  --chart-line-color: #7a4a12;

  /* Whale calc */
  --whale-bg: #ffad2f;
  --whale-input-bg: #fffdf2;
  --whale-input-border: rgba(119, 61, 0, 0.25);
  --whale-input-focus: #c9750e;

  /* Table */
  --table-bg: rgba(255, 255, 255, 0.45);
  --table-header-bg: rgba(255, 255, 255, 0.7);
  --table-border: rgba(119, 61, 0, 0.15);
  --table-active-bg: rgba(255, 255, 255, 0.85);
  --table-check-color: #2f9d45;

  /* Docs */
  --docs-nav-bg: rgba(255, 255, 255, 0.65);
  --docs-article-text: #3a220a;
  --token-spec-bg: rgba(255, 255, 255, 0.8);

  /* Brand kit */
  --kit-bg: #4a3319;
  --kit-sidebar-bg: rgba(255, 255, 255, 0.08);
  --kit-text: #fff5d6;
  --kit-toggle-bg: rgba(255, 255, 255, 0.12);
  --kit-toggle-hover: rgba(255, 255, 255, 0.22);
  --kit-file-bg: #c7b830;
  --kit-download-bg: #cf7713;
  --kit-media-card-bg: rgba(255, 255, 255, 0.12);
}