/* Tema MAIA Informes. Toda la identidad visual vive aquí: colores, tipografía y
   forma de cada pieza. Los archivos anteriores (style.css, interfaz.css,
   revision.css, movil.css) aportan la maquetación; este archivo se carga al
   final y manda sobre el color.

   Las fuentes se sirven desde este mismo servidor: no se pide nada a Google
   ni a ningún servicio externo. */

@font-face{font-family:Manrope;src:url('assets/fonts/manrope-latin.woff2') format('woff2');font-weight:500 800;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url('assets/fonts/manrope-latin-ext.woff2') format('woff2');font-weight:500 800;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Outfit;src:url('assets/fonts/outfit-latin.woff2') format('woff2');font-weight:600 800;font-style:normal;font-display:swap}
@font-face{font-family:Outfit;src:url('assets/fonts/outfit-latin-ext.woff2') format('woff2');font-weight:600 800;font-style:normal;font-display:swap;unicode-range:U+0100-02FF,U+0304,U+0308,U+0329,U+1E00-1EFF}

:root{
 /* Fondos, del más hondo al más alto. Gris neutro del manual de MAIA: el color
    no decora, identifica. Todo lo que no es acento va en tinta neutra. */
 --fondo:#141518;          /* la página */
 --papel:#22252B;          /* tarjeta grande (el mismo fondo del ícono de la app) */
 --hondo:#1A1C20;          /* tarjeta dentro de otra tarjeta */
 --superficie:#2C3037;     /* botón secundario, etiqueta, campo */
 --borde:#393E47;
 --borde-suave:#2C3037;

 /* Texto */
 --titulo:#FFFEFB;         /* tinta invertida del manual */
 --tinta:#E3E5E8;
 --suave:#C3C7CD;
 --gris:#979CA5;
 --apagado:#8A8F97;

 /* Acento: azul póliza. Es el color de MAIA Informes y de ninguna de las otras
    cinco apps. Va en el tercer nodo del isotipo, en el botón principal, en el
    estado activo y en los enlaces. En nada más. */
 --acento:#4081D2;         /* azul póliza, tema oscuro */
 --acento-claro:#6EA2E0;   /* misma matiz, más luminosa: hover */
 --acento-texto:#6EA2E0;   /* el azul cuando es letra: 5.0:1 sobre cualquier tarjeta */
 --acento-hondo:#1B2F4B;   /* misma matiz, más oscura: fondo de insignia */
 --sobre-acento:#0F1012;   /* tinta sobre el azul: 4.8:1, se lee */
 --azul:var(--acento);     /* antes había un segundo acento; ahora es el mismo */
 --azul-claro:#22304A;
 --azul-sombra:rgba(64,129,210,.30);

 /* Avisos: no son marca, son señales. Conservan su propio matiz. */
 --rojo:#FF9A8F;
 --rojo-fondo:#3A1F1E;
 --rojo-borde:#6B3A36;
 --verde:#4FBF87;          /* "listo": ya no puede ser el acento */
 --ambar:#F0B95B;
 --ambar-fondo:#3A2E17;

 --sans:Manrope,-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
 --serif:Outfit,var(--sans);
 --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,monospace;

 /* El navegador pinta sus propios controles (barras, listas, calendarios) en oscuro */
 color-scheme:dark;
}

body{background:var(--fondo);color:var(--tinta);font-family:var(--sans);letter-spacing:0}
h1,h2,h3,h4,.brand-lockup{font-family:var(--serif);color:var(--titulo);font-weight:700;letter-spacing:-.025em}
a{color:var(--acento-texto)}a:hover{color:var(--titulo)}
hr{border-color:var(--borde)}

/* ---------- Botones ---------- */
button{font-family:var(--sans);font-weight:700;border-radius:12px;min-height:44px;box-shadow:none;background:var(--superficie);color:var(--tinta);border:1px solid var(--borde);transition:background .15s,border-color .15s,color .15s}
button:hover:not(:disabled){background:#343941;border-color:#464C56}
button:disabled{opacity:.45}
/* La acción principal de cada pantalla: verde agua, sin competencia visual */
button.primario{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento);font-weight:800;box-shadow:none}
button.primario:hover:not(:disabled){background:var(--acento-claro);border-color:var(--acento-claro);color:var(--sobre-acento)}
button.enlace{background:transparent;border-color:transparent;color:var(--acento-texto);font-weight:600}
button.enlace:hover:not(:disabled){background:var(--superficie);color:var(--titulo)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--azul);outline-offset:3px}

/* ---------- Campos ---------- */
input,select,textarea{font-family:var(--sans);background:var(--hondo);color:var(--tinta);border:1px solid var(--borde);font-size:15px;line-height:1.5;border-radius:10px;padding:11px 13px}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(64,129,210,.35);border-color:var(--azul)}
input[type=checkbox],input[type=range]{accent-color:var(--acento)}
input[type=checkbox]{padding:0}input[type=range]{padding:0;background:transparent}
::placeholder{color:#858A93}
label{color:var(--suave)}
.sub,.ayuda{color:var(--gris)}
.error{color:var(--rojo)}

/* ---------- Menú lateral ---------- */
.lateral{background:var(--hondo);border-color:var(--borde);padding:26px 18px;gap:12px}
.marca #quien{font-size:12px;color:var(--apagado);margin-top:10px}
.lateral-pie{border-color:var(--borde)}
.lateral-pie button.enlace,#btnSalir{color:var(--gris)}
.nav-secciones a,.nav-secciones #btnHistorial{font-size:14px;font-weight:700;color:var(--suave);min-height:46px;border-radius:11px;padding:12px;background:transparent;border:0}
.nav-secciones a:hover,.nav-secciones a[aria-current=page],.nav-secciones #btnHistorial[aria-current=page]{background:var(--superficie);color:var(--titulo)}
.nav-secciones svg{width:20px;height:20px}
/* "+ Nuevo informe": es la acción principal del menú, así que lleva el acento.
   Antes iba en un azul distinto para no competir con el verde del paso; ahora
   la app tiene un solo acento y los dos botones son el mismo azul póliza. */
#btnNuevo,.lateral .primario{background:var(--acento);border-color:var(--acento);color:var(--sobre-acento);font-weight:700;font-size:15px;border-radius:12px;box-shadow:0 4px 14px var(--azul-sombra)}
#btnNuevo:hover:not(:disabled),.lateral .primario:hover:not(:disabled){background:var(--acento-claro);border-color:var(--acento-claro);color:var(--sobre-acento)}
/* Logotipo horizontal, manual §3: isotipo de 40 px, separación 0.45 × su alto
   (18 px), texto a 0.46 × su alto (18 px) con letter-spacing .16em, MAIA en el
   peso ligero e "Informes" en uno más marcado. El color NO entra aquí: el azul
   póliza vive en el tercer nodo del isotipo, que está justo al lado.
   El isotipo ya no es una pastilla azul sino una marca transparente, así que
   pierde las esquinas redondeadas y la sombra que tenía. */
.brand-lockup{gap:18px}
.marca .brand-lockup h1,.barra-movil .brand-lockup b{font-family:var(--sans);font-weight:500;color:var(--titulo);letter-spacing:.16em}
.marca .brand-lockup h1 span,.barra-movil .brand-lockup b span{color:inherit;font-weight:700}
.marca .brand-lockup h1{font-size:18px}.brand-lockup h1{font-size:18px}
.brand-lockup img{border-radius:0;box-shadow:none}
.lateral .brand-lockup img{width:40px;height:40px}
.marca-sub{color:var(--apagado)}

/* ---------- Zona principal ---------- */
.principal{padding:36px clamp(24px,4vw,48px) 40px;background:var(--fondo)}
.cabecera h2,#vistaNuevo .cabecera h2{font-size:clamp(27px,3vw,34px);letter-spacing:-.5px;color:var(--titulo)}
.cabecera p{font-size:15px!important;line-height:1.6;color:var(--gris)}
.eyebrow{font-size:11px;color:var(--acento-texto);letter-spacing:1.6px;font-weight:700}

/* ---------- Los tres pasos, como una barra de píldoras ---------- */
.guia-pasos{background:var(--papel);border:1px solid var(--borde);box-shadow:none;padding:6px;gap:4px;margin:24px 0;border-radius:99px}
.guia-pasos li>button{border:0;background:transparent;border-radius:99px;color:var(--apagado);font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;min-height:36px}
.guia-pasos li>button:hover:not(:disabled){background:var(--superficie);color:var(--suave)}
.guia-pasos li>button:disabled{opacity:.65}
.guia-pasos .actual>button,.guia-pasos li>button[aria-current=step]{background:var(--acento);color:var(--sobre-acento);font-weight:800}
.guia-pasos .actual{color:var(--sobre-acento)}
.guia-pasos span{border:1px solid var(--borde);background:var(--superficie);color:var(--suave)}
.guia-pasos .actual span{background:var(--sobre-acento);color:var(--acento-texto);border-color:transparent}
.guia-pasos .completo span{background:var(--acento-hondo);color:var(--acento-texto);border-color:transparent}

/* ---------- Tarjetas ---------- */
.captura-card,.manual-card,.bloque,.campo,.plantilla{background:var(--papel);border:1px solid var(--borde);box-shadow:none;border-radius:20px}
.captura-card{border-top:1px solid var(--borde);padding:24px}
.manual-card{padding:24px}
.seccion-titulo h3{font-size:20px;color:var(--titulo)}
.seccion-titulo p{color:var(--gris);font-size:14px}
.insignia{background:var(--acento-hondo);border:1px solid #2E4D75;color:var(--acento-texto);border-radius:99px;font-size:11px;font-weight:700}
.paso,.adjunto-icono{background:var(--superficie);color:var(--acento-texto)}
.estado{color:var(--gris)}
.aviso{border-color:var(--ambar-fondo)}

/* ---------- Dictado del caso ---------- */
#relato{min-height:190px;font-size:15px;line-height:1.6;background:var(--hondo);border:1px solid var(--borde);padding:16px;border-radius:16px}
#relato::placeholder{color:#858A93}
.zona-archivos{background:var(--hondo);border:1.5px dashed #464C56;border-radius:16px;padding:18px}
.zona-archivos h4{font-weight:700;color:var(--suave)}
.boton-archivo{background:var(--superficie);color:var(--suave);border-color:var(--borde);border-radius:12px;font-size:12.5px;font-weight:700}
.boton-archivo:hover:not(:disabled){background:#343941;color:var(--titulo)}
#btnDictar{border-radius:99px;background:var(--superficie);color:var(--suave);border-color:var(--borde)}
#btnDictar[aria-pressed=true]{color:var(--rojo);background:var(--rojo-fondo);border-color:var(--rojo-borde)}
.generar-barra{background:var(--superficie);border:1px solid var(--borde);border-radius:14px}
.generar-barra .mini-etiqueta{color:var(--acento-texto)}
.barra-final{background:var(--papel);border-color:var(--borde);box-shadow:0 -6px 24px rgba(0,0,0,.35)}
.limites-adjuntos,.archivos-lista{color:var(--gris)}

/* ---------- Editor y campos del informe ---------- */
.editor-cabecera .controles{background:var(--superficie);border-radius:12px}
.campo-herr button.enlace{background:var(--superficie);color:var(--acento-texto)}
.secciones-formato .campo{background:var(--papel)}
.contador{color:var(--gris)}
.lista-editable input,.lista-editable textarea{background:var(--hondo)}

/* ---------- Biblioteca de informes y pacientes ---------- */
.biblioteca-filtros{background:var(--papel);border-color:var(--borde);border-radius:16px;padding:20px;gap:14px}
.biblioteca-filtros input,.biblioteca-filtros select{border-color:var(--borde)}
.biblioteca-informe{background:var(--papel);border-color:var(--borde);border-radius:14px;padding:18px}
.biblioteca-informe h3{font-size:18px;color:var(--titulo)}
.estado-informe{background:var(--acento-hondo);color:var(--acento-texto);border-radius:99px}
#pacientesLista{display:grid;grid-template-columns:1fr;gap:0;border-radius:16px;overflow:hidden;border:1px solid var(--borde)}
#pacientesLista .paciente-tarjeta{display:flex;align-items:center;justify-content:space-between;gap:18px;text-align:left;background:var(--papel);border:0;border-radius:0;padding:18px 20px;box-shadow:none}
#pacientesLista .paciente-tarjeta+button{border-top:1px solid var(--borde)}
#pacientesLista .paciente-tarjeta:hover{background:var(--superficie)}
#pacientesLista strong{font-size:16px;color:var(--titulo)}
#pacientesLista span{font-size:13px;color:var(--gris)}
.informe-estado-acciones{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.borrar-informe{color:var(--rojo);border:1px solid var(--rojo-borde);background:var(--rojo-fondo);padding:9px 14px}
.borrar-informe:hover:not(:disabled){background:#4A2725;border-color:#82443F}

/* ---------- Revisión del PDF ---------- */
.revision-dialog{background:var(--fondo);border:1px solid var(--borde);box-shadow:0 24px 70px rgba(0,0,0,.6);color:var(--tinta)}
.revision-dialog>header h2{font-family:var(--serif);color:var(--titulo)}
.revision-layout>main{background:var(--fondo)}
.revision-layout>aside{background:var(--hondo)}
.revision-dialog>.guia-pasos{background:var(--papel)}
/* El PDF se ve sobre un fondo neutro claro: el papel es blanco y debe leerse así */
#revPdf{background:#32373F;border-radius:14px}

/* ---------- Entrada ---------- */
#login{background:radial-gradient(ellipse at 20% 15%,#1E2B3E 0,transparent 55%),var(--fondo)}
.tarjeta-login{background:var(--papel);border:1px solid var(--borde);border-radius:22px;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.tarjeta-login .bienvenida{color:var(--titulo)}
/* Logotipo apilado de la pantalla de entrada, manual §3 y §6.3: isotipo a 96 px
   (arriba de 56 px, así que va con su palomita), MAIA a 40 px con
   letter-spacing .22em y debajo el descriptor en monoespaciada y mayúsculas.
   El text-indent compensa el hueco que el letter-spacing deja tras la última
   letra; sin él las palabras se ven corridas a la izquierda. */
.marca-login{display:flex;flex-direction:column;align-items:center;gap:16px;margin:0 auto 20px}
.marca-login img{width:96px;height:96px;border-radius:0;box-shadow:none}
.marca-login-nombre{display:flex;flex-direction:column;align-items:center;gap:7px;margin:0;font-family:var(--sans);font-weight:500;font-size:40px;line-height:1;letter-spacing:.22em;text-indent:.22em;color:var(--titulo)}
.marca-login-nombre span{font-weight:700;font-size:21px;letter-spacing:.16em;text-indent:.16em}
.marca-login-lema{margin:0;font-family:var(--mono);font-size:10px;line-height:1.75;letter-spacing:.13em;text-transform:uppercase;text-align:center;color:var(--gris)}
.marca .brand-lockup h1 span,.barra-movil .brand-lockup b span{margin-left:.35em}
.tarjeta-login .sub{color:var(--gris)}
.instalar-enlace{color:var(--acento-texto)}
.acceso-instalacion{background:var(--superficie);border:1px solid var(--borde);color:var(--tinta)}
.acceso-instalacion small{color:var(--gris)}

/* ---------- Configuración ---------- */
#vistaAjustes{max-width:880px}
#vistaAjustes .ajustes-cabecera{margin-bottom:32px}
#vistaAjustes .ajustes-cabecera p{margin-top:8px}
.opciones-ajustes{display:grid;gap:28px}
.ajustes-grupo h3{font-family:var(--sans);font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--apagado);margin:0 0 12px 4px}
.ajustes-lista{border:1px solid var(--borde);border-radius:18px;background:var(--papel);box-shadow:none;overflow:hidden}
.opcion-ajuste{width:100%;min-height:98px;display:grid;grid-template-columns:48px minmax(0,1fr) 20px;align-items:center;gap:18px;padding:20px 24px;text-align:left;border:0;border-radius:0;background:transparent;box-shadow:none;color:var(--titulo)}
.opcion-ajuste+.opcion-ajuste{border-top:1px solid var(--borde)}
.opcion-ajuste:hover{background:var(--superficie);box-shadow:none}
.opcion-ajuste:focus-visible{outline:2px solid var(--azul);outline-offset:-3px;border-radius:14px}
/* Los iconos de la lista de Configuración van en tinta neutra: el azul póliza
   se reserva al botón principal, al estado activo y a los enlaces. */
.ajuste-icono{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--superficie);color:var(--suave)}
.ajuste-icono svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.ajuste-contenido{display:grid;gap:6px;min-width:0}
.ajuste-titulo{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ajuste-titulo strong{font-family:var(--sans);font-size:16px;line-height:1.4;font-weight:700;color:var(--titulo)}
.ajuste-descripcion{font-size:13px;line-height:1.5;font-weight:400;color:var(--gris)}
.ajuste-badge{display:inline-flex;border:1px solid #2E4D75;border-radius:7px;padding:2px 7px;background:var(--acento-hondo);color:var(--acento-texto);font-size:10px;line-height:1.5;font-weight:700}
.ajuste-flecha{display:flex;align-items:center;color:var(--apagado)}
.ajuste-flecha svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.opcion-ajuste:hover .ajuste-flecha{color:var(--acento-texto)}
.volver-ajustes{color:var(--acento-texto)}

/* ---------- Directorio de médicos y equipo ---------- */
.directorio{margin-bottom:32px}
.directorio>h3,.equipo-panel>h3{margin-bottom:8px}
.directorio>.sub{margin-bottom:16px}
.directorio>label{display:block;margin:20px 0 12px}
.directorio>label input{display:block;width:100%;margin-top:6px}
.directorio .fila>label{min-width:0}
.directorio .acciones,.equipo-panel .acciones{flex-wrap:wrap}
.directorio #formMedico{margin:0 0 20px}.directorio h4{font-size:18px}
.lista-medicos{display:grid;gap:12px}
.medico-card{border:1px solid var(--borde);border-radius:14px;padding:16px;background:var(--papel);display:flex;justify-content:space-between;gap:16px}
.medico-card h4{margin:0 0 6px;color:var(--titulo)}
.medico-card p{margin:6px 0;color:var(--suave)}
.medico-card .acciones{align-self:start;flex-shrink:0}
.medico-card>div{min-width:0;overflow-wrap:anywhere}
.rol-medico{display:inline-block;border-radius:99px;background:var(--superficie);color:var(--acento-texto);padding:3px 10px;font-size:12px;font-weight:700}
.equipo-panel{background:var(--hondo);border:1px solid var(--borde);padding:18px;border-radius:16px}
.equipo-panel>label{display:block;margin:12px 0 6px}
.equipo-panel textarea{width:100%;display:block;margin-top:6px}
.equipo-preview{margin-top:12px;font-size:14px}
.equipo-preview p,#edEquipo p{margin:6px 0}
.equipo-preview .mal{color:var(--rojo)}
#equipoNuevo{margin:0 0 20px}#vistaMedicos{max-width:1000px}

/* ---------- Objetivo del informe ---------- */
.objetivo-informe{margin:18px 0;padding:18px;background:var(--hondo);border:1px solid var(--borde);border-radius:16px;display:grid;gap:8px}
.objetivo-informe>label{font-weight:700;color:var(--titulo);font-size:16px}
.objetivo-informe select{width:100%}
.objetivo-informe .ayuda{margin:0}

/* ---------- Dictado y revisión rápida ---------- */
.dictado-barra{position:sticky;bottom:14px;z-index:12;background:var(--papel);border:1px solid var(--borde);border-radius:20px;padding:18px 22px;box-shadow:0 12px 38px rgba(0,0,0,.45);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.dictado-barra>div{display:flex;align-items:center;gap:18px;flex:1}
.dictado-barra .preparar-voz{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;margin:0;color:var(--gris)}
.dictado-barra .preparar-voz input{width:17px;height:17px;margin:0}
.dictado-barra #estadoGenerar{width:100%;font-size:13px;line-height:1.4;color:var(--gris)}
#dictarAbajo{background:var(--superficie);border-color:var(--borde);color:var(--suave);min-width:132px}
.dictando-caso #dictarAbajo{color:var(--rojo);background:var(--rojo-fondo);border-color:var(--rojo-borde)}
.revision-rapida{background:var(--papel);border:1px solid var(--borde);border-radius:24px;padding:28px;margin-bottom:22px}
.revision-encabezado{display:flex;align-items:center;justify-content:space-between;gap:16px}
.revision-encabezado h3{font-size:24px;margin:6px 0 12px;color:var(--titulo)}
.revision-estado{font-size:12px;font-weight:700;color:var(--acento-texto);background:var(--acento-hondo);padding:7px 12px;border-radius:99px;white-space:nowrap}
#resumenClinico{color:var(--suave);line-height:1.6;margin-bottom:24px}
.contexto-detectado{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dato-contexto{display:flex;flex-direction:column;gap:5px;background:var(--hondo);border:1px solid var(--borde);border-radius:14px;padding:14px;min-width:0}
.dato-contexto span,.resumen-plan>span{font-size:12px;font-weight:700;color:var(--apagado)}
.dato-contexto strong{font-size:15px;font-weight:700;overflow-wrap:anywhere;color:var(--titulo)}
.dato-contexto small{font-size:11px;line-height:1.4;color:var(--gris)}
.dato-contexto.sin-dato strong{color:var(--ambar)}
.resumen-plan{margin:20px 0;padding:18px 20px;background:var(--hondo);border-radius:16px;border-left:3px solid var(--acento)}
.resumen-plan p{font-size:15px;line-height:1.6;margin:5px 0 14px;color:var(--tinta)}
.resumen-plan p:last-child{margin-bottom:0}
.revision-preguntas{border-top:1px solid var(--borde);padding-top:22px}
.revision-preguntas h3{font-size:18px;margin:0 0 7px;color:var(--titulo)}
.revision-preguntas .sub{font-size:13px}
.pregunta-clinica{border-bottom:1px solid var(--borde);padding:12px 0}
.pregunta-cabecera{display:flex;gap:10px;align-items:center;margin:0;font-size:14px;font-weight:600;color:var(--tinta)}
.pregunta-cabecera input{width:19px;height:19px;flex-shrink:0;margin:0}
.respuesta-clinica{padding:12px 0 2px 29px}
.respuesta-clinica[hidden]{display:none}
.respuesta-clinica p,.respuesta-clinica label{font-size:12px;color:var(--gris)}
.respuesta-clinica input{width:100%;font-size:14px}
.correccion-dictada{margin-top:24px;border-radius:18px;background:var(--hondo);border:1px solid var(--borde);padding:20px}
.correccion-dictada>label{display:block;font-weight:700;font-size:15px;margin-bottom:10px;color:var(--titulo)}
.correccion-dictada textarea{width:100%;box-sizing:border-box;font-size:15px;line-height:1.5}
.correccion-dictada .acciones{margin-top:12px;justify-content:space-between}
.correccion-dictada p{margin-bottom:0;font-size:13px;color:var(--gris)}
.edicion-completa{margin:0 0 25px;border:1px solid var(--borde);border-radius:18px;background:var(--papel);padding:20px}
.edicion-completa>summary{font-size:16px;font-weight:700;color:var(--titulo);cursor:pointer}
.edicion-completa>summary span{display:block;font-size:12px;font-weight:400;margin:6px 0 0 20px;color:var(--gris)}
.edicion-completa[open]>summary{margin-bottom:25px}
/* ---------- Paso 2: informe por apartados ---------- */
.seccion-informe{margin:0 0 22px;padding:0 0 22px;border-bottom:1px solid var(--borde)}
.seccion-informe:last-of-type{border-bottom:0;margin-bottom:0;padding-bottom:0}
.seccion-informe-titulo{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--acento-texto);margin:0 0 12px}
.seccion-informe-cuerpo{display:flex;flex-direction:column;gap:12px}
.seccion-informe .campo,.seccion-informe .bloque{margin:0}
.seccion-informe .campo textarea{font-size:15px;line-height:1.5;min-height:48px;overflow:hidden;resize:vertical}
.seccion-informe .campo h3{font-size:15px}
/* ---------- Paso 1: escenarios frecuentes ---------- */
.escenarios{margin:0 0 22px;padding:0 0 20px;border-bottom:1px solid var(--borde)}
.escenarios h3{margin:0 0 4px;color:var(--titulo);font-size:17px}
.escenarios>.sub{margin:0 0 12px;font-size:13px;color:var(--gris)}
.escenario.otro p{color:var(--gris)}
.de-quien{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--suave)}
.de-quien>span{font-weight:700;color:var(--titulo)}
.de-quien label{display:flex;align-items:center;gap:7px;margin:0}
.de-quien input[type=radio]{width:17px;height:17px;margin:0}
.de-quien select{min-width:240px;max-width:100%}
#equipoEditor textarea{width:100%;box-sizing:border-box;margin-top:10px}
#equipoEditor .acciones{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}
#equipoEditor .equipo-preview{margin-top:10px;font-size:13px;color:var(--suave)}
.escenarios-lista{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:10px}
.escenario{display:flex;gap:10px;align-items:flex-start;background:var(--papel);border:1px solid var(--borde);border-radius:14px;padding:12px;cursor:pointer}
.escenario:has(input:checked){border-color:var(--acento);background:var(--acento-hondo)}
.escenario input{margin-top:3px;flex-shrink:0;width:18px;height:18px}
.escenario b{display:block;color:var(--titulo);font-size:14px;margin-bottom:4px}
.escenario p{margin:0;font-size:12.5px;line-height:1.45;color:var(--suave)}
/* ---------- Cotización de material ---------- */
.panel-cotizacion{margin-top:16px;padding:16px;border:1px solid var(--borde);border-radius:14px;background:var(--hondo)}
#bloqueGenerales .ancho-total{grid-column:1/-1}
#bloqueGenerales .ancho-total select{width:100%}
.panel-cotizacion h4{margin:0 0 6px;color:var(--titulo);font-size:15px}
.panel-cotizacion h5{margin:16px 0 4px;color:var(--titulo);font-size:13px}
.panel-cotizacion h5 .sub{display:block;font-weight:400;font-size:11.5px;color:var(--gris)}
#cotMateriales .fila-ed input:nth-child(3){max-width:120px}
.panel-cotizacion label{display:block;margin-top:10px;color:var(--suave);font-size:13px}
.panel-cotizacion input,.panel-cotizacion textarea{width:100%;box-sizing:border-box}
.panel-cotizacion .acciones{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.tabla-cotizacion{width:100%;border-collapse:collapse;margin-top:12px;font-size:12.5px}
.tabla-cotizacion th,.tabla-cotizacion td{border-bottom:1px solid var(--borde);padding:6px 4px;text-align:left;color:var(--tinta)}
.tabla-cotizacion th{color:var(--apagado);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.tabla-cotizacion input{width:100%;min-width:60px;box-sizing:border-box;background:var(--papel);font-size:12.5px;padding:4px 6px}
.tabla-cotizacion td.importe{white-space:nowrap}
.tabla-cotizacion tfoot td{text-align:right}
.tabla-cotizacion button{padding:4px 8px;min-height:0;color:var(--gris)}
/* ---------- Paso 3: dos descargas ---------- */
.descargas-revision{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.descargas-revision button[hidden]{display:none}
@media(max-width:800px){.escenarios-lista{grid-template-columns:1fr}.de-quien select{min-width:0;width:100%}}
.contexto-detectado .dato-contexto:hover{border-color:#464C56}

/* ---------- Pantallas angostas ---------- */
.nav-movil{display:none}
@media(max-width:800px){
 .principal{padding:16px 16px calc(96px + env(safe-area-inset-bottom))}
 .barra-movil{background:var(--hondo);border-bottom:1px solid var(--borde);margin:-16px -16px 22px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px}
 .barra-movil .brand-lockup{font-size:15px}
 .barra-movil .brand-lockup b{font-size:15px}.barra-movil .brand-lockup img{width:32px;height:32px}.lateral .brand-lockup img{width:40px;height:40px}
 .cabecera h2,#vistaNuevo .cabecera h2{font-size:27px}.cabecera p{font-size:14px!important}
 .captura-card,.manual-card,.bloque,.campo{padding:18px;border-radius:18px}
 .seccion-titulo{flex-wrap:wrap}.seccion-titulo h3{font-size:19px}
 .guia-pasos{padding:5px;gap:2px;border-radius:99px}
 .guia-pasos li>button{font-size:11px;gap:5px;padding:8px 3px;min-height:44px}
 .guia-pasos span{width:25px;height:25px;min-width:25px}
 .nav-movil{position:fixed;bottom:0;left:0;right:0;z-index:15;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:4px 8px max(env(safe-area-inset-bottom),6px);background:rgba(26,28,32,.94);backdrop-filter:blur(16px);border-top:1px solid var(--borde)}
 .nav-movil button{border:0;background:transparent;box-shadow:none;min-height:54px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:5px;color:var(--apagado);font-size:11px;font-weight:700}
 .nav-movil button[aria-current=page]{background:var(--superficie);color:var(--acento-texto);border-radius:12px}
 .nav-movil svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
 .barra-final{bottom:calc(var(--nav-altura) + 8px + env(safe-area-inset-bottom))}
 .revision-dialog>footer{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
 .revision-dialog .guia-pasos{margin:0}.revision-dialog .barra-final{bottom:0}
 #pacientesLista .paciente-tarjeta{align-items:flex-start;flex-direction:column;gap:6px;padding:16px}
 .biblioteca-filtros{padding:16px}.biblioteca-informe{padding:16px}
 .informe-estado-acciones button{margin-left:0}.informe-estado-acciones{gap:8px}
}
@media(max-width:900px){
 .contexto-detectado{grid-template-columns:repeat(2,minmax(0,1fr))}
 .revision-rapida{padding:20px}.revision-encabezado{align-items:flex-start}.revision-encabezado h3{font-size:21px}
}
@media(max-width:600px){
 #vistaAjustes .ajustes-cabecera{margin-bottom:26px}
 .opciones-ajustes{gap:24px}
 .opcion-ajuste{min-height:94px;grid-template-columns:40px minmax(0,1fr) 16px;gap:12px;padding:18px 16px}
 .ajuste-icono{width:40px;height:40px;border-radius:12px}.ajuste-icono svg{width:22px;height:22px}
 .ajuste-titulo{gap:5px 8px}.ajuste-titulo strong{font-size:15px}.ajuste-descripcion{font-size:12px}
 .objetivo-informe{padding:14px}.objetivo-informe>label{font-size:15px}.directorio .fila{flex-direction:column}
 .dictado-barra{bottom:calc(var(--nav-altura) + 8px + env(safe-area-inset-bottom));padding:12px;border-radius:16px;gap:8px}
 .dictado-barra>div{flex:1 1 100%;justify-content:space-between;gap:8px}
 .dictado-barra>#btnGenerar{width:100%}
 .dictado-barra .preparar-voz{font-size:11px;max-width:140px}
 .revision-rapida{padding:16px;border-radius:18px}.revision-estado{display:none}
 .contexto-detectado{gap:8px}.dato-contexto{padding:11px}.dato-contexto strong{font-size:13px}
 .correccion-dictada{padding:12px}.correccion-dictada button{font-size:13px;padding:11px}
 .edicion-completa{padding:16px}
}
@media(max-width:650px){.medico-card{flex-direction:column}}
@media(min-width:1051px){
 #app{grid-template-columns:266px minmax(0,1fr)}
 .lateral{padding:22px 18px 18px}
 .principal{padding:32px}
 #vistaNuevo{max-width:880px}
 .cabecera h2,#vistaNuevo .cabecera h2{font-size:32px}
}
#vistaNuevo>.generar-barra{display:flex;align-items:center;justify-content:space-between;gap:12px;background:transparent;border:0;border-radius:0;padding:0 0 12px;font-size:12px;color:var(--apagado)}
#vistaNuevo>.generar-barra button{font-size:12px;padding:8px 12px;min-height:40px}

/* ---------- El micrófono como pieza principal del paso 1 ---------- */
.captura-card .seccion-titulo{display:flex;align-items:center;gap:20px}
.microfono{width:78px;height:78px;min-height:78px;flex:0 0 78px;border-radius:50%;display:grid;place-items:center;padding:0;background:var(--acento);border:0;color:var(--sobre-acento);cursor:pointer;box-shadow:0 0 0 10px rgba(64,129,210,.16),0 0 0 20px rgba(64,129,210,.07);transition:box-shadow .2s,background .2s}
.microfono svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.microfono:hover:not(:disabled){background:var(--acento-claro);box-shadow:0 0 0 12px rgba(64,129,210,.22),0 0 0 24px rgba(64,129,210,.10)}
/* Mientras dicta, el micrófono late en rojo para que se note que está grabando */
.microfono[aria-pressed=true]{background:#C2554B;box-shadow:0 0 0 10px rgba(194,85,75,.22),0 0 0 20px rgba(194,85,75,.1);animation:latido 1.6s ease-in-out infinite}
.microfono[aria-pressed=true]:hover{background:#D2655B}
@keyframes latido{0%,100%{box-shadow:0 0 0 10px rgba(194,85,75,.22),0 0 0 20px rgba(194,85,75,.1)}50%{box-shadow:0 0 0 14px rgba(194,85,75,.3),0 0 0 26px rgba(194,85,75,.14)}}
@media(prefers-reduced-motion:reduce){.microfono[aria-pressed=true]{animation:none}}

/* ---------- La nota de consulta, en su propia tarjeta ---------- */
.nota-consulta{background:var(--hondo);border:1px solid var(--borde);border-radius:16px;padding:18px;margin-top:22px}
.nota-cabecera{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.nota-etiqueta{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--apagado)}
.nota-consulta #relato{background:transparent;border:0;padding:0;min-height:170px;border-radius:0}
.nota-consulta #relato:focus{outline:0}
.nota-consulta .herramientas-captura{display:flex;justify-content:flex-end;margin-top:10px;color:var(--gris);font-size:12px}
.nota-consulta:focus-within{border-color:var(--azul);box-shadow:0 0 0 3px rgba(64,129,210,.18)}

/* ---------- Casillas de verificación en línea ----------
   style.css pone TODAS las etiquetas en columna (flex-direction:column), así que
   cualquier etiqueta con casilla mostraba el cuadrito encima del texto en vez de
   a su lado. Error anterior al rediseño; aquí se corrige de una vez para todas. */
label:has(>input[type=checkbox]){flex-direction:row;align-items:center;gap:10px}
.pregunta-cabecera,.preparar-voz,.conmutador{flex-direction:row;align-items:center}
.pregunta-cabecera>span{flex:1;min-width:0}
/* Las casillas y los redondeles los dibuja el navegador: si se les pone fondo o
   borde propios quedan de color claro sobre el tema oscuro. */
input[type=checkbox],input[type=radio]{background:none;border:none;padding:0;accent-color:var(--acento)}

/* ---------- Paso 3: revisar, firmar y descargar ----------
   revision.css e interfaz.css pintan este diálogo con colores claros escritos a
   mano. Aquí se traducen al tema oscuro para que todo se lea. */
.revision-dialog,.revision-dialog[open]{color:var(--tinta);background:var(--fondo);border-color:var(--borde)}
.revision-dialog::backdrop{background:rgba(10,11,13,.72);backdrop-filter:blur(5px)}
.revision-dialog>header{border-bottom:1px solid var(--borde);background:var(--hondo)}
.revision-dialog>header h2{color:var(--titulo)}
.revision-dialog .eyebrow{color:var(--acento-texto)}
.revision-dialog h3,.revision-dialog h4,.revision-dialog strong{color:var(--titulo)}
.revision-dialog label,.revision-dialog p,.revision-dialog summary{color:var(--suave)}
.revision-dialog[open] .ajustes-texto>summary,.revision-dialog #revPosicion summary,.revision-dialog summary{color:var(--suave)}
.revision-dialog>footer{background:var(--hondo);border-top:1px solid var(--borde)}
.rev-campo small,#revEstado,.rev-campo p.sub{color:var(--gris)}
.rev-acciones a{color:var(--acento-texto);background:var(--superficie)}
.rev-acciones a:hover{background:#343941;color:var(--titulo)}
#revFirmaEstado{color:var(--suave)}
#revFirmaEstado.firma-lista{color:var(--acento-texto);font-weight:700}
#revAvisos{color:var(--suave)}
/* Falta la firma: ámbar sobre oscuro, no beige */
#configurarFirmaRevision{background:var(--superficie);border-color:var(--borde);color:var(--suave)}
#configurarFirmaRevision.firma-pendiente{background:var(--ambar-fondo);border-color:#6A5526;color:var(--ambar)}
#configurarFirmaRevision.firma-pendiente:hover:not(:disabled){background:#4A3B1D;border-color:#8A6F32}
.ajustes-texto{border-top-color:var(--borde)}
.rev-firma{border-top-color:var(--borde)}
/* Un botón principal apagado debe verse apagado, no medio verde */
.revision-dialog button.primario:disabled,button.primario:disabled{background:var(--superficie);border-color:var(--borde);color:var(--apagado);opacity:1}
/* El botón Menú de la barra superior en móvil venía en blanco desde movil.css. */
.barra-movil button,.barra-movil #btnMenu{background:var(--superficie);border:1px solid var(--borde);color:var(--suave)}
.barra-movil button:hover:not(:disabled),.barra-movil #btnMenu:hover:not(:disabled){background:#343941;color:var(--titulo)}
/* El desplegable de "Más opciones" venía en blanco desde interfaz.css. */
.otras-acciones>div{background:var(--papel);border:1px solid var(--borde);box-shadow:0 8px 32px rgba(0,0,0,.5)}
.otras-acciones summary{color:var(--suave)}
/* La firma y el membrete se muestran sobre blanco a propósito: son imágenes de
   tinta oscura sobre fondo transparente y sobre el tema oscuro no se verían. */
img.preview{background:#fff;border:1px solid var(--borde);border-radius:10px}

/* ---------- Últimos restos del tema claro ----------
   Reglas más específicas que las generales de arriba, encontradas revisando el
   contraste de cada texto en todas las pantallas. */
.bloque h3,.campo-cab h3,.seccion-titulo h3,.plantilla h3,.directorio h3,.directorio h4,.equipo-panel h3{color:var(--titulo)}
/* Cuatro textos traían todavía un azul del tema claro escrito a mano en
   style.css y movil.css; sobre el fondo oscuro se quedaban en 1.7:1 y 1.9:1,
   prácticamente invisibles. El color se corrige aquí, que es donde vive. */
.manual-opcional>summary,.datos-adicionales summary{color:var(--suave)}
.manual-opcional>summary span{color:var(--gris)}
#vistaNuevo .cabecera p{color:var(--suave)}
.barra-movil button{color:var(--tinta)}
.tarjeta-login .bienvenida{color:var(--titulo)}
.objetivo-informe label,.objetivo-informe>div>label{color:var(--suave)}
.personalizar-ia summary,.edicion-completa>summary,summary{color:var(--suave)}
.personalizar-ia summary{color:var(--acento-texto)}
output,.campo-herr output{color:var(--acento-texto)}
.campo-cab .etiqueta{color:var(--gris)}
/* El número del paso pendiente debe leerse, aunque esté apagado */
.guia-pasos li>button span{color:var(--suave)}
.guia-pasos li>button{color:var(--gris)}
.guia-pasos .actual>button{color:var(--sobre-acento)}
.guia-pasos .actual>button span{color:var(--acento-texto)}
.manual-card label,.datos-contenido label,.datos-contenido label>span{color:var(--suave)}
.campo details>summary,.campo summary,.secciones-formato summary,.personalizar-ia summary{color:var(--acento-texto)}
.campo output,.campo-herr output,.controles output{color:var(--acento-texto)}
#valorTamanoFirma{color:var(--acento-texto)}

/* ---------- Material por cirugía ---------- */
.dictar-material{border:1px solid var(--borde);border-radius:16px;background:var(--hondo);padding:16px 18px;margin:18px 0}
.dictar-material>summary{color:var(--acento-texto);font-weight:700}
.dictar-material textarea{width:100%;margin-top:10px}
.dictar-material .acciones{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.filas-material{display:grid;gap:10px;margin-top:8px}
.fila-material{display:grid;grid-template-columns:78px minmax(0,1.6fr) minmax(0,1.4fr) minmax(0,.8fr) minmax(0,.8fr) 40px;gap:10px;align-items:end;background:var(--hondo);border:1px solid var(--borde);border-radius:14px;padding:12px}
.fila-material label{display:grid;gap:5px;min-width:0;flex-direction:column}
.fila-material label span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--apagado)}
.fila-material input{width:100%;font-size:14px;padding:9px 11px}
.fila-material .quitar-fila{min-height:40px;padding:0;font-size:20px;line-height:1;color:var(--gris);border-radius:10px}
.fila-material .quitar-fila:hover{color:var(--rojo);background:var(--rojo-fondo)}
.resumen-material{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:4px}
.resumen-material li{font-size:13px;color:var(--suave)}
.resumen-material li.sub{color:var(--gris)}
@media(max-width:800px){
 .fila-material{grid-template-columns:70px minmax(0,1fr) 40px;grid-template-areas:'cant nombre quitar' 'desc desc desc' 'marca marca prov'}
 .fila-material>label:nth-child(1){grid-area:cant}.fila-material>label:nth-child(2){grid-area:nombre}
 .fila-material>label:nth-child(3){grid-area:desc}.fila-material>label:nth-child(4){grid-area:marca}
 .fila-material>label:nth-child(5){grid-area:prov}.fila-material>.quitar-fila{grid-area:quitar;align-self:end}
}
/* La firma ya viene sin fondo: se muestra sobre cuadros para que la transparencia se vea. */
img.preview.firma-transparente{background-image:linear-gradient(45deg,#2C3037 25%,transparent 25%),linear-gradient(-45deg,#2C3037 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#2C3037 75%),linear-gradient(-45deg,transparent 75%,#2C3037 75%);background-size:14px 14px;background-position:0 0,0 7px,7px -7px,-7px 0;background-color:#fff}
/* El dictado original del médico, para comparar y copiar. */
.dictado-original{margin:10px 0 0;border:1px solid var(--borde);border-radius:14px;background:var(--hondo);padding:10px 14px}
.dictado-original>summary{color:var(--acento-texto);font-weight:700;cursor:pointer}
.dictado-original p{white-space:pre-wrap;line-height:1.55;color:var(--suave);margin:10px 0 6px;font-size:14px}
.firma-miniatura{height:26px;vertical-align:middle;margin-right:6px;background:#fff;border-radius:4px;padding:2px}
.subir-firma{cursor:pointer}
/* Guía para dictar: lista corta que se palomea sola. */
.guia-dictado{margin:0 0 14px;padding:10px 14px;border:1px solid var(--borde);border-radius:14px;background:var(--hondo)}
.guia-dictado summary{cursor:pointer;font-weight:700;color:var(--suave);font-size:13px;list-style:none}.guia-dictado summary::-webkit-details-marker{display:none}
.guia-dictado summary::before{content:'▸';display:inline-block;margin-right:6px;color:var(--apagado);transition:transform .15s}.guia-dictado[open] summary::before{transform:rotate(90deg)}
.guia-dictado #guiaAvance{font-weight:600;color:var(--acento-texto);margin-left:8px}
.guia-dictado ol{margin:8px 0 0;padding:0;list-style:none;display:grid;gap:4px;font-size:13px;line-height:1.4;color:var(--gris)}
.guia-dictado li::before{content:'◇';display:inline-block;width:16px;color:var(--apagado)}
.guia-dictado li.dicho{color:var(--suave)}.guia-dictado li.dicho::before{content:'✓';color:var(--acento-texto)}
.guia-dictado li.opcional{color:var(--apagado)}.guia-dictado li.opcional.dicho{color:var(--suave)}
.guia-dictado .ayuda{margin:8px 0 0;font-size:12px}
@media(max-width:800px){.guia-dictado ol{font-size:12px}}

/* ---------- Paso 3: el formato como mapa para editar ---------- */
.rev-tabs{display:flex;gap:6px;background:var(--hondo);border:1px solid var(--borde);border-radius:12px;padding:4px;margin-right:auto}
.rev-tabs button{border:0;background:transparent;color:var(--gris);font-size:13px;font-weight:700;padding:8px 14px;min-height:0;border-radius:9px}
.rev-tabs button.activo{background:var(--acento-hondo);color:var(--acento-texto)}
.mapa-formato{display:flex;flex-direction:column;gap:6px;align-items:center;padding:8px 0}
.mapa-formato.oculto,#revPdf.oculto{display:none}
.mapa-hoja{position:relative;width:100%;max-width:900px;background:#fff;border:1px solid var(--borde);border-radius:6px;overflow:hidden}
.mapa-hoja img{display:block;width:100%;height:auto}
.mapa-zonas{position:absolute;inset:0}
.mapa-zona{position:absolute;padding:0 1px;margin:0;min-height:0;min-width:0;border:1px solid transparent;border-radius:2px;background:transparent;color:#17181A;text-align:left;line-height:1.12;overflow:hidden;display:block;cursor:pointer;font-family:var(--sans)}
.mapa-zona span{display:block;white-space:pre-wrap;overflow-wrap:anywhere}
.mapa-zona:hover{border-color:var(--acento);background:#4081d222}
.mapa-zona.vacio{background:#ffd88033;border-color:#e0b25455}
.mapa-zona.aviso{background:#ff7a5933;border-color:#ff7a59aa}
.mapa-zona.elegida{border:2px solid var(--acento);background:#4081d233;box-shadow:0 0 0 3px #4081d255}
.mapa-casilla{position:absolute;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#17181A}
.mapa-pie{margin:0 0 10px;font-size:11px;color:var(--gris)}
.rev-lista h3{margin:0 0 4px;font-size:15px;color:var(--titulo)}
.rev-lista .sub{margin:0 0 10px;font-size:12px}
.buscar-campo input{width:100%;box-sizing:border-box;margin-bottom:8px}
.rev-pagina{margin:16px 0 4px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--acento-texto)}
.rev-campo .rev-nombre{font-weight:700;color:var(--titulo)}
.rev-campo summary small{display:block;font-weight:400;color:var(--gris);margin-top:3px;font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rev-campo.elegido{background:var(--acento-hondo);border-radius:10px;padding:10px;margin:0 -10px;border-bottom-color:transparent}
.rev-campo.aviso .rev-nombre{color:var(--ambar,#e0a355)}
.rev-campo.vacio summary small{color:#c9a34e}
.fila-union{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:10px 0;font-size:13px;color:var(--suave)}
.fila-union strong{color:var(--titulo)}
.lista-asistentes{margin:10px 0}
.fila-asistente{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0;font-size:13px;color:var(--suave)}
.fila-asistente strong{color:var(--titulo)}
.enlace-invitacion{word-break:break-all;font-size:12px;background:var(--hondo);border:1px solid var(--borde);border-radius:10px;padding:10px;color:var(--acento-texto)}