/* ═══════════════════════════════════════════════
   TALPOT DESIGN SYSTEM — skin unificador global
   S'aplica per sobre dels estils de cada pàgina.
   ═══════════════════════════════════════════════ */

:root {
  --tp-groc: #FFD60A;
  --tp-taronja: #FF6B00;
  --tp-blau: #00B4D8;
  --tp-verd: #30D158;
  --tp-vermell: #FF453A;
  --tp-lila: #BF5AF2;
  --tp-fons: #020B18;
  --tp-card: rgba(255,255,255,0.05);
  --tp-border: rgba(255,255,255,0.11);
  --tp-radius: 16px;
}

/* ── TIPOGRAFIA AMB FORÇA ── */
/* Titulars principals: grans, negres, impactants */
.h-title, .games-title, .hero-name, .mag-titol, .oh-titol {
  font-weight: 900 !important;
  letter-spacing: -0.8px !important;
  line-height: 1.12 !important;
}
.h-title, .games-title { font-size: 1.75rem !important; }

/* Títols de secció: fora les minúscules grises tímides */
.section-title, .fam-title {
  font-size: 1.1rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.3px !important;
  text-transform: none !important;
  color: #fff !important;
}

/* Subtítols i descripcions: llegibles, no apagats */
.h-sub, .games-sub, .hero-tag, .gc-mesura, .oc-meta, .cand-kws {
  color: rgba(255,255,255,0.62) !important;
  font-weight: 500 !important;
}

/* Noms i elements destacats */
.gc-name, .cand-nom, .oc-titol, .card-name, .jm-name, .pc-nom {
  font-weight: 800 !important;
}

/* ── BOTONS PRIMARIS: un sol estil pertot ── */
.search-btn, .btn-save, .mag-btn, .prio-check, .gc-play, .tp-btn-primary {
  background: var(--tp-groc) !important;
  color: #020B18 !important;
  font-weight: 900 !important;
  border: none !important;
  border-radius: 100px !important;
  box-shadow: 0 4px 18px rgba(255,214,10,0.3) !important;
  transition: transform 0.15s !important;
}
.search-btn:active, .btn-save:active, .mag-btn:active, .prio-check:active { transform: scale(0.96) !important; }

/* El botó taronja (accions de repte/CTA fortes) es manté taronja */
.mag-btn { background: var(--tp-taronja) !important; color: #fff !important; box-shadow: 0 4px 18px rgba(255,107,0,0.35) !important; }

/* ── TARGETES: mateixa pell pertot ── */
.game-card, .oferta-card, .cand-card, .perfil-card, .joc-mini, .video-card, .pregunta-block, .demanar-card, .analisi-card, .exec-card, .rob-card, .creator-card-info {
  border-radius: var(--tp-radius) !important;
  border: 1px solid var(--tp-border) !important;
}

/* ── NAVEGACIÓ: idèntica a totes les pàgines ── */
.nav {
  height: 56px !important;
  background: rgba(2,11,24,0.75) !important;
  backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.nav-logo { font-weight: 900 !important; letter-spacing: 0.1em !important; }
.nav-logo span { color: var(--tp-groc) !important; }
.nav-back { font-weight: 800 !important; }

.nav-bottom {
  background: rgba(2,11,24,0.94) !important;
  backdrop-filter: blur(18px) !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
}
.nav-item { font-weight: 800 !important; letter-spacing: 0.05em !important; }
.nav-item.active .nav-icon { color: var(--tp-groc) !important; }

/* ── INPUTS ── */
input, textarea, select {
  font-family: 'Space Grotesk', sans-serif !important;
}
.search-input, input[type="text"], input[type="email"] {
  border-radius: 100px !important;
  border: 1.5px solid rgba(255,255,255,0.16) !important;
}
.search-input:focus, input:focus { border-color: var(--tp-groc) !important; outline: none !important; }

/* ── DETALLS GLOBALS ── */
* { -webkit-tap-highlight-color: transparent; }
::-webkit-scrollbar { display: none; }

/* Percentatges i números clau: sempre amb pes */
.cand-match-val, .rob-score, .oc-count, .gh-count, .rk-val { font-weight: 900 !important; }

/* Badges d'estat unificats */
.seeker-badge {
  background: rgba(0,180,216,0.15) !important;
  color: var(--tp-blau) !important;
  border: 1px solid rgba(0,180,216,0.35) !important;
  font-weight: 800 !important;
}

/* Empty states amb personalitat */
.empty-mini, .empty { border-radius: var(--tp-radius) !important; }
.empty-text { line-height: 1.65 !important; }

/* ═══════════════════════════════════════════════
   LLEGIBILITAT — mides i contrast mínims globals
   ═══════════════════════════════════════════════ */

/* Cap text per sota de 0.78rem — les micro-lletres pugen */
.gc-mesura, .oc-meta, .cand-kws, .cand-forts, .jm-virtuts, .jm-stats,
.gc-stats, .gh-progress, .vid-label, .card-tag, .pc-count, .oh-meta,
.mag-sub, .hero-tag, .h-sub, .games-sub, .rob-status, .rob-cv,
.demanar-sub, .analisi-update, .cf-count, .rk-row, .emo-context {
  font-size: 0.8rem !important;
}

/* Etiquetes molt petites (comptadors, labels de %) — mínim absolut */
.cand-match-lbl, .rk-pos, .oc-count, .gh-count {
  font-size: 0.72rem !important;
}

/* Contrast mínim: cap gris per sota del 70% */
.gc-mesura, .oc-meta, .cand-kws, .h-sub, .games-sub, .hero-tag,
.mag-sub, .oh-meta, .demanar-sub, .jm-virtuts, .rob-status,
.emo-context, .analisi-update, .pb-transcripcio, .an-text {
  color: rgba(255,255,255,0.78) !important;
}

/* Labels secundaris (poden ser una mica més suaus, però mai invisibles) */
.cand-match-lbl, .rk-pos, .gc-stats, .cards-hint {
  color: rgba(255,255,255,0.55) !important;
}

/* Colors d'energia: sempre sobre pes de font alt (mai fins i prims) */
[style*="color:#FFD60A"], [style*="color: #FFD60A"],
[style*="color:#00B4D8"], [style*="color: #00B4D8"],
[style*="color:#30D158"], [style*="color: #30D158"] {
  font-weight: 700;
}

/* ═══════════════════════════════════════════════
   FONS — blau marí profund (prova A/B)
   Per tornar al negre-nit original: comenta aquest bloc.
   ═══════════════════════════════════════════════ */
body {
  background: linear-gradient(180deg, #061426 0%, #0A2540 40%, #10406E 75%, #1264B8 100%) !important;
}
.game-view, .nav, .nav-bottom {
  background-color: rgba(6,20,38,0.85) !important;
}

/* ═══════════════════════════════════════════════
   ATAC ALS ESTILS INLINE — força mides i contrast
   (guanya els style="" escampats per l'HTML)
   ═══════════════════════════════════════════════ */

/* Micro-mides inline → pugen a llegible */
[style*="font-size:0.5"], [style*="font-size: 0.5"],
[style*="font-size:0.6"], [style*="font-size: 0.6"] {
  font-size: 0.78rem !important;
}
[style*="font-size:0.7"], [style*="font-size: 0.7"] {
  font-size: 0.82rem !important;
}

/* Grisos fantasma inline → contrast digne */
[style*="rgba(255,255,255,0.3"], [style*="rgba(255, 255, 255, 0.3"],
[style*="rgba(255,255,255,0.4"], [style*="rgba(255, 255, 255, 0.4"] {
  color: rgba(255,255,255,0.72) !important;
}
[style*="rgba(255,255,255,0.5"], [style*="rgba(255, 255, 255, 0.5"] {
  color: rgba(255,255,255,0.78) !important;
}

/* ═══════════════════════════════════════════════
   SALT TIPOGRÀFIC GLOBAL — base més gran a tota l'app
   Tot el que està en rem creix un ~12% de cop.
   ═══════════════════════════════════════════════ */
html { font-size: 18px !important; }

/* Text de contingut principal: cos generós */
.dr-situacio, .pb-pregunta, .pb-transcripcio, .emo-situacio,
.an-text, .exec-intro, .demanar-opt, .prio-item, .dr-opcio, .emo-opt {
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
}

/* Magic Room — targetes de categories llegibles */
.vc-name { font-size: 1rem !important; font-weight: 800 !important; }
.vc-tip { font-size: 0.82rem !important; color: rgba(255,255,255,0.72) !important; font-style: normal !important; line-height: 1.5 !important; }
.vc-time, .vc-multi, .vc-count { font-size: 0.78rem !important; }
.vc-time { color: rgba(255,255,255,0.6) !important; }
