/* ═══════════════════════════════════════════════════════════════════════════
   TalentPact · tema profesional
   Se carga después de app.css y modulos.css y redefine tokens y componentes:
   tipografía Inter, paleta sobria (tinta + verde azulado profundo), radios y
   sombras contenidos, chips neutros, iconos de línea y sin animaciones de
   aparición. Las clases de app.css no cambian: este fichero solo las afina.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Tipografía ── */
body,button,input,select,textarea{font-family:var(--font-sans)}
body{font-size:var(--fs-cuerpo);line-height:1.6;color:var(--slate-900);letter-spacing:-.006em;font-feature-settings:'cv11','ss01','ss03'}
.display,h1,h2,h3,h4{font-family:var(--font-sans);letter-spacing:-.022em}
.display{font-weight:700;letter-spacing:-.035em;line-height:1.08}
.mono,code,kbd,pre{font-family:var(--font-mono)}
.logo-text{font-family:var(--font-sans);font-weight:700;letter-spacing:-.03em}
.logo-text span{color:var(--emerald-600)}
.gradient-text{background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;-webkit-text-fill-color:currentColor!important;color:var(--emerald-600)!important}

/* Sin animaciones de aparición al hacer scroll: el contenido está, sin más. */
.reveal,.reveal.d1,.reveal.d2,.reveal.d3{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}

/* ── Iconos de línea ── */
.ico{width:1em;height:1em;flex-shrink:0;vertical-align:-.14em;display:inline-block}
.access-icon,.auth-feat-icon{display:inline-flex;align-items:center;justify-content:center}
.access-icon .ico,.auth-feat-icon .ico{width:18px;height:18px}
.search-icon{display:inline-flex;align-items:center;color:var(--slate-400)}
.search-icon .ico{width:16px;height:16px}
.ai-chat-fab,.chat-fab{display:inline-flex;align-items:center;justify-content:center}
.ai-chat-fab .ico,.chat-fab .ico{width:22px;height:22px}
.ai-chat-avatar{display:inline-flex;align-items:center;justify-content:center}
.ai-chat-avatar .ico{width:18px;height:18px}
.ex-briefing-icon .ico{width:28px;height:28px;color:var(--emerald-600)}
.apply-summary-icon .ico{width:22px;height:22px}
.ex-upload-icon .ico,.file-icon .ico{width:22px;height:22px}
.support-header span .ico{width:18px;height:18px}
.ranking-header h3{display:flex;align-items:center;gap:8px}

/* Monograma de reto: sustituye a los emojis de cada reto. */
.tp-mono{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;font-size:var(--fs-micro);font-weight:700;letter-spacing:.02em;flex-shrink:0;background:var(--slate-100);color:var(--slate-700)}
.tp-mono-soft{background:var(--violet-100);color:var(--violet-500)}
.tp-mono-sector{background:var(--emerald-50);color:var(--emerald-700)}
.cex-icon,.rpl-item-icon,.rpl-pv-big-icon{font-size:inherit;background:none;width:auto;height:auto}
.rpl-pv-big-icon .tp-mono{width:52px;height:52px;font-size:var(--fs-dest);border-radius:12px}

/* ── Navegación ── */
nav{background:var(--c-nav);border-bottom:1px solid var(--slate-200);box-shadow:none}
nav a.nl{color:var(--slate-600);font-weight:500}
.nav-access-btn{border-radius:8px;background:var(--slate-900)}
.access-dropdown{border-radius:12px;box-shadow:var(--shadow-xl)}
.access-icon{border-radius:8px}

/* ── Botones ── */
.btn{border-radius:8px;font-weight:600;letter-spacing:-.01em;box-shadow:none;transition:background .15s,border-color .15s,color .15s}
.btn-primary{background:var(--emerald-600);border-color:var(--emerald-600);color:var(--c-sobre-tinta)}
.btn-primary:hover{background:var(--emerald-700);border-color:var(--emerald-700);transform:none;box-shadow:none}
.btn-dark{background:var(--slate-900);color:var(--c-sobre-tinta)}
.btn-dark:hover{background:var(--slate-800);transform:none}
.btn-outline{background:var(--c-superficie);border:1px solid var(--slate-300);color:var(--slate-800)}
.btn-outline:hover{background:var(--slate-50);border-color:var(--slate-400);transform:none}
.btn-lg{border-radius:10px}
.btn-unlock{border-radius:8px;font-weight:600}
.btn-launch{border-radius:10px;background:var(--slate-900)}

/* ── Hero ── */
.hero-badge{background:var(--c-superficie);border:1px solid var(--slate-200);border-radius:999px;color:var(--slate-600);font-size:var(--fs-peq);font-weight:500;box-shadow:var(--shadow-sm)}
.hero-badge-dot{background:var(--emerald-500)}
.hero h1{font-weight:700}
.hero-sub{color:var(--slate-600)}
.section-label{background:none;border:0;padding:0;color:var(--emerald-600);font-size:var(--fs-micro);font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.section-title{font-weight:700}

/* ── Tarjetas ── */
.job-card,.feature-card,.common-ex-card,.price-card,.match-card,.offer-cand-card,.dash-stat-card,.tp-company-card,.st-card,.support-panel,.ranking-card,.score-card,.ai-feedback,.tp-integrity{background:var(--c-superficie);border:1px solid var(--slate-200);border-radius:12px;box-shadow:none}
.job-card:hover,.common-ex-card:hover,.match-card:hover,.feature-card:hover{border-color:var(--slate-300);box-shadow:var(--shadow-md);transform:none}
.price-card.featured{border:1.5px solid var(--slate-900);box-shadow:var(--shadow-lg)}
.feature-icon{border-radius:8px;background:var(--slate-100);color:var(--slate-700);font-weight:600}
.dash-stat-card .dsc-val{font-weight:700;letter-spacing:-.03em}

/* ── Chips y etiquetas: neutros, rectangulares ── */
.job-tag,.skill-pill,.level-badge,.ex-config-badge,.tp-cond-chip,.tp-ichip,.ex-meta-pill{border-radius:6px!important;font-weight:500}
.job-tag{background:var(--slate-50)!important;border:1px solid var(--slate-200)!important;color:var(--slate-700)!important}
.job-badge{background:none!important;border:0!important;padding:0!important;color:var(--slate-500)!important;font-size:var(--fs-micro) !important;font-weight:600!important;letter-spacing:.07em;text-transform:uppercase}
.skill-pill.sp-hard{background:var(--slate-50);border-color:var(--slate-200);color:var(--slate-700)}
.skill-pill.sp-soft{background:var(--c-superficie);border-color:var(--slate-200);color:var(--slate-600)}
.tp-risk,.tp-verified,.tp-origen{border-radius:6px}
.lvl-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:1px}
.lvl-basico{background:var(--emerald-500)}.lvl-intermedio{background:var(--amber-500)}.lvl-avanzado{background:var(--red-500)}

/* ── Formularios ── */
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=url],input[type=number],input[type=search],select,textarea{border-radius:8px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--emerald-500)!important;box-shadow:0 0 0 3px rgba(15,138,118,.15)!important}

/* ── Paneles ── */
.dash-tab{border-radius:8px;font-weight:500}
.dash-tab.active{font-weight:600}
.dash-table th{background:var(--slate-50);color:var(--slate-500);font-size:var(--fs-micro);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.dash-table td{border-color:var(--slate-100)}
.status-closed{color:var(--slate-500);font-weight:600;display:flex;align-items:center;gap:4px}
.status-closed::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--slate-400)}
.tp-empty{padding:28px 20px;text-align:center;color:var(--slate-500);font-size:var(--fs-peq);background:var(--slate-50);border:1px dashed var(--slate-200);border-radius:12px}
.ranking-pos.gold,.ranking-pos.silver,.ranking-pos.bronze{font-weight:700}

/* Fichas de empresa en el panel del candidato */
.tp-company-card{padding:16px}
.tp-company-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.tp-company-meta{font-size:var(--fs-micro);color:var(--slate-500)}
.tp-company-card p{font-size:var(--fs-peq);color:var(--slate-600);margin:6px 0}
.tp-company-card a{font-size:var(--fs-micro);color:var(--emerald-600);text-decoration:none;font-weight:500}

/* ── Modales ── */
.job-modal,.pay-box,.cbox,.tp-consent-card{border-radius:16px;box-shadow:var(--shadow-xl)}
.modal-overlay,.tp-consent{backdrop-filter:blur(2px)}

/* ── Chat de soporte ── */
.ai-chat-fab,.chat-fab{background:var(--slate-900)!important;box-shadow:var(--shadow-lg)!important}
.ai-chat-status{font-size:var(--fs-micro);opacity:.8}

/* ── Backoffice ── */
.adm{background:var(--slate-50);flex-direction:column}
.adm.open{display:flex}
.adm-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;background:var(--c-superficie);border-bottom:1px solid var(--slate-200)}
.adm-brand{display:flex;align-items:center;gap:10px}
.adm-logo{font-weight:700;letter-spacing:-.03em;font-size:var(--fs-dest)}.adm-logo b{color:var(--emerald-600);font-weight:700}
.adm-tag{font-size:var(--fs-micro);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-500);border:1px solid var(--slate-200);border-radius:6px;padding:2px 8px}
.adm-top-right{display:flex;align-items:center;gap:8px}
.adm-user{font-size:var(--fs-micro);color:var(--slate-500)}
.adm-layout{display:flex;flex:1;min-height:0}
.adm-side{width:220px;flex-shrink:0;padding:16px 12px;border-right:1px solid var(--slate-200);background:var(--c-superficie);display:flex;flex-direction:column;gap:2px}
.adm-nav{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;background:none;border-radius:8px;color:var(--slate-600);font:500 .85rem var(--font-sans);cursor:pointer;text-align:left}
.adm-nav .ico{width:16px;height:16px}
.adm-nav:hover{background:var(--slate-50);color:var(--slate-900)}
.adm-nav.active{background:var(--emerald-50);color:var(--emerald-700);font-weight:600}
.adm-nav-badge{display:inline-block;margin-left:6px;min-width:1.25rem;padding:0 6px;border-radius:999px;background:var(--emerald-600);color:var(--c-superficie);font-size:var(--fs-micro);font-weight:700;line-height:1.4;text-align:center;vertical-align:middle}
.adm-sol-acc{display:flex;flex-wrap:wrap;gap:6px}
.adm-motivo{display:block;max-width:28ch;white-space:normal;line-height:1.4}
.adm-main{flex:1;overflow:auto;padding:28px 32px}
.adm-pag{display:none}.adm-pag.active{display:block}
.adm-main h2{font-size:var(--fs-t3);font-weight:700;margin-bottom:4px}
.adm-sub{color:var(--slate-500);font-size:var(--fs-peq);margin-bottom:18px}
.adm-estado{font-size:var(--fs-micro);color:var(--slate-500);margin-bottom:12px}
.adm-estado.err{color:var(--red-500)}
.adm-kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:18px}
.adm-kpi{background:var(--c-superficie);border:1px solid var(--slate-200);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.adm-kpi span{font-size:var(--fs-micro);color:var(--slate-500);font-weight:500}
.adm-kpi strong{font-size:var(--fs-t3);font-weight:700;letter-spacing:-.03em;color:var(--slate-900)}
.adm-kpi small{font-size:var(--fs-micro);color:var(--slate-400)}
.adm-card{background:var(--c-superficie);border:1px solid var(--slate-200);border-radius:12px;padding:16px;margin-bottom:16px}
.adm-card h3{font-size:var(--fs-cuerpo);font-weight:600;margin-bottom:10px}
.adm-tabla-wrap{overflow-x:auto}
.adm-tabla{width:100%;border-collapse:collapse;font-size:var(--fs-peq)}
.adm-tabla th{text-align:left;font-size:var(--fs-micro);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500);background:var(--slate-50);padding:8px 10px;border-bottom:1px solid var(--slate-200)}
.adm-tabla td{padding:9px 10px;border-bottom:1px solid var(--slate-100);color:var(--slate-700)}
.adm-reto{display:flex;align-items:center;gap:10px}
.adm-reto .tp-mono{width:28px;height:28px;font-size:var(--fs-micro)}
.adm-buscar{width:100%;max-width:360px;padding:9px 12px;border:1px solid var(--slate-300);margin-bottom:12px;font-size:var(--fs-peq)}
@media (max-width:760px){
  .adm-layout{flex-direction:column}
  .adm-side{width:auto;flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--slate-200)}
  .adm-nav{white-space:nowrap;width:auto}
  .adm-main{padding:20px 16px}
  .adm-top{padding:10px 16px}.adm-user{display:none}
}

/* Buscador de skills al publicar oferta: más compacto que los campos del formulario. */
#pjSkillSearch{font-size:var(--fs-micro);padding:8px 12px}

/* Logo: los colores salen de los tokens para que funcione en claro y en oscuro. */
.logo-a{fill:var(--emerald-600)}
.logo-b{fill:var(--slate-900)}
.logo-c{fill:var(--emerald-400)}
footer .logo-b{fill:var(--slate-600)}
