/* =====================================================================
   Clínica Santa Fe · Plataforma de Certificados
   Identidad: azul marino + azul clínico, fondo claro, estilo salud.
   Tipografía: Sora (títulos) + IBM Plex Sans (texto) + IBM Plex Mono.
   ===================================================================== */
:root{
  /* Marca */
  --navy-900:#0f1944; --navy-800:#16245e; --navy-700:#1d2d72; --navy-600:#243a8a;
  --azul-700:#155bb0; --azul-600:#1f7fd1; --azul-500:#2e93e0; --azul-400:#52aef0;
  --cian:#8fd0f5;

  /* Superficies (tema claro, sector salud) */
  --bg:#eaf1f8; --panel:#ffffff; --panel-2:#f3f7fc; --panel-3:#e9f1fa;
  --linea:#e0e8f2; --linea-fuerte:#cdd9ea;

  /* Texto */
  --txt:#15223f; --txt-mute:#566480; --txt-dim:#8896ad;

  /* Acentos (reutilizados por estilos en línea heredados) */
  --acento:var(--azul-600); --acento-2:var(--azul-700); --acento-soft:rgba(31,127,209,.12);

  /* Estados */
  --ok:#0f9d6b; --ok-bg:#e3f6ee;
  --err:#d63d54; --err-bg:#fbe7ea;
  --info:#1f7fd1; --info-bg:#e6f1fb;
  --warn:#c77d12; --warn-bg:#fbf0dc;

  --radio:16px; --radio-sm:10px;
  --sombra:0 1px 2px rgba(22,36,94,.06), 0 12px 32px rgba(22,36,94,.10);
  --sombra-sm:0 1px 2px rgba(22,36,94,.06), 0 4px 14px rgba(22,36,94,.07);
  --fuente:'IBM Plex Sans',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  --fuente-titulo:'Sora','IBM Plex Sans',system-ui,sans-serif;
  --fuente-mono:'IBM Plex Mono','Courier New',monospace;
}
/* Fuentes del generador de certificados (para que el editor sea fiel a la imagen final) */
@font-face{font-family:'CertSerif';src:url('../fonts/LiberationSerif-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'CertSerif';src:url('../fonts/LiberationSerif-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'CertSans';src:url('../fonts/DejaVuSans.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'CertSans';src:url('../fonts/DejaVuSans-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}

*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
/* overflow-x:clip evita el scroll horizontal SIN crear contenedor de scroll (hidden rompía el sticky del sidebar);
   sin height:100% el body crece con el contenido y el scroll vuelve al viewport. */
html,body{max-width:100%;overflow-x:hidden;overflow-x:clip}
body{font-family:var(--fuente);background:var(--bg);color:var(--txt);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}

/* ---------- Scrollbars modernos (todo el sistema) ---------- */
*{scrollbar-width:thin;scrollbar-color:#c2cfe0 transparent}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#c2cfe0;border-radius:10px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#9fb2cf;background-clip:content-box}
::-webkit-scrollbar-corner{background:transparent}
/* Menú lateral (fondo navy): pulgar translúcido claro */
.sidebar{scrollbar-color:rgba(255,255,255,.25) transparent}
.sidebar ::-webkit-scrollbar-thumb,.sidebar nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);background-clip:content-box;border:3px solid transparent}
.sidebar ::-webkit-scrollbar-thumb:hover,.sidebar nav::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.38);background-clip:content-box}
button{font-family:inherit}
h1,h2,h3,h4{font-family:var(--fuente-titulo);letter-spacing:-.01em}

/* ---------- Layout ---------- */
.layout{display:flex;min-height:100vh}
.sidebar{width:244px;flex-shrink:0;color:#dfe7f5;background:var(--navy-800);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;transition:width .18s ease}
.brand{display:flex;gap:13px;align-items:center;padding:18px 18px;border-bottom:1px solid rgba(255,255,255,.09)}
.brand .logo-img{flex-shrink:0}
.brand a{display:block}
.brand .marca-mini{display:none}
.sidebar nav{flex:1;padding:12px 10px;display:flex;flex-direction:column;gap:2px;overflow-y:auto;overflow-x:hidden}
.sidebar nav a{position:relative;display:flex;align-items:center;gap:11px;padding:9px 12px;border-radius:9px;white-space:nowrap;
  color:#b7c6e2;font-size:14px;font-weight:500;transition:.14s ease;position:relative}
.ico-svg{width:20px;height:20px;flex-shrink:0}
.sidebar nav a .ico-svg{opacity:.85;transition:.14s}
.sidebar nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.sidebar nav a:hover .ico-svg{opacity:1}
.sidebar nav a.activo{background:#fff;color:var(--navy-800);font-weight:700}
.sidebar nav a.activo .ico-svg{opacity:1;color:var(--azul-600)}
/* Acento del ítem activo: barrita azul a la izquierda de la pastilla */
.sidebar nav a.activo::before{content:"";position:absolute;left:4px;top:50%;transform:translateY(-50%);
  width:3px;height:18px;border-radius:3px;background:var(--azul-600)}
.sidebar .nav-grupo{padding:15px 12px 5px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;color:#7e93bb}
.nav-colapsar{display:flex;align-items:center;gap:11px;margin:4px 10px;padding:9px 12px;border-radius:9px;
  background:none;border:none;cursor:pointer;color:#8ea2c8;font-size:13px;font-weight:500;white-space:nowrap}
.nav-colapsar:hover{background:rgba(255,255,255,.08);color:#fff}
.sidebar-user{display:flex;align-items:center;gap:8px;padding:11px 12px;border-top:1px solid rgba(255,255,255,.09)}
.sidebar-user-link{display:flex;align-items:center;gap:11px;flex:1;min-width:0;color:inherit;padding:4px 6px;border-radius:10px;transition:.14s}
.sidebar-user-link:hover{background:rgba(255,255,255,.08)}
.avatar{width:38px;height:38px;border-radius:11px;background:var(--azul-600);flex-shrink:0;
  display:grid;place-items:center;font-weight:700;color:#fff;font-family:var(--fuente-titulo)}
.sidebar-user-info{flex:1;overflow:hidden}
.sidebar-user-info strong{display:block;font-size:13.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-user-info span{display:inline-block;font-size:10.5px;color:#cdd9ea;text-transform:capitalize;
  background:rgba(255,255,255,.10);padding:1px 8px;border-radius:20px;margin-top:3px;letter-spacing:.02em}
.logout{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;color:#cdd9ea;background:rgba(255,255,255,.07);border-radius:9px;transition:.15s}
.logout svg{width:18px;height:18px}
.logout:hover{color:#fff;background:rgba(214,69,69,.45)}

/* Menú contraído (solo escritorio) */
@media(min-width:1024px){
  .sidebar{transition:width .18s ease}
  html.nav-colapsado .sidebar{width:72px}
  /* Con pocos ítems no hace falta scroll: overflow visible para que el tooltip no se recorte */
  html.nav-colapsado .sidebar nav{overflow:visible}
  /* Tooltip propio (con la marca) al pasar sobre un ícono del menú contraído */
  html.nav-colapsado .sidebar nav a:hover::after{content:attr(title);position:absolute;left:calc(100% + 12px);top:50%;
    transform:translateY(-50%);background:var(--navy-900);color:#fff;font-size:12px;font-weight:600;
    padding:6px 11px;border-radius:8px;white-space:nowrap;box-shadow:0 8px 22px rgba(6,12,40,.4);z-index:40;pointer-events:none}
  html.nav-colapsado .sidebar nav a.activo::before{display:none}
  html.nav-colapsado .sidebar .marca-full{display:none}
  html.nav-colapsado .sidebar .marca-mini{display:block;margin:0 auto}
  html.nav-colapsado .brand{justify-content:center;padding:16px 0}
  html.nav-colapsado .sidebar nav{padding:12px 8px}
  html.nav-colapsado .sidebar nav a{justify-content:center;padding:10px 0}
  html.nav-colapsado .sidebar nav a .nav-txt{display:none}
  html.nav-colapsado .sidebar .nav-grupo{padding:0;height:0;margin:9px 16px;border-top:1px solid rgba(255,255,255,.14)}
  html.nav-colapsado .sidebar .nav-grupo span{display:none}
  html.nav-colapsado .nav-colapsar{justify-content:center;margin:4px 8px}
  html.nav-colapsado .nav-colapsar .nav-txt{display:none}
  html.nav-colapsado .nav-colapsar .ico-svg{transform:rotate(180deg)}
  html.nav-colapsado .sidebar-user{justify-content:center;padding:13px 0}
  html.nav-colapsado .sidebar-user-link{display:none}
}

.contenido{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:13px 26px;border-bottom:1px solid var(--linea);position:sticky;top:0;
  background:var(--panel);z-index:5}
.topbar h1{font-size:20px;font-weight:700;color:var(--navy-800)}
/* Barra de acciones: migas de pan (izq) + botón principal (der), bajo el título */
.barra-accion{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;
  padding:11px 26px;background:var(--panel);border-bottom:1px solid var(--linea)}
.migas{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--txt-mute);flex-wrap:wrap;min-width:0}
.migas a{color:var(--txt-mute);text-decoration:none}
.migas a:hover{color:var(--azul-700);text-decoration:underline}
.migas .sep{color:var(--txt-dim)}
.migas .actual{color:var(--navy-800);font-weight:600}
.barra-accion-btns{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto}
@media(max-width:860px){.barra-accion{padding:11px 16px}}
.contenido-inner{padding:22px 26px;max-width:1240px;width:100%;margin-inline:auto}

/* ---------- Tarjetas / paneles ---------- */
.card{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);
  padding:20px;margin-bottom:18px;box-shadow:var(--sombra-sm)}
.card h2{font-family:var(--fuente-titulo);font-size:16px;margin-bottom:16px;font-weight:650;color:var(--navy-800)}
.card h2 small{font-weight:400;color:var(--txt-dim);font-size:12.5px;margin-left:6px;font-family:var(--fuente)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.grid-2>*,.grid-3>*{min-width:0}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:18px}

/* ---------- Tarjetas de plantilla ---------- */
.tpl-card{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;
  box-shadow:var(--sombra-sm);transition:transform .16s,box-shadow .16s,border-color .16s;display:flex;flex-direction:column}
.tpl-card:hover{transform:translateY(-2px);box-shadow:var(--sombra);border-color:var(--azul-400)}
.tpl-thumbs{display:flex;aspect-ratio:1.414;position:relative;padding:12px;
  background:#e9eef5;background-image:radial-gradient(rgba(24,37,95,.10) 1px,transparent 1px);background-size:14px 14px}
.tpl-thumb{flex:1;min-width:0;position:relative;display:block;overflow:hidden}
.tpl-thumb img{width:100%;height:100%;object-fit:contain;display:block;
  filter:drop-shadow(0 5px 12px rgba(22,36,94,.20));transition:transform .18s}
.tpl-card:hover .tpl-thumb img{transform:scale(1.025)}
.tpl-toggle{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:inline-flex;
  background:#fff;border:1px solid var(--linea-fuerte);border-radius:8px;overflow:hidden;box-shadow:var(--sombra-sm);z-index:3}
.tpl-toggle button{border:0;background:#fff;color:var(--txt-mute);font-family:var(--fuente);font-size:11.5px;font-weight:600;padding:6px 13px;cursor:pointer;line-height:1}
.tpl-toggle button + button{border-left:1px solid var(--linea)}
.tpl-toggle button.activo{background:var(--azul-600);color:#fff}
.tpl-toggle button:hover:not(.activo){background:var(--panel-2)}
.tpl-edit{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:7px;
  background:rgba(24,37,95,.5);color:#fff;font-weight:700;font-size:13.5px;opacity:0;transition:opacity .16s}
.tpl-edit svg{width:17px;height:17px}
.tpl-thumb:hover .tpl-edit,.tpl-thumb:focus-visible .tpl-edit{opacity:1}
.tpl-body{padding:14px 15px;display:flex;flex-direction:column;gap:10px;flex:1}
.tpl-nombre{font-weight:700;color:var(--navy-800);font-size:15px;line-height:1.25}
.tpl-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tpl-actions{display:flex;gap:8px;margin-top:auto;flex-wrap:nowrap}
.tpl-actions>.btn:first-child{flex:1}
/* Galería de fondos prediseñados (modal Nueva plantilla) */
.fondo-galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px;margin-top:4px}
.fondo-op{position:relative;cursor:pointer;border:2px solid var(--linea);border-radius:11px;overflow:hidden;background:#fff;transition:.14s;display:block}
.fondo-op input{position:absolute;opacity:0;pointer-events:none}
.fondo-op img{width:100%;display:block;aspect-ratio:1.414;object-fit:cover;background:#eef3f9}
.fondo-op>span{display:block;padding:6px 8px;font-size:12px;font-weight:600;color:var(--navy-800);text-align:center}
.fondo-op:hover{border-color:var(--azul-400)}
.fondo-op:has(input:checked){border-color:var(--azul-600);box-shadow:0 0 0 2px var(--acento-soft)}
.fondo-subir-ph{aspect-ratio:1.414;display:grid;place-items:center;gap:6px;color:var(--azul-700);background:var(--panel-2)}
.fondo-subir-ph svg{width:26px;height:26px}
.fondo-subir-ph span{font-size:12px;font-weight:600}
/* Vista previa en vivo del modal "Nueva plantilla" */
.pl-preview-wrap{display:flex;gap:10px;margin-bottom:14px}
.pl-preview{flex:1;min-width:0;height:210px;margin:0;border:1px solid var(--linea);border-radius:10px;background:#eef3f9;
  overflow:hidden;display:flex;align-items:center;justify-content:center;padding:8px;position:relative}
.pl-preview img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;transition:opacity .15s}
.pl-preview img.cargando{opacity:.35}
.pl-preview-cap{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);background:rgba(24,37,95,.82);color:#fff;
  font-size:11px;font-weight:600;padding:2px 10px;border-radius:20px}
.pl-preview-msg{color:var(--txt-mute);font-size:12.5px;padding:14px;text-align:center}
/* Selector de archivo estilizado (dropzone) */
.file-drop{display:flex;align-items:center;gap:13px;padding:14px 16px;margin-top:2px;border:1.5px dashed var(--linea-fuerte);
  border-radius:12px;background:var(--panel-2);cursor:pointer;transition:border-color .15s,background .15s}
.file-drop:hover,.file-drop.arrastrando{border-color:var(--azul-600);background:var(--acento-soft)}
.file-drop input[type=file]{display:none}
.file-drop-ico{width:42px;height:42px;flex-shrink:0;border-radius:11px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center}
.file-drop-ico svg{width:22px;height:22px}
.file-drop-txt{display:flex;flex-direction:column;gap:2px;min-width:0;line-height:1.3}
.file-drop-txt strong{color:var(--navy-800);font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-drop-txt small{color:var(--txt-mute);font-size:12px}
.file-drop-txt small.file-warn{color:var(--warn)}
.file-drop-txt small.file-ok{color:#1f9d57}
/* Visor de logs (diagnóstico) */
.log-box{background:#0f1530;color:#cdd9ea;border-radius:12px;padding:16px;font-family:var(--fuente-mono);font-size:12px;line-height:1.6;max-height:440px;overflow:auto;white-space:pre-wrap;word-break:break-word;margin:0}
/* Lista de comprobación del sistema (health check) */
.chk-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.chk-list li{display:flex;align-items:flex-start;gap:11px;padding:11px 14px;border:1px solid var(--linea);border-radius:11px;background:#fff}
.chk-list li svg{width:19px;height:19px;flex-shrink:0;margin-top:1px}
.chk-list li>div{display:flex;flex-direction:column;line-height:1.35}
.chk-list li strong{color:var(--navy-800);font-size:14px}
.chk-list li small{color:var(--txt-mute);font-size:12.5px}
.chk-list li.chk-ok{border-color:rgba(34,160,94,.3);background:var(--ok-bg)}
.chk-list li.chk-ok svg{color:var(--ok)}
.chk-list li.chk-error{border-color:rgba(214,69,69,.3);background:var(--err-bg)}
.chk-list li.chk-error svg{color:var(--err)}
.chk-list li.chk-info svg{color:var(--azul-700)}
/* Desglose de almacenamiento (diagnóstico) */
.alm-tabla{width:100%;border-collapse:collapse;margin-top:4px;font-size:14px}
.alm-tabla td{padding:11px 4px;border-bottom:1px solid var(--linea)}
.alm-tabla .alm-lbl{color:var(--navy-800);font-weight:600}
.alm-tabla .alm-n{color:var(--txt-dim);font-size:12.5px;white-space:nowrap;text-align:center}
.alm-tabla .alm-sz{text-align:right;font-family:var(--fuente-titulo);font-weight:700;color:var(--navy-800);white-space:nowrap}
.alm-tabla tfoot td{border-bottom:none;border-top:2px solid var(--linea-fuerte);padding-top:12px;color:var(--txt-mute)}
.alm-tabla tfoot .alm-lbl{color:var(--txt-mute)}
@media(max-width:560px){.alm-tabla .alm-n{display:none}}
/* Lista de archivos huérfanos (mantenimiento) */
.huerf-lista{max-height:210px;overflow-y:auto;border:1px solid var(--linea);border-radius:10px;background:var(--panel-2);font-size:12.5px}
.huerf-lista>div{display:flex;justify-content:space-between;gap:12px;padding:7px 12px;border-bottom:1px solid var(--linea)}
.huerf-lista>div:last-child{border-bottom:none}
.huerf-lista .mono{font-family:var(--fuente-mono);color:var(--navy-800);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.huerf-lista .huerf-sz{color:var(--txt-mute);white-space:nowrap}
.huerf-lista .huerf-mas{color:var(--txt-dim);font-style:italic;justify-content:center}
/* Avisos del sistema (superadmin) */
.avisos{display:flex;flex-direction:column;gap:8px}
.aviso{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:11px;font-size:13.5px}
.aviso svg{width:18px;height:18px;flex-shrink:0}
.aviso span{flex:1;min-width:0}
.aviso a{font-weight:600;white-space:nowrap}
.aviso-warn{background:#fef3c7;color:#7c4a03}
.aviso-warn a{color:#7c4a03;text-decoration:underline}
.aviso-info{background:var(--acento-soft);color:var(--azul-700)}
.aviso-info a{color:var(--azul-700);text-decoration:underline}
/* Banner de modo mantenimiento (para usuarios con sesión) */
.mant-banner{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;background:#fde68a;color:#7c4a03;padding:9px 16px;font-size:13.5px;font-weight:600;text-align:center}
.mant-banner svg{width:17px;height:17px;flex-shrink:0}
.mant-banner a{color:#7c4a03;text-decoration:underline;font-weight:700}
/* Pestañas Frente/Reverso para elegir el fondo de cada cara */
.fondo-tabs{display:inline-flex;border:1px solid var(--linea-fuerte);border-radius:9px;overflow:hidden;margin-bottom:10px}
.fondo-tab{border:0;background:#fff;color:var(--txt-mute);font-family:inherit;font-size:13px;font-weight:600;padding:7px 18px;cursor:pointer;transition:.12s}
.fondo-tab + .fondo-tab{border-left:1px solid var(--linea-fuerte)}
.fondo-tab.activo{background:var(--azul-600);color:#fff}
.fondo-tab:hover:not(.activo){background:var(--panel-2)}
/* Listado de plantillas: buscador + chips de filtro (barra pegajosa) sobre una sola rejilla */
.tpl-barra{position:sticky;top:52px;z-index:4;background:var(--bg);padding:14px 0 12px;margin-bottom:8px;
  border-bottom:1px solid var(--linea)}
.tpl-filtros{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 10px}
.tpl-filtros input{flex:1;min-width:200px;padding:10px 12px;border:1.5px solid var(--linea-fuerte);border-radius:10px;
  font-family:inherit;font-size:14px;background:#fff;color:var(--txt)}
.tpl-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.tpl-chip{border:1.5px solid var(--linea-fuerte);background:#fff;color:var(--txt-mute);font-family:inherit;font-size:13px;
  font-weight:600;padding:7px 14px;border-radius:20px;cursor:pointer;transition:.12s}
.tpl-chip:hover{border-color:var(--azul-400);color:var(--navy-800)}
.tpl-chip.activo{background:var(--azul-600);border-color:var(--azul-600);color:#fff}
#tpl-grid{margin-top:14px}
.rec-thumb{aspect-ratio:1.9;display:grid;place-items:center;overflow:hidden;padding:16px;
  background-color:#eef2f7;
  background-image:linear-gradient(45deg,#dde6f0 25%,transparent 25%),linear-gradient(-45deg,#dde6f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dde6f0 75%),linear-gradient(-45deg,transparent 75%,#dde6f0 75%);
  background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}
.rec-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.rec-datos{margin-top:9px;display:flex;flex-direction:column;gap:3px;font-size:13px;color:var(--txt-mute)}
.rec-datos .ico-svg{width:14px;height:14px;vertical-align:-2px;color:var(--azul-600)}
/* Editor al subir firma/sello (recortar + quitar fondo) */
.rec-editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px}
@media(max-width:560px){.rec-editor-grid{grid-template-columns:1fr}}
.rec-sub{display:block;font-size:13px;color:var(--navy-800);font-weight:600;margin-bottom:6px}
.rec-crop{max-height:300px;background:var(--panel-2);border:1px solid var(--linea);border-radius:10px;overflow:hidden}
/* Recorte: manijas grandes y visibles (las de fábrica de cropper son puntos de 5px al 75%) */
.rec-crop .cropper-view-box{outline:2px solid var(--azul-600);outline-offset:-1px}
.rec-crop .cropper-line{background:var(--azul-600)}
.rec-crop .cropper-point{width:13px;height:13px;background:#fff;border:2px solid var(--azul-600);border-radius:50%;opacity:1;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.rec-crop .cropper-point.point-nw{top:-7px;left:-7px}
.rec-crop .cropper-point.point-ne{top:-7px;right:-7px}
.rec-crop .cropper-point.point-sw{bottom:-7px;left:-7px}
.rec-crop .cropper-point.point-se{bottom:-7px;right:-7px;width:13px;height:13px}
.rec-crop .cropper-point.point-n{top:-7px;margin-left:-7px}
.rec-crop .cropper-point.point-s{bottom:-7px;margin-left:-7px}
.rec-crop .cropper-point.point-e{right:-7px;margin-top:-7px}
.rec-crop .cropper-point.point-w{left:-7px;margin-top:-7px}
.rec-crop img{display:block;max-width:100%}
.rec-crop-btns{display:flex;gap:6px;margin-top:8px}
.rec-preview-wrap{min-height:150px;display:grid;place-items:center;border:1px solid var(--linea);border-radius:10px;padding:10px;
  background-color:#eef2f7;
  background-image:linear-gradient(45deg,#dde6f0 25%,transparent 25%),linear-gradient(-45deg,#dde6f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dde6f0 75%),linear-gradient(-45deg,transparent 75%,#dde6f0 75%);
  background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}
.rec-preview-wrap canvas{max-width:100%;max-height:210px}
.cfg-card{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--linea);border-radius:14px;padding:18px 20px;box-shadow:var(--sombra-sm);color:var(--txt);transition:.14s}
.cfg-card:hover{border-color:var(--azul-400);box-shadow:var(--sombra);transform:translateY(-2px)}
.cfg-intro{color:var(--txt-mute);font-size:14px;margin:0}
.cfg-card:hover .cfg-arrow{color:var(--azul-600);transform:translateX(2px)}
.cfg-card .cfg-ico{width:48px;height:48px;border-radius:13px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;flex-shrink:0}
.cfg-card .cfg-ico .ico-svg{width:24px;height:24px}
.cfg-card .cfg-txt{flex:1;min-width:0}
.cfg-card .cfg-txt strong{display:block;color:var(--navy-800);font-size:15.5px}
.cfg-card .cfg-txt small{color:var(--txt-mute);font-size:13px}
.cfg-card .cfg-arrow{color:var(--txt-dim);flex-shrink:0;transition:.14s}
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px}
.cfg-seccion{font-family:var(--fuente-titulo);font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;
  color:var(--txt-mute);margin:24px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--linea)}
.guia-pasos{list-style:none;display:flex;flex-direction:column;gap:16px}
.guia-pasos li{display:flex;gap:14px;align-items:flex-start}
.guia-pasos .paso-n{width:30px;height:30px;border-radius:50%;background:var(--azul-600);color:#fff;font-weight:700;
  display:grid;place-items:center;flex-shrink:0;font-family:var(--fuente-titulo);font-size:14px}
.guia-pasos strong{color:var(--navy-800);font-size:15px}
.guia-pasos p{color:var(--txt-mute);font-size:13.5px;margin-top:3px;line-height:1.5}
.guia-faq dt{font-weight:600;color:var(--navy-800);margin-top:14px}
.guia-faq dt:first-child{margin-top:0}
.guia-faq dd{color:var(--txt-mute);font-size:13.5px;margin:3px 0 0;line-height:1.5}
.ph-chip{background:var(--acento-soft);border:1px solid var(--linea-fuerte);color:var(--azul-700);border-radius:20px;
  padding:4px 10px;font-size:12px;font-family:var(--fuente-mono);cursor:pointer;font-weight:600}
.ph-chip:hover{background:var(--azul-600);color:#fff;border-color:var(--azul-600)}

/* ---------- Métricas ---------- */
.metricas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:14px;margin-bottom:18px}
.metrica{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);
  padding:15px 16px;box-shadow:var(--sombra-sm);position:relative;overflow:hidden;
  display:flex;align-items:center;gap:13px}
.metrica .m-ico{width:42px;height:42px;flex-shrink:0;border-radius:11px;display:grid;place-items:center;
  background:var(--acento-soft);color:var(--azul-700)}
.metrica .m-ico .ico-svg{width:22px;height:22px}
.metrica .m-txt{min-width:0}
.metrica .valor{font-family:var(--fuente-titulo);font-size:27px;font-weight:700;letter-spacing:-.5px;color:var(--navy-800);line-height:1.1}
.metrica .etq{color:var(--txt-mute);font-size:12.5px;margin-top:2px}
/* Acento por métrica: franja superior + tile de color (planos, sin gradiente) */
.metrica{border-top:3px solid var(--azul-600)}
.metrica.m-ok{border-top-color:var(--ok)}
.metrica.m-ok .m-ico{background:var(--ok-bg);color:var(--ok)}
.metrica.m-verif{border-top-color:var(--warn)}
.metrica.m-verif .m-ico{background:var(--warn-bg);color:var(--warn)}
.metrica.m-navy{border-top-color:var(--navy-700)}
.metrica.m-navy .m-ico{background:rgba(22,36,94,.10);color:var(--navy-700)}

.chart-box{position:relative;height:260px;width:100%}
.chart-box-alta{height:300px}
@media(max-width:560px){.chart-box,.chart-box-alta{height:240px}}

/* Listas compactas (dashboard) */
.lista-item{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--linea);color:var(--txt);transition:.12s}
.lista-item:last-child{border-bottom:none}
.lista-item:hover{background:var(--panel-2)}
.lista-item .li-txt{flex:1;min-width:0}
.lista-item .li-ico{width:34px;height:34px;border-radius:9px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;flex-shrink:0}
/* Cabecera del dashboard: saludo + filtro de periodo en la misma fila */
.dash-cab{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.saludo h2{font-family:var(--fuente-titulo);font-size:21px;font-weight:700;color:var(--navy-800);letter-spacing:-.3px}
.saludo small{display:block;color:var(--txt-mute);font-size:13px;margin-top:2px}
.dash-cab .dash-filtro{margin-bottom:0}
/* Chip de tendencia en la métrica (delta con signo vs periodo anterior) */
.m-delta{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:11.5px;font-weight:700}
.m-delta .ico-svg{width:13px;height:13px}
.m-delta span{font-weight:500;color:var(--txt-dim)}
.m-delta.arriba{color:var(--ok)}
.m-delta.abajo{color:var(--err)}
.m-delta.igual{color:var(--txt-mute)}

.dash-filtro{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px;background:#fff;border:1px solid var(--linea);border-radius:12px;padding:10px 14px;box-shadow:var(--sombra-sm)}
.dash-filtro .df-lbl{font-weight:600;color:var(--txt-mute);font-size:13px}
.dash-filtro input[type=date]{padding:7px 10px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);border-radius:8px;color:var(--txt);font-size:13.5px;font-family:inherit}
.lista-item .li-ico .ico-svg{width:18px;height:18px}
.lista-item .li-txt{min-width:0;display:flex;flex-direction:column}
.lista-item .li-txt strong{font-size:13.5px;color:var(--navy-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lista-item .li-txt small{font-size:12px;color:var(--txt-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Badges de ranking (podio): oro/plata/bronce suaves para el top 3 */
.li-ico.rk{font-family:var(--fuente-titulo);font-weight:700;font-size:14px}
.li-ico.rk.pos1{background:#fbf0cf;color:#9a6f00}
.li-ico.rk.pos2{background:#eceef3;color:#5f6b7e}
.li-ico.rk.pos3{background:#f6e7d8;color:#9c5a25}
.lista-item .rk-n{margin-left:auto;font-family:var(--fuente-titulo);font-weight:700;color:var(--navy-800);font-size:15px}
/* Encabezado de sección del dashboard: etiqueta + línea (plano) */
.dash-sec{display:flex;align-items:center;gap:9px;margin:26px 0 14px;font-family:var(--fuente-titulo);
  font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--txt-mute)}
.dash-sec .ico-svg{width:17px;height:17px;color:var(--azul-600)}
.dash-sec::after{content:"";flex:1;height:1px;background:var(--linea)}

/* ---------- Formularios ---------- */
.campo{margin-bottom:16px}
.campo label{display:block;font-size:13px;color:var(--txt-mute);margin-bottom:7px;font-weight:600}
.campo input:not([type=checkbox]):not([type=radio]):not([type=range]),.campo select,.campo textarea{width:100%;padding:11px 13px;background:var(--panel-2);
  border:1.5px solid var(--linea-fuerte);border-radius:var(--radio-sm);color:var(--txt);font-size:14.5px;transition:.15s;font-family:inherit}
.campo input::placeholder,.campo textarea::placeholder{color:var(--txt-dim)}
.campo input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--azul-600);
  background:#fff;box-shadow:0 0 0 3px var(--acento-soft)}
.campo textarea{resize:vertical;min-height:80px}
.campo .ayuda{font-size:11.5px;color:var(--txt-dim);margin-top:6px}
/* Estados de validación */
.campo.campo-mal input,.campo.campo-mal select,.campo.campo-mal textarea{border-color:var(--err);background:#fff}
.campo.campo-mal input:focus,.campo.campo-mal select:focus,.campo.campo-mal textarea:focus{border-color:var(--err);box-shadow:0 0 0 3px var(--err-bg)}
.campo.campo-ok input,.campo.campo-ok select,.campo.campo-ok textarea{border-color:#7ec4a3}
.campo.campo-ok input:focus,.campo.campo-ok select:focus,.campo.campo-ok textarea:focus{box-shadow:0 0 0 3px var(--ok-bg)}
.campo-msj{display:flex;align-items:center;gap:5px;color:var(--err);font-size:12px;margin-top:6px;font-weight:500}
.campo-msj svg{width:13px;height:13px;flex-shrink:0}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.check{display:flex;align-items:center;gap:7px;padding:8px 13px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);
  border-radius:30px;font-size:13.5px;cursor:pointer;user-select:none;transition:.15s}
.check:has(input:checked){border-color:var(--azul-600);color:var(--azul-700);background:var(--acento-soft);font-weight:600}

/* ---------- Checkbox / radio personalizados (consistentes en todo el sistema) ---------- */
input[type=checkbox],input[type=radio]{
  -webkit-appearance:none;appearance:none;margin:0;flex:0 0 auto;
  width:18px;height:18px;border:1.6px solid var(--linea-fuerte);background:#fff;
  border-radius:5px;cursor:pointer;position:relative;transition:.14s;vertical-align:-4px}
input[type=radio]{border-radius:50%}
input[type=checkbox]:hover,input[type=radio]:hover{border-color:var(--azul-500)}
input[type=checkbox]:checked,input[type=radio]:checked{background:var(--azul-600);border-color:var(--azul-600)}
input[type=checkbox]:checked::after{content:"";position:absolute;left:5px;top:1.5px;width:5px;height:9px;
  border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
input[type=radio]:checked::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff}
input[type=checkbox]:focus-visible,input[type=radio]:focus-visible{outline:none;box-shadow:0 0 0 3px var(--acento-soft)}
input[type=checkbox]:disabled,input[type=radio]:disabled{opacity:.5;cursor:not-allowed}
/* Deslizadores (range): pista fina con relleno hasta la posición (--pos, la fija el JS) y
   bolita que llega a ambos extremos — sin el borde/padding de las cajas de texto. */
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:22px;padding:0;margin:0;background:transparent;border:0;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:6px;
  background:linear-gradient(to right,var(--azul-600) var(--pos,50%),var(--linea-fuerte) var(--pos,50%))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;
  border:2.5px solid var(--azul-600);margin-top:-6px;box-shadow:0 1px 3px rgba(0,0,0,.2)}
input[type=range]:focus-visible{outline:none}
input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--acento-soft)}
input[type=range]::-moz-range-track{height:6px;border-radius:6px;background:var(--linea-fuerte)}
input[type=range]::-moz-range-progress{height:6px;border-radius:6px;background:var(--azul-600)}
input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2.5px solid var(--azul-600);box-shadow:0 1px 3px rgba(0,0,0,.2)}

/* ---------- Botones (plano, sin degradado) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:10px;
  border:1.5px solid var(--linea-fuerte);background:#fff;color:var(--navy-800);font-size:14px;font-weight:600;
  cursor:pointer;transition:background .14s,border-color .14s,color .14s,transform .08s;line-height:1.2}
.btn:hover{border-color:var(--azul-400);color:var(--azul-700);background:#f5f9fe}
.btn:active{background:#eef4fb;transform:translateY(1px)}
.btn:disabled,.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
.btn:focus-visible{outline:2px solid var(--azul-500);outline-offset:2px}
.btn-primario{background:var(--azul-600);color:#fff;border-color:var(--azul-600)}
.btn-primario:hover{background:var(--azul-700);border-color:var(--azul-700);color:#fff}
.btn-primario:active{background:#114a92;border-color:#114a92}
.btn-secundario{background:var(--navy-800);color:#fff;border-color:var(--navy-800)}
.btn-secundario:hover{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
.btn-peligro{color:var(--err);border-color:#f1c6cd;background:#fff}
.btn-peligro:hover{background:var(--err-bg);color:var(--err);border-color:var(--err)}
.btn-sm{padding:7px 12px;font-size:12.5px;border-radius:8px}
.btn-bloque{width:100%}

/* ---------- Utilidades de texto / listas / buscador ---------- */
.nota{color:var(--txt-mute);font-size:14px;line-height:1.6;margin-bottom:16px}
.nota:last-child{margin-bottom:0}
.nota code{background:var(--panel-3);padding:1px 6px;border-radius:5px;font-size:.92em}
.radio-op{display:flex;align-items:flex-start;gap:9px;cursor:pointer;padding:6px 0}
.radio-op input{margin-top:3px;flex-shrink:0}
.radio-op span{display:flex;flex-direction:column;line-height:1.3}
.radio-op small{color:var(--txt-mute);font-size:12px;margin-top:2px}

/* ---------- Mi cuenta ---------- */
.cuenta-cab{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.cuenta-avatar{width:62px;height:62px;border-radius:50%;background:var(--navy-800);color:#fff;display:grid;place-items:center;
  font-size:25px;font-weight:700;font-family:var(--fuente-titulo);flex-shrink:0}
.cuenta-cab-info{min-width:0}
.cuenta-cab-info .nom{font-family:var(--fuente-titulo);font-size:21px;font-weight:700;color:var(--navy-800);line-height:1.2}
.cuenta-cab-info .mail{color:var(--txt-mute);font-size:14px;margin-top:3px;word-break:break-word}
.sesion-actual{display:flex;flex-direction:column;gap:9px;background:var(--panel-2);border:1px solid var(--linea);
  border-radius:12px;padding:13px 15px;margin:0 0 16px}
.sesion-actual .si{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--txt-mute)}
.sesion-actual .si svg{width:16px;height:16px;color:var(--azul-600);flex-shrink:0}
.sesion-actual .si b{color:var(--navy-800);font-weight:600}
.lista-vinetas{margin:0;padding-left:18px;color:var(--txt-mute);font-size:13.5px;line-height:1.7}
.lista-vinetas li{margin-bottom:6px}
.buscador{display:flex;gap:10px;margin-bottom:18px;max-width:460px;flex-wrap:wrap}
.buscador input[type=text]{flex:1;min-width:0;padding:10px 13px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);border-radius:9px;color:var(--txt);font-size:14px}
.buscador input[type=text]:focus{outline:none;border-color:var(--azul-600)}
.filtros{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.filtros input,.filtros select{padding:8px 11px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);border-radius:8px;color:var(--txt);font-size:13.5px;font-family:inherit;min-width:0}
.filtros input[type=text]{flex:1;min-width:150px}
.filtros input:focus,.filtros select:focus{outline:none;border-color:var(--azul-600)}
/* Filtros con búsqueda prominente + panel avanzado plegable */
.filtros-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.filtro-buscar{position:relative;flex:1;min-width:220px;display:flex;align-items:center}
.filtro-buscar svg{position:absolute;left:12px;width:17px;height:17px;color:var(--txt-dim);pointer-events:none}
.filtro-buscar input{width:100%;padding:10px 13px 10px 38px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);
  border-radius:10px;color:var(--txt);font-size:14px;font-family:inherit}
.filtro-buscar input:focus{outline:none;border-color:var(--azul-600);background:#fff;box-shadow:0 0 0 3px var(--acento-soft)}
.filtro-badge{background:var(--azul-600);color:#fff;border-radius:20px;font-size:11px;padding:1px 7px;margin-left:5px;font-weight:700;font-family:var(--fuente)}
#btn-filtros-avz[aria-expanded="true"]{border-color:var(--azul-400);color:var(--azul-700);background:#f5f9fe}
.filtros-avz{flex-basis:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,165px),1fr));gap:12px;
  margin-top:6px;padding:15px 16px;background:var(--panel-2);border:1px solid var(--linea);border-radius:12px}
.campo-min label{display:block;font-size:11.5px;color:var(--txt-mute);font-weight:600;margin-bottom:5px}
.campo-min select,.campo-min input{width:100%;padding:8px 10px;background:#fff;
  border:1.5px solid var(--linea-fuerte);border-radius:8px;color:var(--txt);font-size:13.5px;font-family:inherit}
.campo-min select:focus,.campo-min input:focus{outline:none;border-color:var(--azul-600);box-shadow:0 0 0 3px var(--acento-soft)}

/* ---------- Certificados: acciones globales / barra contextual de selección ---------- */
.acciones-globales{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.acciones-globales .ayuda{font-size:12.5px}
.sel-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px;
  background:var(--acento-soft);border:1.5px solid var(--azul-400);border-radius:11px;padding:9px 14px}
.sel-bar .sel-n{font-size:13.5px;color:var(--navy-800);font-weight:600;margin-right:4px}
.sel-bar .sel-n b{color:var(--azul-700);font-size:15px}
.sel-bar .sel-quitar{margin-left:auto;color:var(--txt-mute)}

/* ---------- Formulario de curso: chips de ponentes, plantillas y firmas, interruptor ---------- */
.chips-buscar{width:100%;padding:8px 11px;border:1.5px solid var(--linea-fuerte);border-radius:9px;font-family:inherit;font-size:13.5px;margin-bottom:8px}
.chips-buscar:focus{outline:none;border-color:var(--azul-600);box-shadow:0 0 0 3px var(--acento-soft)}
.chips-check{display:flex;flex-wrap:wrap;gap:8px;max-height:158px;overflow:auto;padding:2px}
.chip-check{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:1.5px solid var(--linea-fuerte);border-radius:22px;cursor:pointer;font-size:13px;background:#fff;transition:.12s}
.chip-check input{margin:0}
.chip-check:has(input:checked){background:var(--acento-soft);border-color:var(--azul-400);color:var(--azul-700);font-weight:600}

.cp-lista{display:flex;flex-direction:column;gap:8px}
.cp-item{border:1.5px solid var(--linea);border-radius:11px;overflow:hidden;background:#fff}
.cp-item.abierto{border-color:var(--azul-400)}
.cp-head{display:flex;align-items:center;gap:10px;padding:11px 13px;cursor:pointer;margin:0}
.cp-head input{margin:0}
.cp-nombre{font-weight:600;color:var(--navy-800)}
.cp-tipo{margin-left:auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--azul-700);background:var(--acento-soft);padding:3px 9px;border-radius:20px}
.cp-firmas{padding:4px 13px 13px;border-top:1px dashed var(--linea);display:flex;flex-direction:column;gap:8px}
.cp-firma{display:grid;grid-template-columns:66px 1.2fr 1fr 1fr;gap:8px;align-items:center}
.cp-slot{font-size:12px;font-weight:700;color:var(--txt-mute)}
.cp-firma select,.cp-firma input{padding:7px 9px;border:1.5px solid var(--linea-fuerte);border-radius:8px;font-family:inherit;font-size:13px;min-width:0;background:#fff}
.cp-firma select:focus,.cp-firma input:focus{outline:none;border-color:var(--azul-600);box-shadow:0 0 0 3px var(--acento-soft)}
@media(max-width:600px){.cp-firma{grid-template-columns:1fr}.cp-slot{margin-top:4px}}

.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch-pista{width:42px;height:24px;border-radius:20px;background:var(--linea-fuerte);position:relative;transition:.15s;flex-shrink:0}
.switch-bolita{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.15s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.switch input:checked + .switch-pista{background:var(--azul-600)}
.switch input:checked + .switch-pista .switch-bolita{transform:translateX(18px)}
.switch input:focus-visible + .switch-pista{box-shadow:0 0 0 3px var(--acento-soft)}
/* Dentro de .campo, "label" fuerza display:block y aplastaba la pista del switch */
.campo label.switch{display:inline-flex;font-size:inherit;font-weight:400;color:inherit}
.txt-dim{color:var(--txt-dim)}
.tlink{color:var(--azul-700);font-weight:600;text-decoration:none}
.tlink:hover{text-decoration:underline}
button.tlink{background:none;border:0;padding:0;cursor:pointer;font-family:inherit;font-size:inherit}

/* ---------- Tablas ---------- */
.tabla-wrap{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--radio);background:#fff}
table{width:100%;border-collapse:collapse;font-size:14px}
thead th{text-align:left;padding:13px 16px;background:var(--panel-3);color:var(--navy-700);font-weight:700;
  font-size:11.5px;text-transform:uppercase;letter-spacing:.6px;border-bottom:1px solid var(--linea)}
tbody td{padding:14px 16px;border-bottom:1px solid var(--linea)}
tbody tr:last-child td{border-bottom:none}
tbody tr{transition:.12s}
tbody tr:hover{background:var(--panel-2)}
.acciones-celda{display:flex;align-items:center;gap:6px;flex-wrap:wrap}

/* ---------- Spinner de "procesando" ---------- */
.spinner{display:inline-block;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;
  border-radius:50%;animation:spin .6s linear infinite;vertical-align:-2px;margin-right:7px}
@keyframes spin{to{transform:rotate(360deg)}}
.esta-cargando{pointer-events:none;opacity:.8}

/* ---------- Menú de acciones (kebab) ---------- */
.kebab{position:relative;display:inline-flex}
.kebab-btn{padding:6px 8px;line-height:0}
.kebab-btn .ico-svg,.kebab-btn svg{width:18px;height:18px}
.kebab-pop{position:fixed;z-index:120;min-width:184px;background:#fff;border:1px solid var(--linea);
  border-radius:12px;box-shadow:var(--sombra);padding:6px;display:none;flex-direction:column;gap:2px}
.kebab-pop.abierto{display:flex;animation:kebab-in .12s ease}
@keyframes kebab-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.kebab-pop form{margin:0;width:100%}
.kebab-pop .btn{width:100%;justify-content:flex-start;border:0;background:transparent;box-shadow:none;
  border-radius:8px;padding:9px 11px;font-weight:600;color:var(--txt)}
.kebab-pop .btn:hover{background:var(--panel-2)}
.kebab-pop .btn-peligro{color:var(--err)}
.kebab-pop .btn-peligro:hover{background:var(--err-bg)}
.kebab-pop .btn .ico-svg{width:16px;height:16px}

.vacio{text-align:center;padding:46px 22px;color:var(--txt-mute)}
.vacio .vacio-ico{width:62px;height:62px;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;
  background:var(--acento-soft);border-radius:50%;color:var(--azul-600)}
.vacio .vacio-ico svg,.vacio .vacio-ico .ico-svg{width:28px;height:28px}
.vacio .vacio-titulo{font-family:var(--fuente-titulo);font-weight:700;color:var(--navy-800);font-size:16.5px;margin-bottom:5px;letter-spacing:-.2px}
.vacio>div:not(.vacio-ico):not(.vacio-titulo){max-width:380px;margin-left:auto;margin-right:auto;font-size:13.5px;line-height:1.55}

/* ---------- Paginación ---------- */
.paginacion-barra{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.pag-info{color:var(--txt-mute);font-size:13px}
.paginacion-barra .paginacion{margin-top:0}
.paginacion{display:flex;gap:5px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.pg-i{min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;
  border:1.5px solid var(--linea-fuerte);border-radius:8px;background:#fff;color:var(--navy-800);font-size:13.5px;font-weight:600}
a.pg-i:hover{border-color:var(--azul-400);color:var(--azul-700);background:#f5f9fe}
.pg-act{background:var(--azul-600);border-color:var(--azul-600);color:#fff}
.pg-dis{color:var(--txt-dim);border-color:var(--linea);background:var(--panel-2)}

/* ---------- Etiquetas de estado ---------- */
.tag{display:inline-block;padding:4px 11px;border-radius:20px;font-size:12px;font-weight:600}
.tag:has(.ico-tag){display:inline-flex;align-items:center;gap:4px}
.ico-tag{width:13px;height:13px}
.tag-ok{background:var(--ok-bg);color:var(--ok)}
.tag-err{background:var(--err-bg);color:var(--err)}
.tag-info{background:var(--info-bg);color:var(--info)}
.tag-mute{background:var(--panel-3);color:var(--txt-mute)}
.tag-warn{background:var(--warn-bg);color:var(--warn)}
a.tag{text-decoration:none;transition:.12s}
a.tag:hover{filter:brightness(.94);text-decoration:underline}
.mono{font-family:var(--fuente-mono);letter-spacing:.3px;font-size:13px}

/* ---------- Alertas ---------- */
.alerta{padding:14px 16px;border-radius:var(--radio-sm);margin-bottom:18px;font-size:14px;
  border:1px solid transparent;display:flex;gap:9px;align-items:flex-start}
.alerta::before{font-weight:700;flex-shrink:0}
.alerta-ok{background:var(--ok-bg);color:#0b7a52;border-color:#bce8d6}
.alerta-ok::before{content:"✓"}
.alerta-error{background:var(--err-bg);color:#b32a40;border-color:#f3c4cc}
.alerta-error::before{content:"!"}
.alerta-info{background:var(--info-bg);color:var(--azul-700);border-color:#c7e0f7}
.alerta-info::before{content:"i";font-style:italic}

/* ---------- Notificaciones (toasts) ---------- */
.toasts{position:fixed;top:16px;right:16px;z-index:200;display:flex;flex-direction:column;gap:10px;
  width:min(380px,calc(100% - 32px));pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:11px;background:#fff;border:1px solid var(--linea);
  border-left:4px solid var(--azul-600);border-radius:12px;padding:13px 14px;box-shadow:var(--sombra);
  font-size:14px;color:var(--txt);animation:toast-in .24s ease}
.toast.saliendo{animation:toast-out .22s ease forwards}
.toast .toast-ico{width:20px;height:20px;flex-shrink:0;margin-top:1px}
.toast .toast-msg{flex:1;min-width:0;line-height:1.4}
.toast .toast-x{background:none;border:none;color:var(--txt-dim);font-size:20px;line-height:1;cursor:pointer;padding:0 2px;flex-shrink:0}
.toast .toast-x:hover{color:var(--txt)}
.toast-ok{border-left-color:var(--ok)} .toast-ok .toast-ico{color:var(--ok)}
.toast-error{border-left-color:var(--err)} .toast-error .toast-ico{color:var(--err)}
.toast-info{border-left-color:var(--azul-600)} .toast-info .toast-ico{color:var(--azul-600)}
.toast-warn{border-left-color:var(--warn)} .toast-warn .toast-ico{color:var(--warn)}
@keyframes toast-in{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}
@keyframes toast-out{to{opacity:0;transform:translateX(30px)}}
@media(max-width:560px){.toasts{top:auto;bottom:14px;left:14px;right:14px;width:auto}}

/* ---------- Acceso / instalación ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:stretch}
.login-aside{flex:1;display:none;flex-direction:column;justify-content:space-between;padding:48px;color:#eaf1fb;
  background:var(--navy-800);position:relative;overflow:hidden}
.login-aside::before{content:"";position:absolute;left:-120px;bottom:-150px;width:300px;height:300px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.05)}
.login-aside::after{content:"";position:absolute;right:-140px;top:-140px;width:360px;height:360px;border-radius:50%;
  border:2px solid rgba(255,255,255,.06)}
.login-aside .la-brand{display:flex;align-items:center;gap:14px;position:relative;z-index:1}
.login-aside .la-brand strong{font-family:var(--fuente-titulo);font-size:19px;color:#fff}
.login-aside .la-brand span{display:block;font-size:12px;color:#9fb2d6;text-transform:uppercase;letter-spacing:.04em}
.login-aside h2{font-family:var(--fuente-titulo);font-size:30px;line-height:1.2;font-weight:700;max-width:460px;position:relative;z-index:1}
.login-aside p{color:#b9c8e6;max-width:430px;position:relative;z-index:1}
.login-aside .la-foot{font-size:12.5px;color:#8ea2c8;position:relative;z-index:1}
.login-panel{width:100%;max-width:480px;display:grid;place-items:center;padding:28px;background:var(--panel)}
.login-card{width:100%;max-width:380px}
.login-card .login-logo{display:flex;justify-content:center;margin-bottom:18px}
.login-card h1{text-align:center;font-size:23px;margin-bottom:4px;color:var(--navy-800)}
.login-card .sub{text-align:center;color:var(--txt-dim);font-size:13.5px;margin-bottom:28px}
.login-aside .la-mid{position:relative;z-index:1;display:flex;flex-direction:column;gap:22px}
.login-aside .la-features{list-style:none;display:flex;flex-direction:column;gap:15px;max-width:420px}
.login-aside .la-features li{display:flex;align-items:flex-start;gap:13px;color:#cdd9f0;font-size:14.5px;line-height:1.4}
.login-aside .la-features li svg{width:21px;height:21px;flex-shrink:0;color:#8fc4f5;margin-top:1px}
.login-card form{display:flex;flex-direction:column;gap:16px}
.login-card form .campo{margin:0}
.login-input{position:relative;display:flex;align-items:center}
.login-input .li-ico{position:absolute;left:13px;width:18px;height:18px;color:var(--txt-dim);pointer-events:none}
.login-input input:not([type=checkbox]):not([type=radio]):not([type=range]){width:100%;padding:12px 13px 12px 42px}
.login-input input.es-pass:not([type=checkbox]):not([type=radio]):not([type=range]){padding-right:44px}
.login-input .li-toggle{position:absolute;right:7px;background:none;border:0;padding:7px;cursor:pointer;
  color:var(--txt-dim);display:flex;border-radius:8px;transition:.14s}
.login-input .li-toggle:hover{color:var(--azul-700);background:var(--panel-2)}
.login-input .li-toggle svg{width:18px;height:18px}
.login-card form .btn-bloque{margin-top:6px;display:flex;align-items:center;justify-content:center;gap:8px}
.li-caps{display:flex;align-items:center;gap:7px;margin-top:7px;font-size:12px;font-weight:600;color:var(--warn)}
.li-caps svg{width:14px;height:14px;flex-shrink:0}
.login-ayuda{text-align:center;color:var(--txt-dim);font-size:12.5px;margin-top:22px;line-height:1.5}
@media(min-width:900px){.login-aside{display:flex}.login-panel{box-shadow:-10px 0 40px rgba(15,25,68,.12)}}
/* Sin el panel de marca (<900px), el panel del formulario ocupa todo el ancho
   (antes quedaba a 480px pegado a la izquierda con espacio vacío al lado). */
@media(max-width:899px){.login-wrap{justify-content:center}.login-panel{max-width:none}}

/* ---------- Modal ---------- */
dialog{border:none;border-radius:var(--radio);background:var(--panel);color:var(--txt);
  padding:0;max-width:620px;width:94%;max-height:92vh;box-shadow:0 24px 70px rgba(15,25,68,.32);
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;
  overflow:hidden} /* el dialog NUNCA scrollea él mismo (Chrome nuevo le pone overflow:auto
  de fábrica y aparecía una 2ª barra con espacio vacío); el scroll vive en .modal-body */
/* El display SOLO cuando está abierto: si se pone en el `dialog` base, anula la
   regla del navegador `dialog:not([open]){display:none}` (el autor gana sobre la
   UA) y TODOS los modales aparecerían abiertos al cargar la página. */
dialog[open]{display:flex;flex-direction:column}
/* El form dentro del dialog hereda el layout de columna: así .modal-body (flex:1,
   overflow:auto) scrollea bien aunque el pie del modal quede fuera del form. */
dialog[open]>form{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;overflow:hidden}
dialog::backdrop{background:rgba(15,25,68,.5);backdrop-filter:blur(3px)}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--linea);flex-shrink:0}
.modal-head h3{font-family:var(--fuente-titulo);font-size:17px;color:var(--navy-800)}
.modal-body{padding:24px;flex:1 1 auto;min-height:0;overflow-y:auto}
.modal-foot{padding:16px 24px;border-top:1px solid var(--linea);display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;background:var(--panel-2);border-radius:0 0 var(--radio) var(--radio);flex-shrink:0}
.modal-cerrar{background:none;border:none;color:var(--txt-dim);font-size:24px;cursor:pointer;line-height:1;padding:0 4px;border-radius:8px}
/* ---------- Libro de registro: fila de filtros compacta ---------- */
.libro-filtros{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:18px;
  background:#fff;border:1px solid var(--linea);border-radius:12px;padding:12px 16px;box-shadow:var(--sombra-sm)}
.libro-filtros .lf-anio{flex:0 1 140px;min-width:120px}
.libro-filtros .lf-tipo{flex:0 1 280px;min-width:200px}
.libro-filtros .lf-hint{margin-left:auto;padding-bottom:9px;font-size:12px}
@media(max-width:640px){
  .libro-filtros .lf-anio,.libro-filtros .lf-tipo{flex:1 1 100%}
  .libro-filtros .lf-hint{margin-left:0;padding-bottom:0}
}

/* ---------- Libro de registro: asientos anulados atenuados ---------- */
.libro-tabla .fila-anulada td{background:rgba(214,69,69,.045)}
.libro-tabla .fila-anulada td:not(:last-child){color:var(--txt-mute)}
.libro-tabla th{white-space:nowrap}
.libro-tabla .c-fijo{white-space:nowrap}
.libro-tabla .estado-celda{text-align:center}
.est-ok{color:var(--ok);font-weight:700}
.est-no{color:var(--err);font-weight:700}

/* ---------- Reportes: buscador universal por entidad ---------- */
.rep-buscador{position:relative;background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);
  padding:18px;box-shadow:var(--sombra-sm);max-width:640px}
.rep-buscar-caja{position:relative;display:flex;align-items:center}
.rep-buscar-caja svg{position:absolute;left:14px;width:18px;height:18px;color:var(--txt-dim);pointer-events:none}
.rep-buscar-caja input{width:100%;padding:12px 14px 12px 44px;border:1.5px solid var(--linea-fuerte);border-radius:11px;
  font-family:inherit;font-size:14.5px;background:var(--panel-2)}
.rep-buscar-caja input:focus{outline:none;border-color:var(--azul-600);background:#fff;box-shadow:0 0 0 3px var(--acento-soft)}
.rep-res{position:absolute;left:18px;right:18px;top:calc(100% - 10px);z-index:15;background:#fff;border:1px solid var(--linea);
  border-radius:12px;box-shadow:0 16px 44px rgba(15,25,68,.18);max-height:340px;overflow-y:auto;padding:6px}
.rep-res-grupo{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--txt-mute);
  padding:9px 12px 4px}
.rep-res-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;color:var(--txt);font-size:13.5px;min-width:0}
.rep-res-item:hover{background:var(--acento-soft);color:var(--navy-800)}
.rep-res-item>svg:first-child{width:16px;height:16px;flex-shrink:0;color:var(--azul-600)}
.rep-res-item span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rep-res-item small{color:var(--txt-dim)}
.rep-res-item .rep-res-ir{width:14px;height:14px;color:var(--txt-dim);flex-shrink:0}
.rep-res-mas,.rep-res-vacio{padding:8px 12px;font-size:12px;color:var(--txt-dim)}

/* ---------- Filas de personas: mini avatar con iniciales ---------- */
.fila-persona{display:inline-flex;align-items:center;gap:9px;min-width:0}
.mini-avatar{width:28px;height:28px;border-radius:8px;background:var(--acento-soft);color:var(--azul-700);flex-shrink:0;
  display:inline-grid;place-items:center;font-family:var(--fuente-titulo);font-weight:700;font-size:11px;letter-spacing:.02em}

/* ---------- Ponentes: tarjetas de directorio ---------- */
.pon-card{display:flex;flex-direction:column;gap:12px;padding:16px;transition:transform .15s,box-shadow .15s,border-color .15s}
.pon-card:hover{transform:translateY(-2px);box-shadow:var(--sombra);border-color:var(--azul-400)}
.pon-cab{display:flex;align-items:center;gap:12px;min-width:0}
.pon-avatar{width:46px;height:46px;border-radius:13px;background:var(--acento-soft);color:var(--azul-700);flex-shrink:0;
  display:grid;place-items:center;font-family:var(--fuente-titulo);font-weight:700;font-size:16px;letter-spacing:.02em}
.pon-idn{min-width:0}
.pon-idn strong{display:block;color:var(--navy-800);font-size:14.5px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pon-idn small{display:block;color:var(--txt-mute);font-size:12px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pon-datos{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--txt-mute)}
.pon-datos span{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pon-datos svg{width:14px;height:14px;flex-shrink:0;color:var(--azul-600)}
.pon-datos .pon-sin{color:var(--txt-dim)}
.pon-datos .pon-sin svg{color:var(--txt-dim)}
.pon-stats{display:flex;gap:16px;padding:9px 12px;background:var(--panel-2);border-radius:9px;font-size:12px;color:var(--txt-mute)}
.pon-stats b{color:var(--navy-800);font-family:var(--fuente-titulo);font-size:14px;margin-right:3px}
.pon-actions{display:flex;gap:8px;margin-top:auto;flex-wrap:wrap}
.pon-actions>.btn:first-child{flex:1}

/* Rótulo de sección dentro de un modal (agrupa campos) */
.modal-sec{font-family:var(--fuente-titulo);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:var(--azul-700);margin:16px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--linea)}
.modal-sec:first-child{margin-top:0}
.modal-cerrar:hover{color:var(--err)}

/* ---------- Diálogo de confirmación ---------- */
.confirm-dlg{max-width:430px;width:92%;padding:28px 26px 22px;text-align:center}
.confirm-dlg[open]{animation:confirm-in .18s ease}
@keyframes confirm-in{from{opacity:0;transform:translate(-50%,-46%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.confirm-ico{width:54px;height:54px;border-radius:50%;background:var(--err-bg);color:var(--err);
  display:grid;place-items:center;margin:0 auto 14px}
.confirm-ico svg{width:26px;height:26px}
.confirm-titulo{font-family:var(--fuente-titulo);font-size:18px;color:var(--navy-800);margin-bottom:6px}
.confirm-msg{color:var(--txt-mute);font-size:14px;line-height:1.5;margin-bottom:22px}
.confirm-acciones{display:flex;gap:10px;justify-content:center}
.motivo-dlg .motivo-input{width:100%;box-sizing:border-box;margin:0 0 20px;padding:11px 13px;
  border:1.5px solid var(--linea-fuerte);border-radius:10px;font-family:inherit;font-size:14px;
  color:var(--txt);background:var(--panel-2);resize:vertical;min-height:66px;text-align:left}
.motivo-dlg .motivo-input:focus{outline:none;border-color:var(--azul-600);background:#fff;box-shadow:0 0 0 3px var(--acento-soft)}
.confirm-acciones .btn{min-width:120px;justify-content:center}
.confirm-acciones .confirm-ok{background:var(--err);border-color:var(--err);color:#fff}
.confirm-acciones .confirm-ok:hover{background:#bf3145;border-color:#bf3145;color:#fff}
.aviso-ico{background:var(--acento-soft);color:var(--azul-700)}
.confirm-acciones .aviso-ok{min-width:140px}

/* ---------- Aviso sin conexión ---------- */
.offline-banner{position:fixed;left:50%;bottom:18px;transform:translateX(-50%) translateY(140%);
  display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);
  background:var(--navy-800);color:#fff;padding:11px 18px;border-radius:12px;font-size:13.5px;font-weight:500;
  box-shadow:0 12px 34px rgba(15,25,68,.4);z-index:1200;transition:transform .28s ease;pointer-events:none}
.offline-banner svg{width:18px;height:18px;flex-shrink:0;color:var(--azul-400)}
body.sin-conexion .offline-banner{transform:translateX(-50%) translateY(0)}

/* ---------- Barra de progreso de navegación ---------- */
#nav-progreso{position:fixed;top:0;left:0;height:3px;width:0;background:var(--azul-600);
  z-index:2000;opacity:0;pointer-events:none;box-shadow:0 0 8px rgba(31,127,209,.6)}
#nav-progreso.activo{opacity:1;animation:nav-prog 9s cubic-bezier(.1,.7,.3,1) forwards}
@keyframes nav-prog{0%{width:0}25%{width:48%}55%{width:74%}80%{width:88%}100%{width:94%}}

/* ---------- Vista previa al emitir ---------- */
.emit-preview{margin:4px 0 16px;border:1px solid var(--linea);border-radius:12px;padding:14px;
  background:#e9eef5;background-image:radial-gradient(rgba(24,37,95,.10) 1px,transparent 1px);background-size:14px 14px}
.emit-preview-lbl{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--navy-800);margin-bottom:10px}
.emit-preview-lbl .ico-svg{width:15px;height:15px;color:var(--azul-600)}
.emit-preview img{display:block;width:auto;max-width:100%;max-height:240px;margin:0 auto;border-radius:4px;background:#fff;
  filter:drop-shadow(0 6px 14px rgba(22,36,94,.22));transition:opacity .2s}
.emit-preview img.cargando{opacity:.4}

/* ---------- Asistente de emisión (wizard) ---------- */
.emitir-dlg{max-width:860px;width:96%}
.wz-pasos{display:flex;gap:4px;padding:14px 24px 0;flex-shrink:0}
.wz-paso{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;font-size:12.5px;font-weight:700;
  color:var(--txt-dim);padding:8px 4px;border-bottom:2.5px solid var(--linea)}
.wz-paso b{width:21px;height:21px;border-radius:50%;background:var(--panel-3);color:var(--txt-mute);
  display:inline-flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
.wz-paso.activo{color:var(--azul-700);border-color:var(--azul-600)}
.wz-paso.activo b{background:var(--azul-600);color:#fff}
.wz-paso.hecho{color:var(--ok);border-color:var(--ok)}
.wz-paso.hecho b{background:var(--ok);color:#fff;font-size:0}
.wz-paso.hecho b::after{content:"✓";font-size:12px;line-height:1}
.wz-tipo-doc{margin:0 0 0 auto;min-width:180px}
.wz-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
/* Métodos para agregar participantes: tarjetas con ícono + título + pista */
.wz-metodos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:10px;margin:0 0 14px}
.wz-metodo{display:flex;align-items:center;gap:11px;padding:12px 14px;border:1.5px solid var(--linea-fuerte);border-radius:11px;
  background:var(--panel-2);cursor:pointer;font-family:inherit;text-align:left;transition:.13s;min-width:0;margin:0}
.wz-metodo:hover{border-color:var(--azul-500);background:var(--acento-soft)}
.wz-metodo svg{width:20px;height:20px;flex-shrink:0;color:var(--azul-600)}
.wz-metodo span{display:flex;flex-direction:column;gap:1px;min-width:0}
.wz-metodo strong{font-size:13px;color:var(--navy-800)}
.wz-metodo small{font-size:11.5px;color:var(--txt-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Opciones del paso 3 como interruptores */
.wz-opciones{display:flex;flex-direction:column;gap:12px;margin-top:14px;font-size:13.5px;color:var(--txt)}
.wz-base{border:1px solid var(--linea-fuerte);border-radius:12px;padding:12px;margin-bottom:12px;background:var(--panel-2)}
.base-lista{max-height:220px;overflow-y:auto;margin:10px 0;display:flex;flex-direction:column;gap:2px}
.base-item{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:8px;font-size:13.5px;cursor:pointer}
.base-item:hover{background:#fff}
.base-item input{flex-shrink:0}
.base-item small{color:var(--txt-dim);margin-left:auto;white-space:nowrap}
.wz-resumen{background:var(--acento-soft);border-left:4px solid var(--azul-600);border-radius:12px;padding:14px 16px;margin-bottom:14px;color:var(--navy-800)}
.wz-resumen b{font-family:var(--fuente-titulo);font-size:20px;color:var(--azul-700)}
.wz-lista-rev{max-height:230px;overflow-y:auto;border:1px solid var(--linea);border-radius:10px;font-size:13px}
.wz-lista-rev div{padding:7px 12px;border-bottom:1px solid var(--linea)}
.wz-lista-rev div:last-child{border-bottom:none}
.wz-proc{text-align:center;padding:6px 0 2px}
.wz-proc-pct{font-family:var(--fuente-titulo);font-size:48px;font-weight:800;color:var(--azul-600);line-height:1;letter-spacing:-1.5px;margin-bottom:4px}
.wz-proc-pct small{font-size:24px;font-weight:700;margin-left:2px;opacity:.7}
.wz-prog-barra{height:14px;background:var(--panel-3);border-radius:20px;overflow:hidden;margin:10px 0 8px}
.wz-prog-relleno{height:100%;width:0;background:var(--azul-600);transition:width .3s ease;position:relative;overflow:hidden}
/* Brillo que recorre la barra mientras genera (afford. de "en proceso", no decorativo) */
.wz-prog-relleno.wz-anim::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  transform:translateX(-100%);animation:wz-shine 1.2s ease-in-out infinite}
@keyframes wz-shine{to{transform:translateX(100%)}}
.wz-prog-txt{text-align:center;font-weight:700;color:var(--navy-800);font-family:var(--fuente-titulo);font-size:15px}
.wz-proc-nota{color:var(--txt-mute);font-size:13px;margin-top:14px;display:flex;align-items:center;justify-content:center;gap:8px}
.wz-dot{width:9px;height:9px;border-radius:50%;background:var(--azul-600);animation:wz-pulse 1s ease-in-out infinite}
@keyframes wz-pulse{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
.wz-cont{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px;color:var(--txt-mute);font-size:13px}
.wz-res-cards{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.wz-res-cards .c{flex:1;min-width:90px;text-align:center;background:var(--panel-2);border:1px solid var(--linea);
  border-radius:12px;padding:12px 8px;border-top:3px solid var(--linea-fuerte)}
.wz-res-cards .c b{display:block;font-size:22px;font-family:var(--fuente-titulo);color:var(--navy-800);line-height:1}
.wz-res-cards .c small{color:var(--txt-mute);font-size:11.5px}
.wz-res-cards .c-ok{border-top-color:var(--ok)}   .wz-res-cards .c-ok b{color:var(--ok)}
.wz-res-cards .c-err{border-top-color:var(--err)} .wz-res-cards .c-err b{color:var(--err)}
.wz-res-cards .c-info{border-top-color:var(--info)}.wz-res-cards .c-info b{color:var(--info)}
.wz-res-cards .c-send{border-top-color:var(--azul-400)}
.wz-res-cards .c-mute{border-top-color:var(--linea-fuerte)}
.envio-lista-tit{font-weight:700;color:var(--navy-800);font-size:13px;margin:4px 0 8px}
.envio-fila{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--linea);font-size:13.5px;color:var(--txt)}
.envio-fila:last-child{border-bottom:0}
.envio-dlg{max-width:520px;width:calc(100% - 36px)}
.wz-res-tabla{max-height:240px;overflow-y:auto;border:1px solid var(--linea);border-radius:10px}
.wz-res-tabla table{width:100%;font-size:12.5px;border-collapse:collapse}
.wz-res-tabla td{padding:7px 12px;border-bottom:1px solid var(--linea)}
.wz-res-tabla tr:last-child td{border-bottom:none}

/* ---------- Detalle de curso ---------- */
.curso-cab{display:flex;flex-direction:column;gap:6px}
.curso-cab-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:4px}
.curso-cab-titulo{font-family:var(--fuente-titulo);font-size:21px;font-weight:700;color:var(--navy-800);line-height:1.2;letter-spacing:-.3px}
.curso-cab-sub{color:var(--txt-mute);font-size:13.5px;display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:4px}
.curso-cab-sub span{display:inline-flex;align-items:center;gap:5px}
.curso-cab-sub svg{width:14px;height:14px;color:var(--azul-600)}
.curso-cols{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(min(100%,270px),1fr);gap:18px;align-items:start}
@media(max-width:880px){.curso-cols{grid-template-columns:1fr}}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:4px}
.info-item{display:flex;align-items:flex-start;gap:11px;padding:11px 10px;border-radius:11px;transition:.12s}
.info-item:hover{background:var(--panel-2)}
.info-item .ii-ico{width:34px;height:34px;border-radius:9px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;flex-shrink:0}
.info-item .ii-ico svg{width:17px;height:17px}
.info-item .ii-k{font-size:11px;color:var(--txt-dim);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.info-item .ii-v{font-size:14px;color:var(--navy-800);font-weight:600;margin-top:2px;line-height:1.35}
.curso-desc{color:var(--txt-mute);font-size:13.5px;line-height:1.6;margin-top:14px;padding-top:14px;border-top:1px dashed var(--linea)}
.ponente-card{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--linea);border-radius:12px;background:var(--panel-2);margin-bottom:10px}
.ponente-card:last-child{margin-bottom:0}
.ponente-card .pc-avatar{width:42px;height:42px;border-radius:11px;background:var(--navy-800);color:#fff;display:grid;place-items:center;font-weight:700;font-family:var(--fuente-titulo);font-size:16px;flex-shrink:0}
.ponente-card .pc-nom{font-weight:700;color:var(--navy-800);font-size:14px;line-height:1.25}
.ponente-card .pc-rol{font-size:12.5px;color:var(--azul-700);font-weight:600}
.ponente-card .pc-esp{font-size:12.5px;color:var(--txt-mute)}
.part-filtro{position:relative;max-width:300px;flex:1;min-width:180px}
.part-filtro input{width:100%;padding:9px 12px 9px 34px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);border-radius:9px;color:var(--txt);font-size:14px}
.part-filtro input:focus{outline:none;border-color:var(--azul-600)}
.part-filtro svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:var(--txt-dim)}
.part-toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}

/* ---------- Reporte de participante (imprimible) ---------- */
.reporte{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);padding:26px;box-shadow:var(--sombra-sm)}
.reporte-cab{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:2px solid var(--navy-800);margin-bottom:18px}
.reporte-titulo h2{font-family:var(--fuente-titulo);font-size:20px;color:var(--navy-800);margin:0}
.reporte-titulo p{color:var(--txt-mute);font-size:13px;margin-top:2px}
.reporte-part{margin-bottom:16px}
.reporte-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;margin-bottom:20px}
.rep-stat{background:var(--panel-2);border:1px solid var(--linea);border-radius:12px;padding:14px;text-align:center}
.rep-stat .rep-num{display:block;font-family:var(--fuente-titulo);font-size:24px;font-weight:700;color:var(--navy-800);line-height:1}
.rep-stat .rep-lbl{font-size:12px;color:var(--txt-mute);margin-top:4px;display:block}
.reporte-pie{margin-top:18px;font-size:12px;color:var(--txt-dim);line-height:1.5;border-top:1px dashed var(--linea);padding-top:14px}
@media(max-width:560px){.reporte-stats{grid-template-columns:repeat(2,1fr)}}
@media print{
  .sidebar,.topbar,.toasts,.no-print,.offline-banner,#nav-progreso{display:none!important}
  /* Controles de pantalla que no deben imprimirse: migas/acciones, filtros, botones, paginación… */
  .barra-accion,.filtros-bar,.filtros-avz,.dash-filtro,.dash-cab .dash-filtro,.acciones-globales,.sel-bar,
  .btn,button,.paginacion-barra,.acciones-celda,.pon-actions,.kebab,.kebab-pop,.tpl-barra,.editor-ayuda{display:none!important}
  /* Sin esto, el alto fijo de html/body recorta la impresión a UNA sola página. */
  html,body{height:auto!important;overflow:visible!important}
  body{background:#fff}
  .layout,.contenido,.contenido-inner{display:block;margin:0;padding:0;max-width:none;min-height:0}
  .card{border:none;box-shadow:none;padding:0 0 14px;margin:0 0 14px}
  .grid-2,.grid-3{display:block}
  .grid-2>*,.grid-3>*{margin-bottom:14px}
  .tabla-wrap{overflow:visible;border:none}
  /* Tablas ajustadas al ancho del papel (sin recorte a la derecha) */
  table{width:100%!important;font-size:10.5px}
  th,td{white-space:normal!important;word-break:break-word;overflow-wrap:anywhere;padding:5px 6px!important}
  /* Cabeceras SIEMPRE en una línea (más chicas); los datos envuelven con normalidad */
  th{white-space:nowrap!important;font-size:9px;letter-spacing:0}
  thead{display:table-header-group}   /* repite la cabecera en cada página */
  tr{page-break-inside:avoid}
  .reporte{border:none;box-shadow:none;padding:0;margin:0}
  .reporte-tabla{font-size:12px}
  .tag{border:1px solid currentColor}
  a[href]{color:inherit;text-decoration:none}
  /* Cabecera institucional que solo aparece al imprimir (reportes del panel) */
  .print-cab{display:flex!important;align-items:center;gap:14px;padding-bottom:12px;margin-bottom:16px;border-bottom:2px solid #18255f}
  .print-cab img{height:40px;width:auto}
  .print-cab .pc-tit{font-family:var(--fuente-titulo);font-size:17px;color:#18255f;font-weight:700}
  .print-cab .pc-sub{font-size:11.5px;color:#5a6b85}
}
.print-cab{display:none}

/* ---------- Transición suave entre páginas (navegación multipágina) ---------- */
@view-transition{navigation:auto}
@media (prefers-reduced-motion:reduce){
  #nav-progreso.activo{animation:none}
  .confirm-dlg[open]{animation:none}
}

/* ---------- Control segmentado (modos de emisión) ---------- */
.segmento{display:flex;gap:4px;background:var(--panel-2);border:1px solid var(--linea-fuerte);
  border-radius:12px;padding:4px;margin-bottom:20px}
.segmento label{flex:1;text-align:center;padding:9px 8px;border-radius:9px;font-size:13.5px;font-weight:600;
  color:var(--txt-mute);cursor:pointer;transition:.15s;display:flex;align-items:center;justify-content:center;gap:7px}
.segmento label .ico-svg{width:17px;height:17px}
.segmento input{position:absolute;opacity:0;pointer-events:none}
.segmento label:hover{color:var(--navy-700)}
.segmento input:checked + span,.segmento label:has(input:checked){background:#fff;color:var(--azul-700);
  box-shadow:var(--sombra-sm)}

/* ---------- Tabla de participantes (registro directo) ---------- */
.parts{border:1px solid var(--linea);border-radius:12px;overflow:hidden}
.parts-head,.parts-fila{display:grid;grid-template-columns:0.85fr 1fr 1.5fr 1.3fr 36px;gap:10px;align-items:center}
.parts-head{padding:10px 14px;background:var(--panel-3);font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.5px;color:var(--navy-700)}
.parts-body{max-height:260px;overflow-y:auto;padding:8px}
.parts-fila{padding:4px;border-radius:9px}
/* Destello al autocompletar desde la base (confirmación visual). */
.parts-fila.fila-base{animation:fila-base-flash 1.1s ease}
@keyframes fila-base-flash{0%{background:var(--ok-bg,#e7f7ee)}100%{background:transparent}}
.parts-fila input,.parts-fila select{padding:9px 11px;font-size:14px;min-width:0;width:100%;background:#fff;border:1.5px solid var(--linea-fuerte);border-radius:9px;color:var(--txt);font-family:inherit}
.parts-fila input:focus,.parts-fila select:focus{outline:none;border-color:var(--azul-600);box-shadow:0 0 0 3px var(--acento-soft)}
.parts-quitar{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--linea-fuerte);background:#fff;
  color:var(--txt-dim);cursor:pointer;font-size:17px;display:grid;place-items:center;transition:.15s}
.parts-quitar:hover{border-color:var(--err);color:var(--err);background:var(--err-bg)}
.parts-add{margin-top:10px}

/* ---------- Zona de carga de archivo (importar) ---------- */
.dropzone{border:2px dashed var(--linea-fuerte);border-radius:14px;padding:30px 20px;text-align:center;
  background:var(--panel-2);transition:.15s;cursor:pointer;display:block}
.dropzone:hover,.dropzone.drag{border-color:var(--azul-500);background:var(--acento-soft)}
.dropzone .dz-ico{width:46px;height:46px;margin:0 auto 12px;border-radius:13px;display:grid;place-items:center;
  background:var(--azul-600);color:#fff;font-size:22px}
.dropzone .dz-ico .ico-svg{width:24px;height:24px}
.nav-toggle .ico-svg{width:22px;height:22px}
.dropzone strong{display:block;color:var(--navy-800);font-size:15px;margin-bottom:3px}
.dropzone small{color:var(--txt-dim);font-size:12.5px}
.dropzone input[type=file]{display:none}
.dz-elegido{margin-top:12px;font-size:13.5px;color:var(--ok);font-weight:600;display:none}

/* ---------- Página pública (landing) ---------- */
html{scroll-behavior:smooth}
.pub-head{background:var(--navy-800);color:#fff;position:sticky;top:0;z-index:20;box-shadow:0 1px 0 rgba(255,255,255,.06)}
.pub-head-in{max-width:1080px;margin:0 auto;padding:12px 22px;display:flex;align-items:center;gap:14px}
.pub-head .logo-img{display:block}
.pub-nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.pub-nav a.pub-link{color:#cdd9ea;font-size:14px;font-weight:600;padding:8px 12px;border-radius:8px;transition:.14s}
.pub-nav a.pub-link:hover{color:#fff;background:rgba(255,255,255,.08)}
/* En móvil el nav se reduce a lo esencial: Cursos y Verificar (+ WhatsApp). */
@media(max-width:720px){
  .pub-nav a.pub-link{display:none}
  .pub-nav a.pub-link.nav-clave{display:inline-block;padding:8px 9px;font-size:13px}
}

.pub-hero{background:var(--navy-800);color:#fff;position:relative;overflow:hidden}
/* Motivo geométrico plano (anillos de contorno), sin glows ni degradados */
.pub-hero::after{content:"";position:absolute;right:-110px;top:-110px;width:330px;height:330px;border-radius:50%;border:1.5px solid rgba(255,255,255,.07)}
.pub-hero::before{content:"";position:absolute;right:90px;bottom:-150px;width:230px;height:230px;border-radius:50%;border:1.5px solid rgba(255,255,255,.05)}
.pub-hero-in{max-width:1080px;margin:0 auto;padding:56px 22px 60px;position:relative;z-index:1}
.pub-hero h1{font-family:var(--fuente-titulo);font-size:34px;line-height:1.12;max-width:680px;font-weight:800;letter-spacing:-.5px}
.pub-hero p{color:#b9c8e6;max-width:600px;margin-top:13px;font-size:15.5px;line-height:1.6}
.pub-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.pub-hero-chips{display:flex;gap:20px;flex-wrap:wrap;margin-top:28px;color:#9fb2d6;font-size:13.5px}
.pub-hero-chips span{display:inline-flex;align-items:center;gap:7px}
.pub-hero-chips svg{width:16px;height:16px;color:var(--azul-400)}
.btn-translucido{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.28)}
.btn-translucido:hover{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.45)}
.pub-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);
  color:#d4e2f5;font-size:12.5px;font-weight:600;padding:6px 14px;border-radius:30px;margin-bottom:20px}
.pub-eyebrow svg{width:15px;height:15px;color:var(--azul-400)}
.pub-hero-art{display:none}
@media(min-width:900px){
  .pub-hero-in{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:44px}
  .pub-hero-art{display:block}
  .pub-hero h1{font-size:38px}
}
.hero-card{background:#fff;color:var(--txt);border-radius:18px;padding:22px;max-width:350px;margin-left:auto;
  box-shadow:0 30px 70px rgba(6,12,40,.42);position:relative}
.hero-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.hc-badge{display:inline-flex;align-items:center;gap:7px;background:var(--ok-bg);color:var(--ok);font-weight:700;font-size:12.5px;padding:6px 12px;border-radius:30px}
.hc-badge svg{width:15px;height:15px}
.hc-qr{width:48px;height:48px;border-radius:11px;background:var(--navy-800);color:#fff;display:grid;place-items:center;flex-shrink:0}
.hc-qr svg{width:28px;height:28px}
.hc-rows{display:flex;flex-direction:column}
.hc-row{display:flex;justify-content:space-between;gap:14px;font-size:13px;padding:9px 0;border-bottom:1px dashed var(--linea)}
.hc-row span{color:var(--txt-mute)}
.hc-row b{color:var(--navy-800);font-weight:600;text-align:right}
.hc-foot{display:flex;align-items:center;gap:8px;margin-top:14px;color:var(--txt-dim);font-size:12px}
.hc-foot svg{width:15px;height:15px;color:var(--ok)}

.pub-sec{max-width:1080px;margin:0 auto;padding:48px 22px;scroll-margin-top:68px}
.pub-sec-tit{font-family:var(--fuente-titulo);color:var(--navy-800);font-size:24px;margin-bottom:4px;font-weight:700}
.pub-sec-sub{color:var(--txt-mute);font-size:14.5px;margin-bottom:24px}

.curso-pub{background:#fff;border:1px solid var(--linea);border-radius:16px;padding:20px;box-shadow:var(--sombra-sm);display:flex;flex-direction:column;transition:transform .16s,box-shadow .16s,border-color .16s}
.curso-pub:hover{box-shadow:var(--sombra);border-color:var(--azul-400);transform:translateY(-3px)}
.curso-pub .fechas{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;background:var(--acento-soft);color:var(--azul-700);font-weight:700;font-size:12.5px;padding:5px 11px;border-radius:20px}
.curso-pub .fechas svg{width:14px;height:14px}
.curso-pub h3{font-family:var(--fuente-titulo);color:var(--navy-800);font-size:17px;margin:13px 0 8px;line-height:1.25}
.curso-pub .desc{color:var(--txt-mute);font-size:13.5px;line-height:1.55;margin-bottom:14px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.curso-pub .meta{color:var(--txt-mute);font-size:13px;display:flex;flex-direction:column;gap:9px;
  border-top:1px solid var(--linea);padding-top:14px}
.curso-pub .meta>span{display:flex;align-items:flex-start;gap:9px}
.curso-pub .meta svg{width:15px;height:15px;color:var(--azul-600);flex-shrink:0;margin-top:1.5px}
.curso-pub .meta strong{color:var(--navy-800);font-weight:600}
.curso-pub-foot{margin-top:16px}
/* Cabecera de la tarjeta de curso: fecha + modalidad */
.curso-pub-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:2px}
.curso-mod{display:inline-flex;align-items:center;gap:6px;background:#eef3fb;color:var(--navy-800);font-weight:600;font-size:12px;padding:5px 10px;border-radius:20px}
.curso-mod svg{width:13px;height:13px;color:var(--azul-600)}
/* Sección de beneficios (página pública) */
.pub-features{background:#fff;border-bottom:1px solid var(--linea)}
.pub-features-in{max-width:1080px;margin:0 auto;padding:40px 22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:22px}
.feature-card .fc-ico{width:46px;height:46px;border-radius:13px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;margin-bottom:12px}
.feature-card .fc-ico svg{width:23px;height:23px}
.feature-card h3{font-family:var(--fuente-titulo);color:var(--navy-800);font-size:16px;margin-bottom:5px;font-weight:700}
.feature-card p{color:var(--txt-mute);font-size:13.5px;line-height:1.55}
/* Encabezado de sección + contador */
.pub-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.pub-count{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 8px;border-radius:20px;background:var(--acento-soft);color:var(--azul-700);font-size:14px;font-weight:700;vertical-align:2px}
/* Estado vacío de cursos */
.cursos-vacio{text-align:center;background:#fff;border:1px dashed var(--linea-fuerte);border-radius:18px;padding:46px 26px;max-width:560px;margin:0 auto}
.cursos-vacio .cv-ico{width:64px;height:64px;border-radius:50%;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;margin:0 auto 16px}
.cursos-vacio .cv-ico svg{width:30px;height:30px}
.cursos-vacio h3{font-family:var(--fuente-titulo);color:var(--navy-800);font-size:18px;margin-bottom:8px}
.cursos-vacio p{color:var(--txt-mute);font-size:14px;line-height:1.6;max-width:420px;margin:0 auto 18px}
/* Servicios (página pública) */
.servicios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:18px}
.servicio-card{background:#fff;border:1px solid var(--linea);border-radius:16px;padding:22px;box-shadow:var(--sombra-sm);transition:transform .16s,box-shadow .16s,border-color .16s;display:block;color:var(--txt)}
a.servicio-card:hover{box-shadow:var(--sombra);border-color:var(--azul-400);transform:translateY(-3px)}
.servicio-card .sv-ico{width:50px;height:50px;border-radius:14px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;margin-bottom:14px}
.servicio-card .sv-ico svg{width:25px;height:25px}
.servicio-card h3{font-family:var(--fuente-titulo);color:var(--navy-800);font-size:16.5px;margin-bottom:6px;font-weight:700}
.servicio-card p{color:var(--txt-mute);font-size:13.5px;line-height:1.55}
.servicio-card .sv-mas{display:inline-block;margin-top:6px;color:var(--azul-700);font-weight:600}
.servicios-cta{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:26px;padding:20px 24px;background:var(--acento-soft);border-radius:16px;text-align:center}
.servicios-cta span{color:var(--navy-800);font-weight:600;font-size:15px}

.btn-wa{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#25d366;color:#fff;border:none;border-radius:10px;padding:11px 16px;font-weight:700;font-size:14px;font-family:inherit;cursor:pointer;transition:.14s;width:100%}
.btn-wa:hover{background:#1eb858;color:#fff}
.btn-wa svg{width:18px;height:18px;fill:currentColor}
.pub-head .btn-wa{width:auto;padding:9px 15px;font-size:13.5px}

/* align-items:start = cada tarjeta con su altura natural (sin estirarse a la más
   alta de la fila): así ninguna queda con espacio vacío por dentro. */
.cursos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:20px;align-items:start}
/* Tarjeta de curso: badge tipo calendario + chips de estado */
.curso-pub-top{display:flex;gap:14px;align-items:flex-start;margin-bottom:12px}
.cfb{flex-shrink:0;width:56px;border:1.5px solid var(--linea-fuerte);border-radius:12px;overflow:hidden;text-align:center;background:#fff}
.cfb-dia{display:block;font-family:var(--fuente-titulo);font-weight:800;font-size:21px;color:var(--navy-800);padding:5px 0 2px;line-height:1.15}
.cfb-mes{display:block;background:var(--azul-600);color:#fff;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:3px 0}
.curso-pub-tit{min-width:0;flex:1}
.curso-pub-chips{display:flex;flex-wrap:wrap;gap:6px}
.curso-pub-tit h3{margin:7px 0 0}
.chip-estado{font-size:11.5px;font-weight:700;padding:3.5px 10px;border-radius:20px}
.chip-estado.pronto{background:#fbf0cf;color:#8a5a00}
.chip-estado.en-curso{background:var(--ok-bg);color:var(--ok)}
.curso-pub .meta-cert svg{color:var(--ok)}
/* Banda de cifras de confianza (entre features y servicios) */
.pub-stats{background:var(--navy-800);color:#fff;padding:32px 22px}
.pub-stats-in{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:center}
.ps-item b{display:block;font-family:var(--fuente-titulo);font-weight:800;font-size:33px;line-height:1.15}
.ps-item span{color:#cdd9ea;font-size:13.5px;font-weight:600}
@media(max-width:640px){.pub-stats{padding:24px 18px}.pub-stats-in{gap:12px}.ps-item b{font-size:24px}.ps-item span{font-size:12px}}
.pub-verif-wrap{background:#eef4fb;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.verif-box .vb-ico{width:54px;height:54px;border-radius:15px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;margin:0 auto 14px}
.verif-box .vb-ico svg{width:26px;height:26px}
.verif-box{background:#fff;border:1px solid var(--linea);border-radius:18px;padding:34px 30px;box-shadow:var(--sombra);max-width:620px;margin:0 auto;text-align:center}
.verif-box form{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;max-width:500px;margin-left:auto;margin-right:auto}
.verif-box input{flex:1;min-width:0;padding:13px 15px;border:1.5px solid var(--linea-fuerte);border-radius:10px;font-size:15px;font-family:var(--fuente-mono);background:#fff}
.verif-box input:focus{outline:none;border-color:var(--azul-600)}

.pub-contacto{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:16px}
.contacto-card{display:flex;align-items:flex-start;gap:13px;background:#fff;border:1px solid var(--linea);border-radius:14px;padding:18px;box-shadow:var(--sombra-sm);color:var(--txt)}
.contacto-card .cc-ico{width:44px;height:44px;border-radius:12px;background:var(--acento-soft);color:var(--azul-700);display:grid;place-items:center;flex-shrink:0}
.contacto-card .cc-ico svg{width:20px;height:20px}
.ico-brand{fill:currentColor}
.contacto-card .cc-k{font-size:11.5px;color:var(--txt-dim);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.contacto-card .cc-v{color:var(--navy-800);font-weight:600;font-size:14px;margin-top:3px;line-height:1.45;word-break:break-word}
a.contacto-card:hover{border-color:var(--azul-400);box-shadow:var(--sombra)}
a.contacto-card:hover .cc-v{color:var(--azul-700)}

.pub-foot{background:var(--navy-900);color:#9fb2d6}
.pub-foot-in{max-width:1080px;margin:0 auto;padding:30px 22px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.pub-foot-in strong{color:#fff;font-family:var(--fuente-titulo);font-size:15px}
.pub-foot-in small{display:block;color:#6c7fa6;font-size:12px;margin-top:4px;max-width:420px;line-height:1.5}
.pub-foot .soc{display:flex;gap:10px}
.pub-foot .soc a{width:40px;height:40px;border-radius:11px;background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;transition:.14s}
.pub-foot .soc a:hover{background:var(--azul-600)}
.pub-foot .soc svg{width:19px;height:19px;fill:currentColor}

/* ---------- Verificación pública ---------- */
.verif-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;
  background:#eef4fb}
.verif-card{width:100%;max-width:600px;background:var(--panel);border:1px solid var(--linea);
  border-radius:22px;overflow:hidden;box-shadow:var(--sombra)}
.verif-marca{display:flex;align-items:center;gap:12px;padding:16px 28px;background:var(--navy-800);color:#fff}
.verif-marca strong{font-family:var(--fuente-titulo);font-size:15px}
.verif-marca span{display:block;font-size:11px;color:#9fb2d6;text-transform:uppercase;letter-spacing:.04em}
.verif-marca-cap{margin-left:auto;font-size:11px;color:#9fb2d6;text-transform:uppercase;letter-spacing:.05em;text-align:right}
.verif-hero{padding:32px 30px 24px;text-align:center}
.verif-hero.ok{background:rgba(34,160,94,.05)}
.verif-hero.err{background:rgba(214,69,69,.045)}
.verif-hero.info{background:rgba(31,127,209,.045)}
.verif-estado{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px}
.verif-estado svg{width:38px;height:38px}
.verif-estado.ok{background:var(--ok-bg);color:var(--ok);box-shadow:0 0 0 7px rgba(34,160,94,.08)}
.verif-estado.err{background:var(--err-bg);color:var(--err);box-shadow:0 0 0 7px rgba(214,69,69,.07)}
.verif-estado.info{background:var(--acento-soft);color:var(--azul-600);box-shadow:0 0 0 7px rgba(31,127,209,.07)}
.verif-eyebrow{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.09em}
.verif-eyebrow.ok{color:var(--ok)}
.verif-eyebrow.err{color:var(--err)}
.verif-eyebrow.info{color:var(--azul-600)}
.verif-tipo{display:inline-block;margin-top:10px;padding:5px 15px;border-radius:20px;background:var(--acento-soft);
  color:var(--azul-700);font-weight:700;font-size:13px;font-family:var(--fuente-titulo)}
.verif-otorga{color:var(--txt-mute);font-size:12.5px;margin-top:16px}
.verif-nombre{font-family:var(--fuente-titulo);font-size:23px;font-weight:700;color:var(--navy-800);line-height:1.22;margin-top:3px;word-break:break-word}
.verif-curso{color:var(--azul-700);font-weight:600;font-size:15px;margin-top:7px;line-height:1.35;
  max-width:440px;margin-left:auto;margin-right:auto}
.verif-emisor{color:var(--txt-mute);font-size:12.5px;margin-top:12px}
.verif-msg{color:var(--txt-mute);font-size:13.5px;margin-top:8px;max-width:430px;margin:8px auto 0;line-height:1.5}
.verif-body{padding:6px 30px 26px}
.verif-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 24px;margin:18px 0 20px;
  border-top:1px solid var(--linea);padding-top:22px}
.vg-item{display:flex;align-items:flex-start;gap:11px;min-width:0}
.vg-item>svg{width:18px;height:18px;color:var(--azul-500);flex-shrink:0;margin-top:2px}
.vg-k{display:block;font-size:11px;color:var(--txt-mute);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}
.vg-v{display:block;font-weight:600;font-size:14px;color:var(--navy-800);word-break:break-word;line-height:1.35}
.verif-sello{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:16px;
  color:var(--txt-dim);font-size:12px}
.verif-sello svg{width:15px;height:15px;color:var(--ok)}
.verif-acciones{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.verif-acciones .btn{flex:1;min-width:150px;justify-content:center}
/* Constancia imprimible: la página de verificación en papel, sin controles */
@media print{
  .verif-wrap{background:#fff!important;min-height:0;padding:0;display:block}
  .verif-card{box-shadow:none;border:1px solid #999;max-width:100%;border-radius:0}
  .verif-marca{background:var(--navy-800)!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}
  .verif-acciones,.verif-buscar,.verif-foot{display:none!important}
}
.verif-buscar{display:flex;gap:10px;margin-top:18px}
.verif-buscar input{flex:1;padding:12px 14px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);
  border-radius:10px;color:var(--txt);font-family:inherit;font-size:14.5px}
.verif-foot{padding:18px 30px;text-align:center;border-top:1px solid var(--linea);color:var(--txt-dim);font-size:12px;background:var(--panel-2)}
@media(max-width:560px){
  .verif-marca,.verif-hero,.verif-body,.verif-foot{padding-left:20px;padding-right:20px}
  .verif-grid{grid-template-columns:1fr;gap:15px}
  .verif-nombre{font-size:20px}
  .verif-buscar{flex-direction:column}
  .verif-marca-cap{display:none}
}

/* ---------- Editor de plantilla ---------- */
.editor-layout{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start}
.editor-layout>*{min-width:0}/* permite que las columnas se encojan en móvil (evita desborde horizontal) */
.lienzo-col{display:flex;flex-direction:column;gap:8px;min-width:0}
/* Espacio de trabajo: fondo punteado (estilo herramienta de diseño) con el lienzo flotando */
.lienzo-wrap{position:relative;border:1px solid var(--linea);border-radius:var(--radio);overflow:auto;
  background:#e9eef5;background-image:radial-gradient(rgba(24,37,95,.13) 1px,transparent 1px);background-size:18px 18px;
  box-shadow:inset 0 1px 4px rgba(22,36,94,.06);max-height:76vh;padding:22px}
.lienzo{position:relative;width:100%;display:block;margin:0 auto;background:#fff;
  box-shadow:0 10px 30px rgba(22,36,94,.18),0 2px 6px rgba(22,36,94,.10);border-radius:3px}
.lienzo img{width:100%;display:block;user-select:none;-webkit-user-drag:none;border-radius:3px}
.campo-arrastrable{position:absolute;transform:translate(-50%,-50%);cursor:move;white-space:nowrap;
  padding:2px 6px;border:1px dashed rgba(31,127,209,.55);background:rgba(31,127,209,.08);border-radius:4px;
  font-size:12px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.55);transition:border-color .1s,background .1s}
.campo-arrastrable:hover{border-color:rgba(31,127,209,.9);background:rgba(31,127,209,.14)}
.campo-arrastrable.sel{border-style:solid;border-color:var(--azul-600);background:rgba(31,127,209,.12);box-shadow:0 0 0 2px var(--acento-soft)}
.campo-arrastrable.es-qr{width:60px;height:60px;display:grid;place-items:center;background:rgba(255,255,255,.9);color:#000;border-color:var(--navy-700)}
.campo-arrastrable.es-linea{padding:0;border:none;background:var(--azul-600)}
.campo-arrastrable.es-linea.sel{outline:2px solid var(--azul-600);outline-offset:3px;box-shadow:none}
.campo-arrastrable.es-imagen{background:rgba(31,127,209,.05)}
.campo-arrastrable.es-imagen.sel{outline:2px solid var(--azul-600);outline-offset:2px;box-shadow:none}
.campo-arrastrable.es-imagen img{pointer-events:none}
/* Espacio de firma (referencia): "Aquí va la firma" + línea + nombre + cargo */
.campo-arrastrable.es-firma{position:absolute;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 10px 4px;
  background:rgba(31,127,209,.06);border-style:dashed;text-shadow:none;color:var(--navy-800);line-height:1.15}
.campo-arrastrable.es-firma.sel{outline:2px solid var(--azul-600);outline-offset:2px;box-shadow:none}
.campo-arrastrable.es-firma .fs-num{position:absolute;top:-9px;right:-6px;font-size:10px;font-weight:700;color:#fff;
  background:var(--azul-600);border-radius:20px;padding:1px 7px}
.campo-arrastrable.es-firma .fs-top{font-size:11px;font-style:italic;color:var(--azul-700);opacity:.85}
.campo-arrastrable.es-firma .fs-linea{display:block;width:100%;min-width:70px;height:2px;background:#18255f;margin:3px 0 2px}
.campo-arrastrable.es-firma .fs-nombre{font-size:12px;font-weight:700;color:var(--navy-800)}
.campo-arrastrable.es-firma .fs-cargo{font-size:11px;color:var(--txt-mute)}
/* Tiradores de redimensión (esquinas / extremos) del campo seleccionado */
.rz-handle{position:absolute;width:11px;height:11px;background:#fff;border:1.5px solid var(--azul-600);border-radius:2px;z-index:12;box-shadow:0 1px 3px rgba(0,0,0,.35)}
.rz-nw{top:-6px;left:-6px;cursor:nwse-resize}
.rz-ne{top:-6px;right:-6px;cursor:nesw-resize}
.rz-sw{bottom:-6px;left:-6px;cursor:nesw-resize}
.rz-se{bottom:-6px;right:-6px;cursor:nwse-resize}
.rz-e{top:50%;right:-6px;margin-top:-5.5px;cursor:ew-resize}
.rz-w{top:50%;left:-6px;margin-top:-5.5px;cursor:ew-resize}
.rz-badge{position:absolute;top:-23px;left:50%;transform:translateX(-50%);background:var(--navy-800);color:#fff;
  font-size:10.5px;line-height:1.5;padding:1px 7px;border-radius:4px;white-space:nowrap;z-index:13;pointer-events:none;font-family:var(--fuente-mono)}
.guia-centro{position:absolute;top:0;bottom:0;left:50%;width:1px;background:repeating-linear-gradient(180deg,var(--azul-500),var(--azul-500) 6px,transparent 6px,transparent 12px);pointer-events:none;z-index:5}
.guia-linea{position:absolute;pointer-events:none;z-index:6}
.guia-v{top:0;bottom:0;width:1px;transform:translateX(-50%);background:repeating-linear-gradient(180deg,#e0457a,#e0457a 6px,transparent 6px,transparent 12px)}
.guia-h{left:0;right:0;height:1px;transform:translateY(-50%);background:repeating-linear-gradient(90deg,#e0457a,#e0457a 6px,transparent 6px,transparent 12px)}
.editor-panel{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);padding:20px 20px 0;position:sticky;top:88px;
  box-shadow:var(--sombra-sm);max-height:calc(100vh - 150px);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column}
.editor-panel>.ed-tab-panel{flex:1 0 auto}
.editor-panel>.ed-accion{margin-top:auto}
.editor-panel h3{font-family:var(--fuente-titulo);font-size:14px;margin-bottom:12px;color:var(--navy-800)}
.campos-count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-left:4px;border-radius:20px;
  background:var(--acento-soft);color:var(--azul-700);font-size:11.5px;font-weight:700;vertical-align:1px}
.lista-vacia{text-align:center;color:var(--txt-dim);font-size:12px;line-height:1.6;padding:16px 10px;
  border:1.5px dashed var(--linea-fuerte);border-radius:9px;background:var(--panel-2)}

/* Ayuda desplegable del editor */
.editor-ayuda{background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);margin-bottom:14px;box-shadow:var(--sombra-sm)}
.editor-ayuda summary{display:flex;align-items:center;gap:9px;padding:12px 16px;cursor:pointer;list-style:none;
  font-weight:600;font-size:13.5px;color:var(--navy-800);user-select:none}
.editor-ayuda summary::-webkit-details-marker{display:none}
.editor-ayuda summary .ico-svg{color:var(--azul-600);width:17px;height:17px}
.editor-ayuda .ea-mas{margin-left:auto;font-size:12px;font-weight:600;color:var(--azul-700)}
.editor-ayuda[open] .ea-mas{display:none}
.editor-ayuda .ea-cuerpo{padding:0 16px 14px;border-top:1px dashed var(--linea)}
.editor-ayuda .ea-cuerpo p{color:var(--txt-mute);font-size:13px;line-height:1.6;margin:10px 0 0}
.lista-campos{display:flex;flex-direction:column;gap:6px}
.item-campo{display:flex;align-items:center;gap:8px;padding:9px 11px;background:var(--panel-2);border:1.5px solid var(--linea-fuerte);
  border-radius:9px;font-size:12.5px;cursor:pointer;transition:.13s}
.item-campo:hover{border-color:var(--azul-500)}
.item-campo.sel{border-color:var(--azul-600);background:var(--acento-soft)}
.item-campo .quitar{margin-left:auto;color:var(--txt-dim);cursor:pointer}
.item-campo .quitar:hover{color:var(--err)}
.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mini-grid .campo{margin-bottom:0}
.mini-grid label{font-size:11px}
.mini-grid input,.mini-grid select{padding:8px 9px;font-size:12.5px}
/* Editor: grupos de propiedades + chips de variable + edición inline */
.prop-grupo{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--linea)}
.prop-grupo:last-of-type{border-bottom:0;padding-bottom:0}
.prop-grupo>h4{font-family:var(--fuente-titulo);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--azul-700);margin:0 0 10px}

/* ----- Editor: barra del lienzo, zoom y cuadrícula ----- */
.lienzo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);padding:7px 10px;box-shadow:var(--sombra-sm)}
.lz-grupo{display:flex;align-items:center;gap:6px}
.lz-zoom{min-width:46px;text-align:center;font-weight:700;font-size:12.5px;color:var(--navy-800);font-variant-numeric:tabular-nums}
#btn-snap.activo{background:var(--acento-soft);border-color:var(--azul-400);color:var(--azul-700)}
/* Cuadrícula visible cuando el imán está activo */
.lienzo.con-grid::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;
  background-image:linear-gradient(to right,rgba(31,127,209,.18) 1px,transparent 1px),linear-gradient(to bottom,rgba(31,127,209,.18) 1px,transparent 1px);
  background-size:2.5% 2.5%}

/* ----- Editor: paleta para agregar campos ----- */
.paleta{margin-bottom:16px}
.paleta-grupo-tit{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--txt-mute);margin:10px 0 6px}
.paleta-grupo-tit:first-child{margin-top:0}
.paleta-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pal-btn{display:flex;align-items:center;gap:7px;padding:8px 9px;border:1.5px solid var(--linea-fuerte);border-radius:9px;
  background:var(--panel-2);color:var(--navy-800);font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;text-align:left;
  transition:.12s;min-width:0}
.pal-btn:hover{border-color:var(--azul-500);background:var(--acento-soft);color:var(--azul-700)}
.pal-btn svg{width:15px;height:15px;flex-shrink:0;color:var(--azul-600)}
.pal-btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ----- Editor: fila de giro (número + girar 90°) ----- */
.giro-fila{display:flex;gap:6px;align-items:stretch}
.giro-fila input{flex:1;min-width:0}
.giro-fila .btn{white-space:nowrap;padding:6px 9px}

/* ----- Editor: alinear ----- */
.alinear{display:flex;align-items:center;gap:6px;margin-top:8px}
.alinear .alinear-lbl{font-size:11px;color:var(--txt-mute);width:66px;flex-shrink:0}
.alinear .btn{flex:1;padding:6px 4px;display:inline-flex;align-items:center;justify-content:center}
.alinear .btn .ico-svg{width:14px;height:14px}

/* ----- Editor: ícono en la lista de campos ----- */
.item-campo-ico{width:15px;height:15px;flex-shrink:0;color:var(--azul-600)}
.item-campo.sel .item-campo-ico{color:var(--azul-700)}
.item-campo.arrastrando{opacity:.45}
.item-campo.drop-aqui{border-color:var(--azul-600);box-shadow:0 0 0 2px var(--acento-soft)}
.item-campo .mover,.item-campo .quitar{display:inline-flex;align-items:center;cursor:pointer;padding:0 3px;color:var(--txt-dim)}
.item-campo .mover:hover{color:var(--azul-700)}
.item-campo .mover svg,.item-campo .quitar svg{width:13px;height:13px;display:block}
.item-campo .lock-off{opacity:.4}
.item-campo .lock-on{color:var(--warn);opacity:1}

/* ----- Editor: pestañas del panel (Agregar / Capas / Ajustes) ----- */
.ed-tabs{display:flex;gap:4px;background:var(--panel-2);border:1px solid var(--linea);border-radius:11px;padding:4px;margin-bottom:14px;flex-shrink:0}
.ed-tab{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 4px;border:0;background:none;
  border-radius:8px;font-family:var(--fuente);font-size:12.5px;font-weight:600;color:var(--txt-mute);cursor:pointer;white-space:nowrap}
.ed-tab .ico-svg{width:14px;height:14px}
.ed-tab:hover{color:var(--azul-700)}
.ed-tab.activo{background:var(--panel);color:var(--navy-800);box-shadow:0 1px 3px rgba(24,37,95,.14)}
.ed-tab .campos-count{margin-left:0}
.ed-tab-panel[hidden]{display:none!important}
.ed-tab-hint{font-size:12px;color:var(--txt-dim);line-height:1.5;margin-bottom:12px}

/* ----- Editor: estado vacío de Ajustes ----- */
.props-vacio{border:1.5px dashed var(--linea-fuerte);border-radius:11px;padding:26px 14px;text-align:center;color:var(--txt-dim)}
.props-vacio svg{width:26px;height:26px;margin-bottom:8px;color:var(--azul-500)}
.props-vacio p{font-size:12.5px;line-height:1.55;margin:0}

/* ----- Editor: cabecera del campo seleccionado ----- */
.props-head{display:flex;align-items:center;gap:6px;padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid var(--linea)}
.props-titulo{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-family:var(--fuente-titulo);font-size:13px;font-weight:700;color:var(--navy-800)}
.btn-ico-sm{width:30px;height:30px;padding:0;display:inline-grid;place-items:center;flex-shrink:0}
.btn-ico-sm .ico-svg{width:14px;height:14px}
.btn-ico-sm:disabled{opacity:.45;cursor:not-allowed}
.btn-ico-peligro:hover:not(:disabled){border-color:var(--err);color:var(--err);background:var(--err-bg)}
#btn-lock .ico-lock{display:none}
#btn-lock.activo .ico-lock{display:block}
#btn-lock.activo .ico-unlock{display:none}
#btn-lock.activo{border-color:var(--warn);color:var(--warn);background:var(--warn-bg)}

/* ----- Editor: pie de acciones fijo del panel ----- */
.ed-accion{position:sticky;bottom:0;z-index:5;background:var(--panel);border-top:1px solid var(--linea);
  margin:14px -20px 0;padding:12px 20px 14px;display:flex;flex-direction:column;gap:8px;flex-shrink:0}
.ed-accion-fila{display:flex;gap:8px;align-items:stretch}
.ed-accion-fila .btn-ico-sm{width:40px;height:auto;min-height:36px}
.ed-accion select{flex:1;min-width:0;padding:8px 9px;font-size:12.5px;font-family:inherit;color:var(--txt);
  border:1.5px solid var(--linea-fuerte);border-radius:9px;background:var(--panel)}
.ed-accion .btn{white-space:nowrap}

/* ----- Editor: atajos en la pestaña Agregar ----- */
.atajos-editor{margin-top:14px;padding:11px 12px;background:var(--panel-2);border:1px solid var(--linea);border-radius:11px;
  font-size:11.5px;color:var(--txt-dim);line-height:1.7}
.atajos-editor .atajos-tit{display:flex;align-items:center;gap:6px;font-weight:700;color:var(--navy-800);margin-bottom:4px}
.atajos-editor .atajos-tit .ico-svg{width:13px;height:13px;color:var(--azul-600)}

/* ----- Plantillas: selector de contenido inicial ----- */
.pl-contenido{display:flex;gap:8px;flex-wrap:wrap}
.pl-contenido .check{flex:1;justify-content:center;min-width:110px}

/* ----- Editor: barra de borrador sin guardar ----- */
.draft-bar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.draft-bar .draft-txt{flex:1;min-width:0}
.draft-bar>.ico-svg{flex-shrink:0;color:var(--azul-700)}
.draft-bar .btn{flex-shrink:0}

/* ----- Editor: modal de vista previa en vivo ----- */
dialog.modal-prev{max-width:min(960px,94vw)}
.prev-barra{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.prev-lados{display:flex;gap:6px}
.prev-lados .btn.activo{background:var(--azul-600);border-color:var(--azul-600);color:#fff}
.prev-curso-lbl{display:flex;align-items:center;gap:8px;margin-left:auto;font-size:12.5px;color:var(--txt-mute);font-weight:600}
.prev-curso-lbl select{padding:7px 9px;font-size:12.5px;font-family:inherit;color:var(--txt);
  border:1.5px solid var(--linea-fuerte);border-radius:9px;background:var(--panel);max-width:260px}
.prev-zona{display:grid;place-items:center;min-height:320px;background:var(--panel-2);
  border:1px solid var(--linea);border-radius:11px;padding:14px}
.prev-zona img{max-width:100%;max-height:62vh;border:1px solid var(--linea);border-radius:6px;
  box-shadow:0 6px 24px rgba(15,25,68,.14);background:#fff}
.prev-cargando{display:flex;align-items:center;gap:10px;color:var(--txt-mute);font-size:13.5px;font-weight:600}
.prev-nota{margin-top:10px;font-size:12px;color:var(--txt-dim);line-height:1.55}

/* ----- Selectores de color coherentes con el resto de inputs ----- */
.campo input[type=color]{height:36px;padding:3px 4px;cursor:pointer}
input[type=color]::-webkit-color-swatch-wrapper{padding:0}
input[type=color]::-webkit-color-swatch{border:0;border-radius:6px}
input[type=color]::-moz-color-swatch{border:0;border-radius:6px}

/* ----- Editor: selección múltiple y campos bloqueados ----- */
.campo-arrastrable.msel{border-style:solid;border-color:var(--azul-500);box-shadow:0 0 0 2px rgba(31,127,209,.25)}
.campo-arrastrable.bloqueado{cursor:default;border-color:rgba(120,132,155,.55);background:rgba(120,132,155,.07)}
.lz-multi{background:var(--acento-soft);border:1px solid var(--azul-400);border-radius:9px;padding:3px 8px}
.lz-multi-n{font-size:12px;color:var(--azul-700);font-weight:600;margin-right:2px;white-space:nowrap}
#btn-reglas.activo,#btn-lock.activo{background:var(--acento-soft);border-color:var(--azul-400);color:var(--azul-700)}

/* ----- Editor: franja del "Ancho máx." + punto de anclaje del campo seleccionado ----- */
.zona-ancho{position:absolute;pointer-events:none;z-index:3;background:rgba(31,127,209,.12);
  border-left:2px dashed rgba(31,127,209,.85);border-right:2px dashed rgba(31,127,209,.85);border-radius:2px}
.zona-ancla{position:absolute;top:-8px;transform:translateX(-50%);width:0;height:0;
  border-left:5px solid transparent;border-right:5px solid transparent;border-top:7px solid var(--azul-600)}

/* ----- Editor: reglas con medidas (cm) ----- */
.reglas{position:absolute;inset:0;pointer-events:none;z-index:5;font-family:var(--fuente-mono)}
.regla-t{position:absolute;font-size:9.5px;color:var(--azul-700);background:rgba(255,255,255,.88);
  padding:0 3px;border-radius:3px;line-height:1.5}
.regla-top{top:2px;transform:translateX(-50%)}
.regla-top::after{content:"";position:absolute;left:50%;top:-2px;width:1px;height:2px;background:var(--azul-600)}
.regla-izq{left:2px;transform:translateY(-50%)}
.regla-cap{position:absolute;right:6px;bottom:5px;font-size:10px;color:var(--navy-800);font-weight:700;
  background:rgba(255,255,255,.9);padding:2px 8px;border-radius:5px;border:1px solid var(--linea)}
.var-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.var-chip{border:1px solid var(--linea-fuerte);background:var(--panel-2);color:var(--azul-700);font-family:var(--fuente-mono);
  font-size:11px;padding:3px 8px;border-radius:6px;cursor:pointer;transition:.12s}
.var-chip:hover{background:var(--acento-soft);border-color:var(--azul-400)}
.campo-arrastrable.editando{cursor:text;background:#fff;color:#15223f;text-shadow:none;
  outline:2px solid var(--azul-600);outline-offset:1px;z-index:20;min-width:40px}

/* ---------- Emisión ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.preview-box{border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;background:#f0f4f9;min-height:200px;display:grid;place-items:center}
.preview-box img{width:100%;display:block}
.preview-box .placeholder{color:var(--txt-dim);padding:40px;text-align:center}

/* ---------- Responsive (móvil / tablet / laptop / PC) ---------- */
.nav-toggle,.nav-cerrar{display:none}
.nav-backdrop{display:none}
.topbar-izq{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.topbar-izq h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar-accion{display:flex;align-items:center;gap:10px;flex-shrink:0}
.topbar-accion form{display:inline-flex;margin:0}

/* Tablet y menor: el menú lateral se vuelve un cajón deslizable */
@media(max-width:1023px){
  .sidebar{position:fixed;top:0;left:0;width:280px;height:100dvh;transform:translateX(-100%);
    transition:transform .25s ease;z-index:60;box-shadow:0 0 50px rgba(0,0,0,.4)}
  body.nav-abierto .sidebar{transform:none}
  .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(15,25,68,.55);backdrop-filter:blur(2px);
    z-index:55;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
  body.nav-abierto .nav-backdrop{opacity:1;visibility:visible}
  .contenido{width:100%}
  .nav-toggle{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:10px;flex-shrink:0;
    border:1.5px solid var(--linea-fuerte);background:#fff;color:var(--navy-800);cursor:pointer}
  .nav-toggle:hover{background:var(--panel-2);border-color:var(--azul-400);color:var(--azul-700)}
  .nav-cerrar{display:block;margin-left:auto;background:none;border:none;color:#9fb2d6;font-size:28px;
    line-height:1;cursor:pointer;padding:0 6px}
  .nav-cerrar:hover{color:#fff}
  /* Contraer es solo para escritorio: en el cajón móvil no aplica */
  .nav-colapsar{display:none}
}

/* Tablet vertical / móvil grande */
@media(max-width:860px){
  .topbar{flex-wrap:wrap;padding:14px 16px;gap:10px 12px}
  /* Los botones de acción van a su propia fila (todo el ancho), compactos, alineados
     a la izquierda y con salto de línea — sirve igual para 1 botón o para varios. */
  .topbar-accion{display:flex;gap:8px;flex-wrap:wrap;align-items:center;width:100%;justify-content:flex-start}
  .topbar-accion form{display:inline-flex;margin:0!important}
  .contenido-inner{padding:16px}
  .grid-2,.grid-3,.split,.editor-layout{grid-template-columns:1fr}
  .editor-panel{position:static}
  .card{padding:18px}
  /* El topbar se parte en varias filas: la barra de filtros no se fija (evita solapes) */
  .tpl-barra{position:static}
}

/* Móvil estrecho: las propiedades del editor en una sola columna (no se aprietan) */
@media(max-width:480px){
  .mini-grid{grid-template-columns:1fr}
}

/* Móvil */
@media(max-width:560px){
  body{font-size:14.5px}
  .topbar h1{font-size:19px}
  .metricas{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .metrica{padding:16px;gap:12px}
  .metrica .valor{font-size:25px}
  .metrica .etq{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .metrica .m-ico{width:40px;height:40px}
  .contenido-inner{padding:13px}
  .card{padding:15px;border-radius:14px}
  /* El botón de la barra superior queda compacto (antes se estiraba a todo el ancho). */
  .topbar-accion .btn{flex:0 0 auto}
  .grid-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .modal-body{padding:18px;max-height:76vh}
  .modal-head,.modal-foot{padding:14px 18px}
  /* Asistente de emisión: pasos compactos (solo número, texto del paso activo) */
  .wz-pasos{padding:12px 16px 0}
  .wz-paso-txt{display:none}
  .wz-paso.activo .wz-paso-txt{display:inline}
  .wz-tipo-doc{margin:8px 0 0;min-width:0;width:100%}
  /* Footer del modal: botones que llenan el ancho para el dedo */
  .modal-foot{justify-content:stretch}
  .modal-foot .btn{flex:1 1 auto;justify-content:center}
  /* Filas de participantes: Tipo+Documento+quitar arriba; Nombre y Correo abajo */
  .parts-head{display:none}
  .parts-fila{grid-template-columns:auto 1fr 36px;gap:8px;row-gap:6px;padding:8px 4px}
  .parts-fila > *:nth-child(1){grid-column:1;grid-row:1}      /* Tipo */
  .parts-fila > *:nth-child(2){grid-column:2;grid-row:1}      /* Documento */
  .parts-fila > *:nth-child(5){grid-column:3;grid-row:1}      /* botón quitar */
  .parts-fila > *:nth-child(3){grid-column:1 / -1;grid-row:2} /* Nombre */
  .parts-fila > *:nth-child(4){grid-column:1 / -1;grid-row:3} /* Correo */
}

/* Tablas que se apilan tipo tarjeta en pantallas pequeñas (sin ocultar datos) */
@media screen and (max-width:680px){
  .tabla-wrap{border:none;background:none;overflow:visible}
  .tabla-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tabla-cards, .tabla-cards tbody, .tabla-cards tr, .tabla-cards td{display:block;width:100%}
  .tabla-cards tr{background:#fff;border:1px solid var(--linea);border-radius:12px;box-shadow:var(--sombra-sm);
    margin-bottom:12px;padding:6px 14px}
  .tabla-cards tr:hover{background:#fff}
  .tabla-cards td{display:block;width:100%;text-align:left;word-break:break-word;overflow-wrap:anywhere;
    padding:7px 0;border-bottom:1px solid var(--linea)}
  .tabla-cards td:last-child{border-bottom:none}
  .tabla-cards td::before{content:attr(data-label);display:block;color:var(--txt-mute);font-weight:600;font-size:11px;
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
  .tabla-cards td[data-label=""]::before,.tabla-cards td:not([data-label])::before,.tabla-cards td.acciones-celda::before{display:none}
  .tabla-cards td.acciones-celda{display:flex;flex-wrap:wrap;gap:6px;padding-top:10px}
}

@media(max-width:380px){
  .metricas{grid-template-columns:1fr}
  .grid-cards{grid-template-columns:1fr}
  .segmento{flex-direction:column}
}

/* =====================================================================
   Pulido visual (tipografía, formularios, animaciones sutiles)
   — va al final: por cascada refina las reglas anteriores sin tocarlas.
   ===================================================================== */

/* --- Tipografía --- */
::selection{background:var(--azul-600);color:#fff}
h1,h2,h3{text-wrap:balance}
.topbar h1{letter-spacing:-.35px}
.metrica .valor,.rk-n,.ps-item b,.pub-count,.campos-count,.lz-zoom,.pag-info,.cfb-dia{font-variant-numeric:tabular-nums}

/* --- Formularios modernos --- */
/* Selects con flecha propia (la nativa de Windows desentona) */
.campo select,.mini-grid select,.filtros select,.dash-filtro select,.ed-accion select,.prev-curso-lbl select{
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23566480' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;background-size:15px;padding-right:34px}
.campo select{cursor:pointer}
/* Borde que responde al pasar el mouse (antes solo al enfocar) */
.campo input:not([type=checkbox]):not([type=radio]):not([type=range]):hover:not(:focus),
.campo select:hover:not(:focus),.campo textarea:hover:not(:focus){border-color:#b7c8de}
/* Etiquetas de campo: micro-mayúsculas, más "producto" */
.campo>label{font-size:12px;text-transform:uppercase;letter-spacing:.045em;color:var(--txt-mute)}
.campo>label small{text-transform:none;letter-spacing:0}

/* --- Iconografía consistente: alertas con icono SVG (antes glifos de texto) --- */
.alerta-ok::before,.alerta-error::before,.alerta-info::before{
  content:"";width:18px;height:18px;flex-shrink:0;margin-top:1px;background:currentColor;
  -webkit-mask:var(--al-ico) center/contain no-repeat;mask:var(--al-ico) center/contain no-repeat}
.alerta-ok{--al-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E")}
.alerta-error{--al-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E")}
.alerta-info{--al-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E")}

/* --- Dashboard --- */
.metrica{transition:transform .16s,box-shadow .16s,border-color .16s}
.metrica:hover{transform:translateY(-2px);box-shadow:var(--sombra)}
.metrica .valor{font-size:28px}

/* --- Animaciones sutiles --- */
dialog[open]{animation:dlg-in .16s ease}
@keyframes dlg-in{from{opacity:0;transform:translate(-50%,-49%) scale(.985)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
dialog::backdrop{animation:bk-in .18s ease}
@keyframes bk-in{from{opacity:0}to{opacity:1}}
.btn-primario:hover{box-shadow:0 3px 10px rgba(31,127,209,.28)}
.btn-secundario:hover{box-shadow:0 3px 10px rgba(22,36,94,.28)}

/* --- Accesibilidad: contraste AA (Lighthouse) --- */
/* txt-dim y ok más profundos (pasan 4.5:1 sobre blanco/fondos suaves); azul-600
   apenas más profundo para que el texto blanco de botones/chips pase AA. */
:root{--txt-dim:#66758f;--ok:#0b7a52;--azul-600:#1a74c4}
.btn-wa{background:#0d7a44}
.btn-wa:hover{background:#0a6338}
/* Texto solo para lectores de pantalla (estructura de encabezados) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Pie público: los smalls sobre navy-900 necesitan más luz para AA */
.pub-foot-in small{color:#8b9ec7}

/* --- Accesibilidad: sin movimiento si el usuario lo pide --- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}