/* ═══════════════════════════════════════════════════════════════════
   TS-SUITE.CSS · CSS globale HypeTalent.AI
   Caricato come ULTIMO CSS nelle pagine light → vince per cascata.
   Pagine dark (RecruiterMeeting, BusinessMeeting): ts-suite.css è PRIMO
   e il loro CSS dark lo sovrascrive → tema scuro preservato.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Font ── */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* ════════════════════════════════════════════════════════
   VARIABILI · Bianco professionale con grigi leggeri
   ════════════════════════════════════════════════════════ */
:root {
  --bg:    #f5f5f7;
  --c1:    #ffffff;
  --c2:    #fafafa;
  --c3:    #f0f0f0;
  --c4:    #e0e0e0;
  --paper: #ffffff;

  --t1:    #111111;
  --t2:    #3a3a3a;
  --t3:    #717171;
  --t4:    #a8a8a8;

  --acc:    #1d3461;
  --acc-d:  #142548;
  --acc-b:  rgba(29,52,97,.07);
  --acc-l:  rgba(29,52,97,.16);
  --accent: #1d3461;
  --accent2:#4a5568;
  --hov:    rgba(0,0,0,.04);

  --ok:    #166534;
  --warn:  #854d0e;
  --err:   #991b1b;

  --bdr:   rgba(0,0,0,.08);
  --bdr2:  rgba(0,0,0,.13);

  --radius:    7px;
  --radius-sm: 5px;
  --radius-lg: 12px;

  --shadow:    0 1px 2px rgba(0,0,0,.05);
  --shadow-md: 0 2px 8px rgba(0,0,0,.08);

  --score-ric: #a7f3d0;
  --score-gen: #bfdbfe;

  color-scheme: light;
}

/* ════════════════════════════════════════════════════════
   BASE
   ════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  font-family: 'Manrope', -apple-system, 'Helvetica Neue', Arial, sans-serif;
  background: var(--bg) !important;
  color: var(--t1);
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}

::-webkit-scrollbar              { width: 7px; height: 7px; }
::-webkit-scrollbar-track        { background: transparent; }
::-webkit-scrollbar-thumb        { background: var(--c4); border-radius: 4px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover  { background: var(--t4); }

a { color: var(--acc); text-decoration: none; }
a:hover { text-decoration: underline; }
::selection { background: var(--acc-b); color: var(--t1); }

/* ════════════════════════════════════════════════════════
   FORZA DOSSIER · Regole aggressive cross-suite
   Usano body come prefisso → specificità > classi singole
   Escludono gli header scuri intenzionali (data-color, flag)
   ════════════════════════════════════════════════════════ */

/* ── Sfondo pagina e contenitori principali ── */
body,
body .main,
body .page-wrap,
body .content,
body .wrap {
  background: var(--bg) !important;
}

/* ── Card e sezioni · bianco puro ── */
body .card,
body .ccard,
body .st-card,
body .sel-card,
body .chart-card,
body .col-section,
body .is-section,
body .alg-card,
body .is-algo-card,
body .lc-group,
body .tk-section,
body .pmk-card,
body .pmk-ds-section,
body [class$="-card"]:not([class*="hdr"]):not([class*="btn"]):not([class*="chip"]) {
  background: var(--c1) !important;
  border-color: var(--bdr) !important;
  color: var(--t1) !important;
}

/* ── Section body interni · grigio leggerissimo ── */
body .col-links,
body .is-section-body,
body .lc-group-body,
body .tk-section-body,
body .pmk-ds-section-body {
  background: var(--c1) !important;
}

/* ── Header di SEZIONE (interni alla pagina) · stile dossier scuro ── */
body .col-header,
body .is-section-hdr,
body .lc-group-hdr,
body .tk-section-hdr,
body .sec-hdr,
body .section-hdr,
body .pmk-ds-section-hdr,
body .rm-mx-hdr {
  background: #24272c !important;
  color: rgba(255,255,255,.88) !important;
  border-color: rgba(255,255,255,.06) !important;
}

/* ── Testo dentro header di sezione scuri ── */
body .col-header *,
body .is-section-hdr *,
body .lc-group-hdr *,
body .sec-hdr *,
body .section-hdr *,
body .pmk-ds-section-hdr *,
body .rm-mx-hdr * {
  color: rgba(255,255,255,.88) !important;
}

/* ── Header di PAGINA (top bar con logo) · bianco semitrasparente ── */
body .ts-hdr,
body .tool-hdr,
body .is-header,
body .gp-header,
body .alg-header,
body .mdb-topbar,
body .ps-hdr,
body .topbar {
  background: rgba(255,255,255,.92) !important;
  border-bottom: 1px solid var(--bdr) !important;
  backdrop-filter: blur(10px);
  color: var(--t1) !important;
}

/* ── Testo generale · override hardcoded ── */
body { color: var(--t1) !important; }

/* ── Input e form · uniforme ── */
body input:not([type=color]):not([type=range]):not([type=checkbox]):not([type=radio]),
body select,
body textarea {
  background: var(--c1) !important;
  border-color: var(--bdr2) !important;
  color: var(--t1) !important;
  font-family: 'Manrope', inherit !important;
}

/* ── Bottone primario · navy suite ── */
body .btn-primary,
body [class*="-btn-primary"]:not([class*="ghost"]):not([class*="outline"]) {
  background: var(--acc) !important;
  color: #fff !important;
  border-color: var(--acc) !important;
}

/* ── Sfondo bianco legacy hardcoded ── */
body [style*="background:#fff"],
body [style*="background: #fff"],
body [style*="background-color:#fff"],
body [style*="background-color: #fff"] {
  background: var(--c1) !important;
}

/* ── Hardcoded sfondo #eef0f3 legacy (vecchia palette) ── */
body [style*="background:#eef0f3"],
body [style*="background: #eef0f3"] {
  background: var(--bg) !important;
}

/* ── Hub: comando links ── */
body .cmd-link {
  color: var(--t1) !important;
}
body .cmd-link:hover {
  background: var(--c2) !important;
}

/* ── Separatori e bordi ── */
body .col-divider {
  background: var(--bdr) !important;
}

/* ════════════════════════════════════════════════════════
   ECCEZIONI — NON sovrascrivere mai questi
   ════════════════════════════════════════════════════════ */

/* Flag note colorate (giallo/rosso/verde/blu) → semantiche */
body .cpfs-flag-hdr,
body .cpfs-flag-hdr[data-color] { background: revert !important; color: #fff !important; }

/* Badge e chip colorati */
body [class*="-badge"],
body [class*="-chip"][class*="is-"],
body [class*="-tag"] { background: revert !important; color: revert !important; }

/* Bottoni di status (escluso/VIP/etc.) */
body [class*="excluded"],
body [class*="vip"][class*="btn"] { background: revert !important; }

/* Icone SVG */
/* SVG: non sovrascrivere fill/stroke — gli attributi SVG inline li gestiscono.
   Rimuovere questa regola evita che fill:revert → fill:black (default UA browser)
   che trasforma tutte le icone stroke-based in quadrati neri. */

/* ── Libreria icone cross-suite ────────────────────────────────────────────
   Uso: <svg class="ts-ico"><use href="#ts-ico-edit"/></svg>
   Le dimensioni si ereditano dal contesto; usa ts-ico-sm / ts-ico-lg per overrides. */
.ts-ico            { width: 16px; height: 16px; display: inline-block; vertical-align: middle; flex-shrink: 0; }
.ts-ico-sm         { width: 12px; height: 12px; }
.ts-ico-lg         { width: 20px; height: 20px; }
.ts-ico-xl         { width: 24px; height: 24px; }