/**
 * CERC Platform Shell - Tokens unifies
 * Palette sombre validee Lucas 2026-05-05 : "digital + bien contraste"
 * WCAG AAA sur textes principaux (>= 7:1)
 */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=Source+Sans+3:wght@400;500;600&family=JetBrains+Mono:wght@400;700&display=swap');

:root {
  /* === SURFACES === */
  --cerc-bg:         #060a14;
  --cerc-bg-2:       #0e1626;
  --cerc-surface:    #131b2c;
  --cerc-surface-2:  #1c2540;
  --cerc-surface-3:  #2a3454;

  /* === BORDURES === */
  --cerc-border:        rgba(255,255,255,0.08);
  --cerc-border-strong: rgba(255,255,255,0.18);
  --cerc-border-accent: rgba(0,230,118,0.4);

  /* === MARQUE CERC === */
  --cerc-vert:        #00e676;
  --cerc-vert-strong: #00c853;
  --cerc-vert-deep:   #0E4E3E;
  --cerc-bleu:        #3a8dde;
  --cerc-or:          #fbbf24;

  /* === TEXTE - WCAG AAA sur --cerc-bg === */
  --cerc-text-strong:  #ffffff;    /* 19.3:1 AAA */
  --cerc-text:         #f1f5f9;    /* 17.8:1 AAA */
  --cerc-text-muted:   #a8b3c4;    /* 7.5:1 AA+  */
  --cerc-text-faint:   #6b7a90;    /* 4.6:1 AA   */
  --cerc-text-inverse: #060a14;    /* sur fond clair */

  /* === ETATS === */
  --cerc-success: #22c55e;
  --cerc-warn:    #eab308;
  --cerc-danger:  #ef4444;
  --cerc-info:    #3b82f6;

  /* === TYPES DELIBERATIONS (carte) === */
  --cerc-type-marche:     #00c853;
  --cerc-type-garantie:   #7b61ff;
  --cerc-type-subvention: #ff6b2b;
  --cerc-type-exoneration:#f1c40f;
  --cerc-type-autre:      #64748b;

  /* === TYPOGRAPHIE === */
  --cerc-font-display: 'Syne', system-ui, sans-serif;
  --cerc-font-body:    'Source Sans 3', system-ui, sans-serif;
  --cerc-font-mono:    'JetBrains Mono', 'Courier New', monospace;

  /* Echelle */
  --cerc-fs-display: clamp(2rem, 4vw, 3rem);   /* 32-48px */
  --cerc-fs-h1:      clamp(1.75rem, 2.5vw, 2.25rem); /* 28-36px */
  --cerc-fs-h2:      clamp(1.375rem, 1.75vw, 1.75rem); /* 22-28px */
  --cerc-fs-h3:      1.125rem;  /* 18px */
  --cerc-fs-body:    0.9375rem; /* 15px */
  --cerc-fs-small:   0.8125rem; /* 13px */
  --cerc-fs-mini:    0.6875rem; /* 11px */

  /* Line-heights */
  --cerc-lh-tight:  1.15;
  --cerc-lh-normal: 1.5;
  --cerc-lh-loose:  1.65;

  /* === ESPACEMENTS === */
  --cerc-sp-1:  4px;
  --cerc-sp-2:  8px;
  --cerc-sp-3: 12px;
  --cerc-sp-4: 16px;
  --cerc-sp-5: 24px;
  --cerc-sp-6: 32px;
  --cerc-sp-7: 48px;
  --cerc-sp-8: 64px;

  /* === RADIUS === */
  --cerc-r-sm:  4px;
  --cerc-r-md:  8px;
  --cerc-r-lg: 12px;
  --cerc-r-xl: 16px;
  --cerc-r-pill: 999px;

  /* === SHADOWS === */
  --cerc-shadow-sm:  0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.3);
  --cerc-shadow-md:  0 4px 12px rgba(0,0,0,0.5), 0 2px 4px rgba(0,0,0,0.3);
  --cerc-shadow-lg:  0 8px 24px rgba(0,0,0,0.6), 0 4px 8px rgba(0,0,0,0.4);
  --cerc-shadow-vert: 0 0 16px rgba(0,230,118,0.15), 0 0 4px rgba(0,230,118,0.08);

  /* === TRANSITIONS === */
  --cerc-ease: cubic-bezier(0.4, 0.0, 0.2, 1);
  --cerc-dur:  150ms;
}

/* Reset base pour les pages shell */
.cerc-app-wrap,
.cerc-app-wrap * {
  box-sizing: border-box;
}

.cerc-app-wrap {
  font-family: var(--cerc-font-body);
  font-size: var(--cerc-fs-body);
  color: var(--cerc-text);
  background: var(--cerc-bg);
  line-height: var(--cerc-lh-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Utils text */
.cerc-text-strong  { color: var(--cerc-text-strong); }
.cerc-text-muted   { color: var(--cerc-text-muted);  }
.cerc-text-vert    { color: var(--cerc-vert); }
.cerc-text-mono    { font-family: var(--cerc-font-mono); }
.cerc-text-mini    { font-size: var(--cerc-fs-mini); text-transform: uppercase; letter-spacing: 0.08em; }

/* Utils display */
.cerc-display-font { font-family: var(--cerc-font-display); font-weight: 800; line-height: var(--cerc-lh-tight); }

/* Separateur */
.cerc-hr {
  border: none;
  border-top: 1px solid var(--cerc-border);
  margin: var(--cerc-sp-5) 0;
}

/* Boutons */
.cerc-btn {
  display: inline-flex; align-items: center; gap: var(--cerc-sp-2);
  padding: var(--cerc-sp-2) var(--cerc-sp-5);
  border-radius: var(--cerc-r-md);
  font-family: var(--cerc-font-body);
  font-size: var(--cerc-fs-body);
  font-weight: 600;
  cursor: pointer;
  border: none;
  text-decoration: none;
  transition: background var(--cerc-dur) var(--cerc-ease),
              transform 80ms var(--cerc-ease),
              box-shadow var(--cerc-dur) var(--cerc-ease);
  white-space: nowrap;
}

.cerc-btn:active { transform: scale(0.98); }

.cerc-btn-primary {
  background: var(--cerc-vert);
  color: var(--cerc-text-inverse);
}
.cerc-btn-primary:hover {
  background: #33eb91;
  box-shadow: var(--cerc-shadow-vert);
}

.cerc-btn-ghost {
  background: transparent;
  color: var(--cerc-text-muted);
  border: 1px solid var(--cerc-border-strong);
}
.cerc-btn-ghost:hover {
  color: var(--cerc-text);
  border-color: var(--cerc-border-accent);
  background: rgba(0,230,118,0.06);
}

.cerc-btn-sm {
  padding: var(--cerc-sp-1) var(--cerc-sp-3);
  font-size: var(--cerc-fs-small);
}