/* ==========================================================
   CESFAM Enrique Montt · Lenguaje visual unificado 2026
   Capa de tema compartida para portales y herramientas.
   No modifica lógica de negocio; sólo presentación.
   ========================================================== */
:root{
  --cem-navy:#0b1f3a;
  --cem-blue:#176fd1;
  --cem-blue-dark:#0f5fbd;
  --cem-sky:#eaf5ff;
  --cem-green:#48a928;
  --cem-green-soft:#eef8e8;
  --cem-red:#d92d34;
  --cem-red-soft:#fff0f1;
  --cem-violet:#7b43bf;
  --cem-violet-soft:#f4edfb;
  --cem-ink:#10213f;
  --cem-muted:#64748b;
  --cem-line:#dce7f4;
  --cem-surface:#fff;
  --cem-bg:#f5f9fd;
  --cem-shadow:0 12px 32px rgba(24,66,116,.09);
  --cem-radius:20px;
  --cem-radius-sm:13px;
  --cem-sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

body[class*="theme-"]{
  background:var(--cem-bg)!important;
  color:var(--cem-ink)!important;
  font-family:var(--cem-sans)!important;
}
body[class*="theme-"] *{box-sizing:border-box}
body[class*="theme-"] a{transition:color .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}
body[class*="theme-"] button{font-family:var(--cem-sans)}

.portal-ribbon{
  background:linear-gradient(90deg,#0c4d92,#176fd1);
  color:#fff;
  font-size:12px;
  position:relative;
  z-index:90;
}
.portal-ribbon-inner{
  width:min(1200px,calc(100% - 40px));
  min-height:36px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.portal-ribbon a{color:#fff!important;font-weight:850;text-decoration:none!important;opacity:.95}
.portal-ribbon a:hover{opacity:1;text-decoration:underline!important}
.portal-ribbon .portal-ribbon-note{opacity:.86}

/* ---------- ¿Qué es MAIS? ---------- */
body.theme-mais-info header{
  background:rgba(255,255,255,.96)!important;
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--cem-line)!important;
  box-shadow:0 4px 18px rgba(15,43,80,.05)!important;
}
body.theme-mais-info .headerRow{min-height:82px;padding:10px 0!important}
body.theme-mais-info .logo-img{width:70px!important;height:56px!important}
body.theme-mais-info .brand b{font-size:16px;color:var(--cem-ink)}
body.theme-mais-info .brand small{color:var(--cem-muted)!important}
body.theme-mais-info nav a{border-radius:11px!important;font-size:14px}
body.theme-mais-info nav a:hover{background:#edf5ff!important;color:var(--cem-blue)!important}
body.theme-mais-info .pageHero{
  background:linear-gradient(135deg,#eff7ff 0%,#fff 62%,#edf8e8 100%)!important;
  border-bottom:1px solid var(--cem-line)!important;
  padding:52px 0!important;
}
body.theme-mais-info .pageHero h1{color:#0b2348!important;font-size:clamp(38px,5vw,60px)!important;letter-spacing:-1.8px!important;line-height:1!important}
body.theme-mais-info .pageHero p{color:#405777!important;max-width:790px;font-size:17px!important}
body.theme-mais-info .breadcrumbs{color:var(--cem-muted)!important;font-weight:700;font-size:12px}
body.theme-mais-info .section{padding:48px 0!important}
body.theme-mais-info .card{
  border:1px solid var(--cem-line)!important;
  border-radius:var(--cem-radius)!important;
  box-shadow:0 8px 24px rgba(24,66,116,.06)!important;
  overflow:hidden;
}
body.theme-mais-info .card:hover{box-shadow:var(--cem-shadow)!important}
body.theme-mais-info .cardBody{padding:24px!important}
body.theme-mais-info .cardBody h2{color:#102a51!important;letter-spacing:-.4px}
body.theme-mais-info .cardBody p,body.theme-mais-info .cardBody li{color:#536781!important;line-height:1.7}
body.theme-mais-info .pill{background:#eaf4ff!important;color:#1661ac!important;border:0!important;font-weight:900}
body.theme-mais-info .stepNum{background:linear-gradient(135deg,var(--cem-blue),var(--cem-blue-dark))!important;color:#fff!important;box-shadow:0 8px 18px rgba(23,111,209,.22)}
body.theme-mais-info .info{background:#edf6ff!important;border:1px solid #bed9f5!important;color:#15579a!important;border-radius:14px!important}
body.theme-mais-info footer{background:#0a315d!important;color:#fff!important}

/* ---------- Portales profesionales/pacientes/admin ---------- */
body.theme-profesionales,
body.theme-pacientes,
body.theme-admin{background:linear-gradient(180deg,#eef6ff 0,#f7fafe 420px)!important}
body.theme-profesionales .topstrip,
body.theme-pacientes .topstrip,
body.theme-admin .topstrip{background:linear-gradient(90deg,#0c4d92,#176fd1)!important;color:#fff!important;border:0!important}
body.theme-profesionales .topstrip .pill,
body.theme-pacientes .topstrip .pill,
body.theme-admin .topstrip .pill{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important;box-shadow:none!important}
body.theme-profesionales header,
body.theme-pacientes header,
body.theme-admin header{background:rgba(255,255,255,.96)!important;backdrop-filter:blur(14px);border-bottom:1px solid var(--cem-line)!important;box-shadow:0 4px 18px rgba(15,43,80,.05)!important}
body.theme-profesionales .hero,
body.theme-pacientes .hero{background:#fff!important;color:var(--cem-ink)!important;padding:46px 0!important;border-bottom:1px solid var(--cem-line)}
body.theme-profesionales .hero::before,
body.theme-pacientes .hero::before{opacity:.18!important;filter:saturate(.9)!important}
body.theme-profesionales .hero::after,
body.theme-pacientes .hero::after{background:linear-gradient(90deg,rgba(241,248,255,.98),rgba(241,248,255,.86),rgba(255,255,255,.72))!important}
body.theme-profesionales .hero h1,
body.theme-pacientes .hero h1{color:#0b2348!important;font-size:38px!important;letter-spacing:-1.2px}
body.theme-profesionales .hero p,
body.theme-pacientes .hero p{color:#526782!important}
body.theme-profesionales .heroCard,
body.theme-pacientes .heroCard{background:rgba(255,255,255,.86)!important;border:1px solid var(--cem-line)!important;color:var(--cem-ink)!important;box-shadow:var(--cem-shadow)!important}
body.theme-profesionales .heroCard .hmuted,
body.theme-pacientes .heroCard .hmuted{color:var(--cem-muted)!important}
body.theme-profesionales .linkCard,
body.theme-profesionales .statCard,
body.theme-profesionales .chartCard,
body.theme-profesionales .toolCard,
body.theme-profesionales .adminPanel,
body.theme-pacientes .linkCard,
body.theme-pacientes .card,
body.theme-admin .login-wrap,
body.theme-admin .panel,
body.theme-admin .card{
  border:1px solid var(--cem-line)!important;
  border-radius:var(--cem-radius)!important;
  box-shadow:0 8px 24px rgba(24,66,116,.06)!important;
}
body.theme-profesionales .fichaDestacada{background:linear-gradient(135deg,#176fd1,#0a4e98)!important;border-radius:var(--cem-radius)!important;box-shadow:0 14px 34px rgba(23,111,209,.22)!important}
body.theme-profesionales .statCard .sc-num{color:var(--cem-blue)!important}
body.theme-profesionales .toolCard:hover{border-color:#bdd7f3!important;box-shadow:var(--cem-shadow)!important}
body.theme-profesionales .toolImg{background:#edf4fb!important}
body.theme-profesionales .btn.primary,
body.theme-pacientes .btn.primary,
body.theme-admin .btn.primary{background:linear-gradient(135deg,var(--cem-blue),var(--cem-blue-dark))!important;border:0!important;border-radius:13px!important}
body.theme-profesionales input,
body.theme-pacientes input,
body.theme-admin input,
body.theme-admin select,
body.theme-admin textarea{border-radius:13px!important;border-color:var(--cem-line)!important;background:#fff!important}
body.theme-profesionales input:focus,
body.theme-pacientes input:focus,
body.theme-admin input:focus{border-color:#8ebcea!important;box-shadow:0 0 0 4px rgba(23,111,209,.10)!important}
body.theme-profesionales footer,
body.theme-pacientes footer,
body.theme-admin footer{background:#0a315d!important;color:#fff!important}

/* ---------- Verificador y generador de tarjetas ---------- */
body.theme-verificador,
body.theme-tarjetas{background:linear-gradient(180deg,#eef6ff 0,#f7fafe 420px)!important;padding:28px 0 50px}
body.theme-verificador .wrap,
body.theme-tarjetas .wrap{max-width:1040px!important;margin:0 auto!important;padding:0 18px 40px!important}
body.theme-verificador .card,
body.theme-tarjetas .card{border:1px solid var(--cem-line)!important;border-radius:24px!important;box-shadow:var(--cem-shadow)!important;background:#fff!important}
body.theme-verificador .top,
body.theme-tarjetas .top{background:linear-gradient(135deg,#0d579f,#176fd1)!important;padding:24px 26px!important}
body.theme-verificador .section,
body.theme-tarjetas .section{padding:18px 24px!important}
body.theme-verificador .hint,
body.theme-tarjetas .hint{background:#f2f8ff!important;border-color:#cce1f7!important;color:#3e5877!important}
body.theme-verificador .btn,
body.theme-tarjetas .btn{border-radius:12px!important;padding:11px 16px!important}
body.theme-verificador .btn:not(.secondary):not(.light),
body.theme-tarjetas .btn:not(.secondary):not(.light){background:linear-gradient(135deg,var(--cem-blue),var(--cem-blue-dark))!important}
body.theme-verificador .btn.secondary,
body.theme-tarjetas .btn.secondary{background:#f1f6fc!important;color:var(--cem-ink)!important;border:1px solid var(--cem-line)!important}
body.theme-verificador input,
body.theme-tarjetas input,
body.theme-tarjetas select{border-radius:12px!important;border-color:var(--cem-line)!important;min-height:44px}
body.theme-verificador .row,
body.theme-verificador .fam-item{border-color:var(--cem-line)!important}
body.theme-verificador .k{background:#eef6ff!important;color:#164f8e!important;border-color:var(--cem-line)!important}
body.theme-verificador .footer,
body.theme-tarjetas .footer{background:#f8fbff!important;color:var(--cem-muted)!important;border-color:var(--cem-line)!important}

/* ---------- Encuesta ---------- */
body.theme-encuesta{background:linear-gradient(180deg,#eaf5ff 0,#f7fafe 460px)!important}
body.theme-encuesta .topbar{background:linear-gradient(90deg,#0c4d92,#176fd1)!important}
body.theme-encuesta .hero-card,
body.theme-encuesta .card{border-color:var(--cem-line)!important;border-radius:24px!important;box-shadow:var(--cem-shadow)!important}
body.theme-encuesta .hero-card{background:linear-gradient(135deg,#0d579f,#176fd1)!important}
body.theme-encuesta .tab-btn{border-radius:14px!important;border-color:var(--cem-line)!important}
body.theme-encuesta .tab-btn.active,
body.theme-encuesta .btn-primary{background:linear-gradient(135deg,var(--cem-blue),#2f86e8)!important}
body.theme-encuesta .type-option label,
body.theme-encuesta .score-option label{border-color:var(--cem-line)!important;border-radius:15px!important}
body.theme-encuesta input[type=text],
body.theme-encuesta input[type=tel],
body.theme-encuesta input[type=email],
body.theme-encuesta select,
body.theme-encuesta textarea{border-color:var(--cem-line)!important;border-radius:13px!important}

/* ---------- REM interactivo ---------- */
body.theme-rem{background:var(--cem-bg)!important}
body.theme-rem header{background:linear-gradient(135deg,#0a315d,#176fd1)!important;padding:34px 22px!important}
body.theme-rem header h1{letter-spacing:-1px}
body.theme-rem .app{gap:20px!important;padding:24px 18px 40px!important}
body.theme-rem .side,
body.theme-rem .main,
body.theme-rem .card{border-color:var(--cem-line)!important;border-radius:18px!important;box-shadow:0 8px 24px rgba(24,66,116,.05)}
body.theme-rem .side{top:18px!important}
body.theme-rem input{border-radius:12px!important;border-color:var(--cem-line)!important}
body.theme-rem .nav:hover,
body.theme-rem .nav.active{background:#eaf4ff!important;color:#15579a!important}
body.theme-rem .chip.active{background:#eaf4ff!important;color:#15579a!important;border-color:#bcd8f4!important}
body.theme-rem .primary{background:linear-gradient(135deg,var(--cem-blue),var(--cem-blue-dark))!important;border-radius:12px!important}
body.theme-rem .secondary,.theme-rem .chip{border-radius:12px!important}

/* ---------- Administración ---------- */
body.theme-admin .page{padding-top:34px!important}
body.theme-admin .login-wrap{max-width:460px!important;padding:30px!important}
body.theme-admin .section-title h2{color:#0b2348!important;font-size:24px!important;letter-spacing:-.5px}
body.theme-admin .badge-admin{background:#fff5dd!important;border-color:#f2cf75!important;color:#7f5900!important}
body.theme-admin .btn.ghost{border-color:var(--cem-line)!important;border-radius:12px!important}

/* ---------- FONASA ---------- */
body.theme-fonasa{background:linear-gradient(180deg,#eef6ff 0,#f7fafe 420px)!important;color:var(--cem-ink)!important}
body.theme-fonasa header{background:rgba(255,255,255,.97)!important;color:var(--cem-ink)!important;border-bottom:1px solid var(--cem-line)!important;box-shadow:0 4px 18px rgba(15,43,80,.05)!important;height:74px!important;padding:0 28px!important}
body.theme-fonasa header .logo{color:#0b2348!important;font-size:1rem!important}
body.theme-fonasa header .logo span{color:var(--cem-blue)!important;opacity:1!important;font-weight:700!important}
body.theme-fonasa header .h-sep{background:var(--cem-line)!important}
body.theme-fonasa header .subtit{color:var(--cem-muted)!important}
body.theme-fonasa header .nav-btn{color:var(--cem-blue)!important;border-color:#c8dcf2!important;background:#edf5ff!important;border-radius:10px!important;padding:8px 12px!important;font-weight:700}
body.theme-fonasa header .h-user{color:var(--cem-muted)!important}
body.theme-fonasa header .h-user strong{color:var(--cem-ink)!important}
body.theme-fonasa header .btn-logout{color:#a72a31!important;background:#fff0f1!important;border-color:#f0c4c7!important;border-radius:10px!important;padding:8px 11px!important}
body.theme-fonasa main{max-width:1060px!important;margin:34px auto!important}
body.theme-fonasa .card{border:1px solid var(--cem-line)!important;border-radius:20px!important;box-shadow:0 8px 24px rgba(24,66,116,.06)!important;padding:26px 28px!important}
body.theme-fonasa .card-tit{color:var(--cem-blue)!important;font-size:.72rem!important}
body.theme-fonasa input[type=text],
body.theme-fonasa input[type=password],
body.theme-fonasa select,
body.theme-fonasa textarea{border-color:var(--cem-line)!important;border-radius:12px!important;background:#fff!important}
body.theme-fonasa .btn-primary,
body.theme-fonasa .btn-start{background:linear-gradient(135deg,var(--cem-blue),var(--cem-blue-dark))!important;border-radius:12px!important}
body.theme-fonasa footer{color:var(--cem-muted)!important;opacity:1!important}

/* FONASA login aislado */
body.theme-fonasa-login{background:linear-gradient(145deg,#e9f4ff,#f7fbff 55%,#edf8e8)!important;font-family:var(--cem-sans)!important}
body.theme-fonasa-login .login-box{border-radius:24px!important;border:1px solid var(--cem-line)!important;box-shadow:0 22px 55px rgba(24,66,116,.16)!important;overflow:hidden}
body.theme-fonasa-login .login-header{background:linear-gradient(135deg,#0a315d,#176fd1)!important;padding:28px!important}
body.theme-fonasa-login .login-body{padding:28px!important}
body.theme-fonasa-login .tabs{border-color:var(--cem-line)!important;border-radius:12px!important}
body.theme-fonasa-login .tab.active{background:var(--cem-blue)!important}
body.theme-fonasa-login .fg input,
body.theme-fonasa-login textarea{border-color:var(--cem-line)!important;border-radius:12px!important}
body.theme-fonasa-login .btn-login{background:linear-gradient(135deg,var(--cem-blue),var(--cem-blue-dark))!important;border-radius:12px!important}

/* ---------- Curso / páginas HTML auxiliares ---------- */
body.theme-course{background:linear-gradient(180deg,#eef6ff,#f7fafe)!important;color:var(--cem-ink)!important;font-family:var(--cem-sans)!important}
body.theme-course .card,body.theme-course .panel,body.theme-course main>section{border-radius:18px!important;border-color:var(--cem-line)!important;box-shadow:0 8px 24px rgba(24,66,116,.06)!important}

@media(max-width:720px){
  .portal-ribbon-inner{width:calc(100% - 28px);justify-content:center;text-align:center}
  .portal-ribbon-note{display:none}
  body.theme-mais-info .pageHero{padding:38px 0!important}
  body.theme-mais-info .pageHero h1{font-size:38px!important}
  body.theme-profesionales .hero h1,body.theme-pacientes .hero h1{font-size:32px!important}
  body.theme-verificador,body.theme-tarjetas{padding-top:14px}
  body.theme-fonasa header{height:auto!important;min-height:72px!important;padding:12px 16px!important;flex-wrap:wrap!important}
}
@media(max-width:480px){
  body.theme-profesionales>.portal-ribbon{display:none!important}
}