/* e-HQ Visual Tokens
   Source: 00 - Visual Identity.png / 03 - Visual Language.png
   Scope: UI/CSS layer only for WordPress theme + Distribution plugin.
   Do not modify financial logic, migrations, DB, calculations, allocations, payments or statements.
*/

@font-face {
  font-family: "Open Sans";
  src: url("fonts/Open Sans/open-sans.regular.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Open Sans";
  src: url("fonts/Open Sans/open-sans.semibold.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 600;
}

@font-face {
  font-family: "Open Sans";
  src: url("fonts/Open Sans/open-sans.bold.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: "Fönt";
  src:
    url("fonts/Fönt/Fönt-Regular.ttf") format("truetype"),
    url("fonts/Fönt/Fönt-Regular.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

:root {
  /* Core */
  --ehq-yellow: #FFD200;
  --ehq-yellow-hover: #FFDB35;
  --ehq-yellow-active: #E6BD00;
  --ehq-yellow-muted: rgba(255, 210, 0, 0.13);
  --ehq-yellow-border: rgba(255, 210, 0, 0.45);

  --ehq-black: #0D0F14;
  --ehq-bg-main: #0D0F14;
  --ehq-surface: #171B22;
  --ehq-surface-high: #222831;
  --ehq-surface-raised: #30363D;

  --ehq-text: #F6F7F9;
  --ehq-text-muted: #8A8F98;
  --ehq-text-disabled: #5C6570;
  --ehq-text-on-yellow: #101010;

  --ehq-border: rgba(255, 255, 255, 0.10);
  --ehq-border-soft: rgba(255, 255, 255, 0.06);
  --ehq-border-strong: rgba(255, 210, 0, 0.42);

  /* States */
  --ehq-success: #22C55E;
  --ehq-success-bg: rgba(34, 197, 94, 0.12);
  --ehq-info: #3B82F6;
  --ehq-info-bg: rgba(59, 130, 246, 0.12);
  --ehq-warning: #FBBF24;
  --ehq-warning-bg: rgba(251, 191, 36, 0.12);
  --ehq-error: #EF4444;
  --ehq-error-bg: rgba(239, 68, 68, 0.12);

  /* Typography */
  --ehq-font: "Open Sans", "Fönt", "Aeonik", "Inter", "Helvetica Neue", Arial, sans-serif;
  --ehq-brand-font: "Open Sans", "Fönt", "Aeonik", "Inter", "Helvetica Neue", Arial, sans-serif;
  --ehq-font-mono: "SFMono-Regular", "JetBrains Mono", "Roboto Mono", Consolas, monospace;
  --ehq-h1: 32px;
  --ehq-h2: 24px;
  --ehq-h3: 18px;
  --ehq-body: 16px;
  --ehq-small: 14px;
  --ehq-caption: 12px;

  /* Spacing */
  --ehq-space-1: 4px;
  --ehq-space-2: 8px;
  --ehq-space-3: 12px;
  --ehq-space-4: 16px;
  --ehq-space-5: 24px;
  --ehq-space-6: 32px;
  --ehq-space-7: 40px;
  --ehq-space-8: 48px;

  /* Radius */
  --ehq-radius-sm: 8px;
  --ehq-radius-md: 12px;
  --ehq-radius-lg: 16px;
  --ehq-radius-xl: 22px;
  --ehq-radius-pill: 999px;

  /* Shadows */
  --ehq-shadow-sm: 0 4px 16px rgba(0,0,0,.28);
  --ehq-shadow-md: 0 12px 36px rgba(0,0,0,.34);
  --ehq-shadow-lg: 0 24px 72px rgba(0,0,0,.48);
  --ehq-glow-yellow: 0 0 0 1px rgba(255,210,0,.26), 0 0 28px rgba(255,210,0,.12);

  /* Motion */
  --ehq-transition-fast: 120ms ease;
  --ehq-transition-normal: 180ms ease;
}

.ehq-card {
  background: linear-gradient(180deg, rgba(23,27,34,.96), rgba(13,15,20,.98));
  border: 1px solid var(--ehq-border);
  border-radius: var(--ehq-radius-lg);
  color: var(--ehq-text);
  box-shadow: var(--ehq-shadow-sm);
}

.ehq-button-primary {
  background: var(--ehq-yellow);
  color: var(--ehq-text-on-yellow);
  border: 1px solid var(--ehq-yellow);
  border-radius: var(--ehq-radius-sm);
}

.ehq-button-secondary {
  background: transparent;
  color: var(--ehq-text);
  border: 1px solid var(--ehq-border);
  border-radius: var(--ehq-radius-sm);
}

.ehq-input,
.ehq-select {
  background: var(--ehq-black);
  color: var(--ehq-text);
  border: 1px solid var(--ehq-border);
  border-radius: var(--ehq-radius-sm);
}

.ehq-input:focus,
.ehq-select:focus {
  outline: none;
  border-color: var(--ehq-yellow-border);
  box-shadow: 0 0 0 3px var(--ehq-yellow-muted);
}

.ehq-badge-success { color: var(--ehq-success); background: var(--ehq-success-bg); border: 1px solid rgba(34,197,94,.35); }
.ehq-badge-info { color: var(--ehq-info); background: var(--ehq-info-bg); border: 1px solid rgba(59,130,246,.35); }
.ehq-badge-warning { color: var(--ehq-warning); background: var(--ehq-warning-bg); border: 1px solid rgba(251,191,36,.40); }
.ehq-badge-error { color: var(--ehq-error); background: var(--ehq-error-bg); border: 1px solid rgba(239,68,68,.40); }
.ehq-badge-active { color: var(--ehq-yellow); background: var(--ehq-yellow-muted); border: 1px solid var(--ehq-yellow-border); }