/* Achik: estilos de la aplicación. Base copiada de Triaje (webs/triaje-sistema/public/css/app.css), mismos colores.
   Menú lateral azul noche con el amarillo de marca como selección; contenido claro para trabajar con datos.
   Al final, las piezas propias de un hospital (turnos, agenda, caja, visor, pantalla de la sala). */
:root {
  --noche: #131234; --noche-hondo: #0c0b26; --noche-alto: #1e1d4b; --noche-linea: rgba(255,255,255,.12);
  --amarillo: #fddf01; --violeta: #6951e4; --violeta-hondo: #5842cc; --violeta-suave: #eeebfd; --naranja: #df602f;
  --fondo: #f3f3f8; --panel: #ffffff; --panel-2: #f8f8fb;
  --tinta: #131234; --tinta-2: #4a4968; --tinta-3: #6e6d8a;
  --linea: rgba(19,18,52,.11); --linea-2: rgba(19,18,52,.18);
  --ok: #1d7a52; --ok-f: #e2f4ea; --aviso: #8a5c00; --aviso-f: #fff2cc; --error: #b3261e; --error-f: #fde7e5; --info: #5842cc; --info-f: #eeebfd; --neutro-f: #eeeef4;
  --wa: #25d366;
  --r: 12px; --r-s: 8px; --r-l: 16px;
  --sombra: 0 1px 2px rgba(19,18,52,.06), 0 4px 14px -6px rgba(19,18,52,.12);
  --sombra-alta: 0 24px 60px -20px rgba(12,11,38,.45);
  --f: "Poppins", ui-sans-serif, system-ui, sans-serif;
  --menu: 248px; --cab: 60px;
  --t: 180ms cubic-bezier(.2,.7,.3,1);
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--f); font-size: 14.5px; line-height: 1.5; color: var(--tinta); background: var(--fondo); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: var(--violeta-hondo); text-underline-offset: .2em; }
button, input, select, textarea { font: inherit; color: inherit; }
img, svg { display: block; max-width: 100%; }
::selection { background: var(--amarillo); color: var(--noche); }
:focus-visible { outline: 2.5px solid var(--violeta); outline-offset: 2px; border-radius: 6px; }
.oculto, [hidden] { display: none !important; }
.solo-lector { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ico { width: 18px; height: 18px; flex: none; }
.num { font-variant-numeric: tabular-nums; }
.tenue { color: var(--tinta-3); }
.suave { color: var(--tinta-2); }
.nowrap { white-space: nowrap; }
.pre { white-space: pre-wrap; word-break: break-word; }
html { scrollbar-color: #c9c8da transparent; }

/* ---------------------------------------------------------------- estructura */
.marco { display: grid; grid-template-columns: var(--menu) minmax(0, 1fr); min-height: 100dvh; }
.lateral { position: sticky; top: 0; height: 100dvh; background: var(--noche); color: #fff; display: flex; flex-direction: column; padding: 18px 12px 14px; overflow-y: auto; scrollbar-color: #3a3970 transparent; }
.lateral__logo { display: flex; align-items: center; gap: 10px; padding: 2px 10px 20px; color: #fff; text-decoration: none; }
.lateral__logo svg { width: 108px; height: auto; overflow: visible; }
.lateral__logo .trazo { stroke: var(--violeta); }
.lateral__rol { margin-left: auto; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: #bdb4f2; border: 1px solid var(--noche-linea); padding: 2px 8px; border-radius: 999px; }
.nav { display: grid; gap: 2px; }
.nav__grupo { margin: 14px 10px 6px; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: #8f8dbb; }
.nav a { display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 10px; color: #e6e5f5; text-decoration: none; font-weight: 500; font-size: .93rem; transition: background var(--t), color var(--t); }
.nav a .ico { color: #bdb4f2; transition: color var(--t); }
.nav a:hover { background: var(--noche-alto); color: #fff; }
.nav a[aria-current="page"] { background: var(--amarillo); color: var(--noche); font-weight: 600; }
.nav a[aria-current="page"] .ico { color: var(--noche); }
.nav__cuenta { margin-left: auto; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--naranja); color: #fff; font-size: .72rem; font-weight: 600; display: grid; place-items: center; }
.nav a[aria-current="page"] .nav__cuenta { background: var(--noche); color: var(--amarillo); }
.lateral__pie { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--noche-linea); display: flex; align-items: center; gap: 10px; }
.lateral__pie .avatar { background: var(--violeta); color: #fff; }
.lateral__yo { min-width: 0; flex: 1; }
.lateral__yo strong { display: block; font-size: .88rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lateral__yo a { color: #bdb4f2; font-size: .78rem; text-decoration: none; }
.lateral__yo a:hover { color: var(--amarillo); }
.lateral__salir { background: none; border: 0; color: #bdb4f2; padding: 8px; border-radius: 8px; cursor: pointer; }
.lateral__salir:hover { background: var(--noche-alto); color: #fff; }

.principal { min-width: 0; display: flex; flex-direction: column; }
.cabecera { position: sticky; top: 0; z-index: 20; height: var(--cab); display: flex; align-items: center; gap: 12px; padding: 0 28px; background: rgba(243,243,248,.88); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linea); }
.cabecera__menu, .btn.cabecera__menu { display: none; }
.cabecera__titulo { font-size: 1.05rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.cabecera__migas { color: var(--tinta-3); font-weight: 500; text-decoration: none; }
.cabecera__migas:hover { color: var(--violeta-hondo); }
.cabecera__buscar { margin-left: auto; position: relative; width: min(390px, 40vw); }
.cabecera__buscar input { width: 100%; height: 38px; padding: 0 12px 0 36px; border-radius: 10px; border: 1px solid var(--linea-2); background: #fff; }
.cabecera__buscar .ico { position: absolute; left: 11px; top: 10px; color: var(--tinta-3); }
.buscar__res { position: absolute; top: 44px; left: 0; right: 0; background: #fff; border: 1px solid var(--linea); border-radius: var(--r); box-shadow: var(--sombra-alta); padding: 6px; max-height: 60vh; overflow: auto; }
.buscar__res a { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 8px; color: var(--tinta); text-decoration: none; }
.buscar__res a:hover, .buscar__res a:focus { background: var(--fondo); outline: none; }
.demo-aviso { display: flex; gap: 10px; align-items: center; margin: 14px 28px 0; padding: 10px 14px; border-radius: 12px; background: var(--info-f); color: var(--info); font-size: .86rem; font-weight: 500; }
@media (max-width: 900px) { .demo-aviso { margin: 12px 14px 0; } }
.contenido { padding: 24px 28px 60px; width: 100%; max-width: 1400px; }

/* ---------------------------------------------------------------- tipografía de página */
.titulo-pag { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-bottom: 20px; }
.titulo-pag h1 { font-size: 1.6rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.acciones { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.titulo-pag .acciones { margin-left: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.subtitulo { font-size: 1rem; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.subtitulo .ico { color: var(--violeta); }
.sub-acciones { margin-left: auto; display: flex; gap: 6px; }

/* ---------------------------------------------------------------- botones */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--linea-2); background: #fff; color: var(--tinta); font-weight: 500; font-size: .9rem; cursor: pointer; text-decoration: none; white-space: nowrap; transition: background var(--t), border-color var(--t), transform 80ms; }
.btn:hover { background: var(--panel-2); border-color: #b9b8cf; }
.btn:active { transform: scale(.98); }
.btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; }
.btn--primario { background: var(--noche); border-color: var(--noche); color: var(--amarillo); font-weight: 600; }
.btn--primario:hover { background: var(--noche-alto); border-color: var(--noche-alto); }
.btn--amarillo { background: var(--amarillo); border-color: var(--amarillo); color: var(--noche); font-weight: 600; }
.btn--amarillo:hover { background: #fff06a; border-color: #fff06a; }
.btn--wa { background: var(--wa); border-color: var(--wa); color: #fff; font-weight: 600; }
.btn--wa:hover { background: #1fb858; border-color: #1fb858; }
.btn--peligro { color: var(--error); }
.btn--peligro:hover { background: var(--error-f); border-color: #f1b6b0; }
.btn--fantasma { border-color: transparent; background: transparent; }
.btn--fantasma:hover { background: rgba(19,18,52,.06); border-color: transparent; }
.btn--chico { height: 30px; padding: 0 10px; font-size: .82rem; border-radius: 8px; gap: 6px; }
.btn--chico .ico { width: 16px; height: 16px; }
.btn--icono { width: 38px; padding: 0; }
.btn--chico.btn--icono { width: 30px; }
.btn.cargando { color: transparent !important; position: relative; pointer-events: none; }
.btn.cargando::after { content: ""; position: absolute; width: 16px; height: 16px; border: 2px solid var(--tinta-3); border-right-color: transparent; border-radius: 50%; animation: gira .7s linear infinite; }
.btn--primario.cargando::after { border-color: var(--amarillo); border-right-color: transparent; }
@keyframes gira { to { transform: rotate(360deg); } }

/* ---------------------------------------------------------------- paneles */
.panel { background: var(--panel); border: 1px solid var(--linea); border-radius: var(--r-l); padding: 18px 20px; box-shadow: var(--sombra); min-width: 0; }
.panel--plano { box-shadow: none; }
.panel + .panel { margin-top: 16px; }
.rejilla > .panel + .panel, .pila > .panel + .panel { margin-top: 0; }
.rejilla { display: grid; gap: 16px; }
.rejilla--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rejilla--lado { grid-template-columns: minmax(0, 1fr) 360px; align-items: start; }
.pila > * + * { margin-top: 16px; }

/* métricas del tablero */
.metricas { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: 12px; margin-bottom: 18px; }
/* tablero de Inicio: 7 tarjetas; la primera ocupa dos columnas para que ninguna quede sola en una fila (revisión 25/09) */
.metricas--tablero { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metricas--tablero > :first-child { grid-column: span 2; }
@media (max-width: 640px) { .metricas--tablero { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.metrica { background: #fff; border: 1px solid var(--linea); border-radius: var(--r-l); padding: 14px 16px; text-decoration: none; color: inherit; display: grid; gap: 2px; transition: border-color var(--t), transform var(--t); }
a.metrica:hover { border-color: var(--violeta); }
.metrica__n { font-size: 1.75rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.metrica__t { font-size: .84rem; color: var(--tinta-2); }
.metrica__x { font-size: .78rem; color: var(--tinta-3); }
.metrica--noche { background: var(--noche); color: #fff; border-color: var(--noche); }
.metrica--noche .metrica__t, .metrica--noche .metrica__x { color: #bdb4f2; }
.metrica--noche .metrica__n { color: var(--amarillo); }
.metrica--alerta .metrica__n { color: var(--error); }

.barras { display: grid; gap: 8px; }
.barra { display: grid; grid-template-columns: minmax(0, 170px) 1fr 36px; gap: 10px; align-items: center; font-size: .86rem; }
.barra__pista { height: 10px; border-radius: 6px; background: var(--neutro-f); overflow: hidden; }
.barra__lleno { height: 100%; border-radius: 6px; background: var(--c, var(--violeta)); }
.barra__n { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- chips y avatar */
.chip { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 999px; font-size: .74rem; font-weight: 600; white-space: nowrap; background: var(--neutro-f); color: var(--tinta-2); }
.chip--ok { background: var(--ok-f); color: var(--ok); }
.chip--aviso { background: var(--aviso-f); color: var(--aviso); }
.chip--error { background: var(--error-f); color: var(--error); }
.chip--info { background: var(--info-f); color: var(--info); }
.chip--noche { background: var(--noche); color: var(--amarillo); }
.chip--demo { background: #fff; border: 1px dashed var(--tinta-3); color: var(--tinta-3); }
.chip .punto { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.tipo-proc { display: inline-flex; align-items: flex-start; gap: 7px; font-weight: 500; }
.tipo-proc i { margin-top: .42em; width: 10px; height: 10px; border-radius: 3px; background: var(--c); flex: none; box-shadow: inset 0 0 0 1px rgba(19,18,52,.15); }
.avatar { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: .78rem; font-weight: 600; flex: none; background: var(--violeta-suave); color: var(--violeta-hondo); }
.avatar--chico { width: 26px; height: 26px; font-size: .68rem; }

/* ---------------------------------------------------------------- tablas */
.tabla-env { overflow-x: auto; border: 1px solid var(--linea); border-radius: var(--r-l); background: #fff; }
.tabla { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tabla th { text-align: left; font-weight: 600; font-size: .76rem; letter-spacing: .02em; color: var(--tinta-2); background: var(--panel-2); padding: 10px 14px; border-bottom: 1px solid var(--linea); white-space: nowrap; }
.tabla td { padding: 11px 14px; border-bottom: 1px solid var(--linea); vertical-align: middle; }
.tabla tr:last-child td { border-bottom: 0; }
.tabla tbody tr { transition: background var(--t); }
.tabla tbody tr[data-href], .tabla tbody tr.clic { cursor: pointer; }
.tabla tbody tr[data-href]:hover { background: #f7f6fd; }
.tabla .der { text-align: right; }
.celda-nombre { display: flex; align-items: center; gap: 10px; min-width: 180px; }
.celda-nombre strong { font-weight: 600; display: block; }
.celda-nombre span { font-size: .8rem; color: var(--tinta-3); }
.progreso { display: flex; align-items: center; gap: 8px; min-width: 120px; }
.progreso__pista { flex: 1; height: 6px; border-radius: 4px; background: var(--neutro-f); overflow: hidden; }
.progreso__lleno { height: 100%; background: var(--violeta); border-radius: 4px; }
.progreso span { font-size: .76rem; color: var(--tinta-3); font-variant-numeric: tabular-nums; }

/* barra de filtros */
.filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; }
.pestanas { display: inline-flex; background: #fff; border: 1px solid var(--linea-2); border-radius: 10px; padding: 3px; gap: 2px; }
.pestanas button, .pestanas a { height: 30px; padding: 0 12px; border-radius: 7px; border: 0; background: transparent; cursor: pointer; font-weight: 500; font-size: .86rem; color: var(--tinta-2); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.pestanas [aria-pressed="true"], .pestanas [aria-current="page"] { background: var(--noche); color: #fff; }
.pestanas .cuenta { font-size: .72rem; opacity: .75; font-variant-numeric: tabular-nums; }
.filtros select, .filtros input[type="search"] { height: 38px; border: 1px solid var(--linea-2); border-radius: 10px; background: #fff; padding: 0 12px; }
.filtros input[type="search"] { min-width: 220px; }
/* filtros de la lista de Estudios (28/10/2026): tipo, fecha del estudio y buscador; en el teléfono la fecha y el buscador van a lo ancho */
.filtros-est__fecha { height: 38px; border: 1px solid var(--linea-2); border-radius: 10px; background: #fff; padding: 0 10px; font: inherit; font-size: .9rem; color: var(--tinta); }
.filtros-est__fecha:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(105,81,228,.18); }
.filtros-est__q { flex: 1 1 240px; min-width: 250px; max-width: 360px; }
.filtros .filtros-est__q input[type="search"] { width: 100%; height: 38px; min-width: 0; padding: 0 12px 0 36px; }
.filtros-est .buscador > .ico { top: 10px; }
/* rango de fechas (29/10/2026): "Desde" y "Hasta" pegados a su campo */
.filtros-est__rango { display: flex; flex-wrap: wrap; gap: 8px; }
.filtros-est__rango label { display: flex; align-items: center; gap: 6px; font-size: .84rem; color: var(--tinta-2); }
@media (max-width: 640px) { .filtros-est__rango { flex: 1 1 100%; } .filtros-est__rango label { flex: 1 1 140px; } .filtros-est__rango label span { min-width: 44px; } .filtros-est__fecha { flex: 1 1 auto; min-width: 0; } .filtros-est__q { max-width: none; min-width: 0; flex-basis: 100%; } }

/* ---------------------------------------------------------------- formularios */
.form { display: grid; gap: 14px; }
.form__fila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.form__fila--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.campo { display: grid; gap: 5px; min-width: 0; }
.campo > span, .campo legend { font-size: .82rem; font-weight: 600; color: var(--tinta-2); }
.campo input:not([type=checkbox]):not([type=radio]), .campo select, .campo textarea, .input {
  width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--linea-2); border-radius: 10px; background: #fff; transition: border-color var(--t), box-shadow var(--t); }
.campo textarea { height: auto; min-height: 90px; padding: 10px 12px; resize: vertical; line-height: 1.5; }
.campo input:focus, .campo select:focus, .campo textarea:focus, .input:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(105,81,228,.18); }
.campo input::placeholder, .campo textarea::placeholder { color: #9796ae; }
.campo--error input, .campo--error select, .campo--error textarea { border-color: var(--error); }
.campo small { font-size: .78rem; color: var(--tinta-3); }
.marca { display: flex; align-items: center; gap: 9px; font-size: .9rem; cursor: pointer; }
.marca input { width: 18px; height: 18px; accent-color: var(--violeta); }
.aviso-form { padding: 10px 12px; border-radius: 10px; background: var(--error-f); color: var(--error); font-size: .88rem; font-weight: 500; }
.aviso-form--info { background: var(--info-f); color: var(--info); }
.aviso-form--ok { background: var(--ok-f); color: var(--ok); }
.aviso-form--aviso { background: var(--aviso-f); color: var(--aviso); }

/* ---------------------------------------------------------------- lista de datos (ficha) */
.datos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; }
.datos div { min-width: 0; }
.datos dt { font-size: .76rem; color: var(--tinta-3); font-weight: 500; }
.datos dd { font-weight: 500; word-break: break-word; }
.datos dd:empty::before { content: "–"; color: var(--tinta-3); }
.ficha-cab { display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 18px; }
.ficha-cab .avatar { width: 56px; height: 56px; font-size: 1.1rem; background: var(--noche); color: var(--amarillo); }
.ficha-cab h1 { font-size: 1.55rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.ficha-cab__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 6px; color: var(--tinta-2); font-size: .88rem; align-items: center; }
.ficha-cab__meta a, .ficha-cab__meta span { color: inherit; text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }
.ficha-cab__meta .ico { width: 16px; height: 16px; }
.ficha-cab__meta a:hover { color: var(--violeta-hondo); }
.ficha-cab .acciones { margin-left: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--linea); margin-bottom: 18px; overflow-x: auto; }
.tabs button { height: 40px; padding: 0 14px; border: 0; background: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 500; color: var(--tinta-2); cursor: pointer; white-space: nowrap; display: inline-flex; gap: 6px; align-items: center; }
.tabs button:hover { color: var(--tinta); }
.tabs button[aria-selected="true"] { color: var(--tinta); border-bottom-color: var(--violeta); font-weight: 600; }
.tabs .cuenta { font-size: .72rem; background: var(--neutro-f); border-radius: 999px; padding: 0 7px; font-variant-numeric: tabular-nums; }

/* embudo de etapas del cliente */
.embudo-etapas { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 16px; }
.embudo-etapas button { height: 32px; padding: 0 12px; border: 1px solid var(--linea-2); background: #fff; border-radius: 8px; font-size: .82rem; font-weight: 500; color: var(--tinta-2); cursor: pointer; }
.embudo-etapas button:hover { border-color: var(--violeta); }
.embudo-etapas button[aria-pressed="true"] { background: var(--noche); color: var(--amarillo); border-color: var(--noche); }
.embudo-etapas button.pasada { background: var(--violeta-suave); color: var(--violeta-hondo); border-color: transparent; }
.embudo-etapas button.perdido[aria-pressed="true"] { background: var(--error); color: #fff; border-color: var(--error); }

/* línea de tiempo */
.tiempo { display: grid; gap: 0; }
.tiempo li { position: relative; display: grid; grid-template-columns: 28px 1fr; gap: 10px; padding-bottom: 14px; }
.tiempo li::before { content: ""; position: absolute; left: 13px; top: 26px; bottom: 0; width: 2px; background: var(--linea); }
.tiempo li:last-child::before { display: none; }
.tiempo__ico { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--neutro-f); color: var(--tinta-2); }
.tiempo__ico .ico { width: 14px; height: 14px; }
.tiempo__ico--whatsapp { background: #dcf7e6; color: #11884a; }
.tiempo__ico--cambio_etapa, .tiempo__ico--etapa { background: var(--info-f); color: var(--info); }
.tiempo__ico--web { background: var(--aviso-f); color: var(--aviso); }
.tiempo__ico--cobro { background: var(--ok-f); color: var(--ok); }
.tiempo__ico--nota { background: #fff6bf; color: #6b5800; }
.tiempo__cab { font-size: .78rem; color: var(--tinta-3); display: flex; gap: 8px; flex-wrap: wrap; }
.tiempo__txt { white-space: pre-wrap; word-break: break-word; margin-top: 2px; }
.nota-rapida { display: grid; gap: 8px; margin-bottom: 18px; padding: 12px; border: 1px solid var(--linea); border-radius: var(--r); background: var(--panel-2); }
.nota-rapida textarea { min-height: 64px; }
.nota-rapida__pie { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.nota-rapida__pie select, .nota-rapida__pie input { height: 34px; border: 1px solid var(--linea-2); border-radius: 8px; padding: 0 10px; background: #fff; }

/* etapas del proceso (stepper vertical) */
.etapas { display: grid; }
.etapa { position: relative; display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; padding: 0 0 16px; }
.etapa::before { content: ""; position: absolute; left: 16px; top: 34px; bottom: 0; width: 2px; background: var(--linea); }
.etapa:last-child::before { display: none; }
.etapa__n { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-weight: 600; font-size: .85rem; background: #fff; border: 2px solid var(--linea-2); color: var(--tinta-3); position: relative; z-index: 1; }
.etapa--hecha .etapa__n { background: var(--violeta); border-color: var(--violeta); color: #fff; }
.etapa--hecha::before { background: var(--violeta); }
.etapa--en_curso .etapa__n { background: var(--amarillo); border-color: var(--amarillo); color: var(--noche); box-shadow: 0 0 0 4px rgba(253,223,1,.3); }
.etapa--omitida .etapa__n { border-style: dashed; }
.etapa--omitida .etapa__nombre { text-decoration: line-through; color: var(--tinta-3); }
.etapa__nombre { font-weight: 600; padding-top: 6px; }
.etapa__desc { font-size: .84rem; color: var(--tinta-2); margin-top: 2px; }
.etapa__meta { font-size: .78rem; color: var(--tinta-3); margin-top: 4px; display: flex; gap: 10px; flex-wrap: wrap; }
.etapa__meta span, .lista__der, .tarjeta__meta span { display: inline-flex; gap: 4px; align-items: center; }
.etapa__meta .ico { width: 14px; height: 14px; }
.etapa__acc { display: flex; gap: 4px; padding-top: 2px; }
.vence-rojo { color: var(--error); font-weight: 600; }
.vence-ambar { color: var(--aviso); font-weight: 600; }

/* requisitos de documentos */
.requisitos { display: grid; gap: 6px; }
.req { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 9px 10px; border: 1px solid var(--linea); border-radius: 10px; background: #fff; }
.req__ico { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--neutro-f); color: var(--tinta-3); }
.req__ico .ico { width: 14px; height: 14px; }
.req--recibido .req__ico { background: var(--info-f); color: var(--info); }
.req--aprobado .req__ico { background: var(--ok-f); color: var(--ok); }
.req--rechazado .req__ico { background: var(--error-f); color: var(--error); }
.req--no_aplica { opacity: .6; }
.req__nombre { font-weight: 500; font-size: .9rem; }
.req__nota { font-size: .78rem; color: var(--error); }
.req select { height: 30px; border: 1px solid var(--linea-2); border-radius: 8px; padding: 0 8px; font-size: .82rem; background: #fff; }

/* archivos */
.archivos { display: grid; gap: 6px; }
.archivo { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--linea); border-radius: 10px; background: #fff; }
.archivo__ico { width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center; background: var(--violeta-suave); color: var(--violeta-hondo); }
.archivo__nombre { font-weight: 500; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archivo__meta { font-size: .76rem; color: var(--tinta-3); }
.archivo__acc { display: flex; gap: 2px; }
.soltar { display: grid; justify-items: center; gap: 6px; padding: 22px 14px; border: 2px dashed #c3c2d8; border-radius: var(--r); background: var(--panel-2); text-align: center; cursor: pointer; transition: border-color var(--t), background var(--t); position: relative; }
.soltar:hover, .soltar.encima { border-color: var(--violeta); background: #f1effd; }
.soltar input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.soltar .ico { width: 28px; height: 28px; color: var(--violeta); }
.soltar strong { font-weight: 600; }
.soltar span { font-size: .82rem; color: var(--tinta-3); }
.subiendo { height: 6px; border-radius: 4px; background: var(--neutro-f); overflow: hidden; }
.subiendo i { display: block; height: 100%; background: var(--violeta); transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform .2s linear; }

/* kanban */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 12px; align-items: start; }
.columna { background: #e9e9f1; border-radius: var(--r-l); padding: 10px; min-height: 200px; transition: background var(--t); }
.columna.encima { background: #dedaf8; }
.columna__cab { display: flex; align-items: center; gap: 8px; padding: 4px 6px 10px; font-weight: 600; font-size: .88rem; }
.columna__cab .chip { margin-left: auto; background: #fff; }
.columna__lista { display: grid; gap: 8px; }
.tarjeta { background: #fff; border: 1px solid var(--linea); border-radius: 12px; padding: 10px 12px; display: grid; gap: 4px; cursor: grab; text-decoration: none; color: inherit; box-shadow: 0 1px 2px rgba(19,18,52,.05); transition: box-shadow var(--t), border-color var(--t); }
.tarjeta:hover { border-color: var(--violeta); }
.tarjeta.arrastrando { opacity: .5; }
.tarjeta strong { font-weight: 600; font-size: .9rem; }
.tarjeta__meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .76rem; color: var(--tinta-3); align-items: center; }

/* vacíos y carga */
.vacio { text-align: center; padding: 38px 20px; color: var(--tinta-2); display: grid; justify-items: center; gap: 8px; }
.vacio > .ico { width: 40px; height: 40px; color: #b9b3ee; }   /* solo el ícono del aviso: el de un botón de la acción va de su tamaño (21/10/2026) */
.vacio strong { color: var(--tinta); font-size: 1rem; }
.vacio p { max-width: 42ch; font-size: .9rem; }
.esqueleto { border-radius: 10px; background: linear-gradient(90deg, #ececf3 25%, #f6f6fa 50%, #ececf3 75%); background-size: 200% 100%; animation: brillo 1.2s ease-in-out infinite; }
@keyframes brillo { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .esqueleto { animation: none; } }

/* lista simple */
.lista { display: grid; }
.lista > li, .lista > a { display: flex; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--linea); text-decoration: none; color: inherit; min-width: 0; }
.lista > :last-child { border-bottom: 0; }
.lista a:hover strong { color: var(--violeta-hondo); }
.lista__txt { min-width: 0; flex: 1; }
.lista a, a.lista__txt { text-decoration: none; color: inherit; }
.lista__txt strong { font-weight: 600; display: block; font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lista__txt span { font-size: .8rem; color: var(--tinta-3); }
.lista__der { margin-left: auto; text-align: right; font-size: .8rem; flex: none; }

/* ---------------------------------------------------------------- diálogo lateral y modal */
dialog.lado { margin: 0 0 0 auto; height: 100dvh; max-height: 100dvh; width: min(540px, 100vw); max-width: 100vw; border: 0; padding: 0; background: #fff; box-shadow: var(--sombra-alta); }
dialog.lado[open] { animation: entra .22s cubic-bezier(.2,.7,.3,1); }
dialog.centro { width: min(460px, calc(100vw - 32px)); border: 0; border-radius: var(--r-l); padding: 0; box-shadow: var(--sombra-alta); }
dialog::backdrop { background: rgba(12,11,38,.45); }
@keyframes entra { from { transform: translateX(24px); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { dialog.lado[open] { animation: none; } }
.dlg { display: flex; flex-direction: column; height: 100%; }
.dlg__cab { display: flex; align-items: center; gap: 10px; padding: 16px 20px; border-bottom: 1px solid var(--linea); }
.dlg__cab h2 { font-size: 1.1rem; font-weight: 600; }
.dlg__cab .btn { margin-left: auto; }
.dlg__cuerpo { padding: 18px 20px; overflow-y: auto; flex: 1; }
.dlg__pie { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding: 14px 20px; border-top: 1px solid var(--linea); background: var(--panel-2); }
dialog.centro .dlg__cuerpo p { color: var(--tinta-2); }
/* confirmación dentro del panel lateral (T.confirmar con un panel abierto) */
.confirma-lado { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; padding: 16px; background: rgba(12,11,38,.45); }
/* sin panel abierto: fija a la pantalla, encima de todo (T.confirmar, 24/10/2026) */
.confirma-lado--fija { position: fixed; z-index: 1000; }
.confirma-lado .dlg { height: auto; width: min(460px, 100%); background: #fff; border-radius: var(--r-l); box-shadow: var(--sombra-alta); overflow: hidden; }
.confirma-lado .dlg__cuerpo p { color: var(--tinta-2); margin: 0; }

/* compositor de mensajes */
.plantillas { display: grid; gap: 4px; max-height: 240px; overflow-y: auto; padding: 4px; border: 1px solid var(--linea); border-radius: 10px; }
.plantillas button { text-align: left; border: 0; background: transparent; padding: 7px 10px; border-radius: 8px; cursor: pointer; display: flex; justify-content: space-between; gap: 10px; font-size: .88rem; }
.plantillas button:hover { background: var(--fondo); }
.plantillas button[aria-pressed="true"] { background: var(--violeta-suave); color: var(--violeta-hondo); font-weight: 600; }
.plantillas .cat { font-size: .72rem; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .06em; padding: 8px 10px 2px; }
.vista-msg { min-height: 220px !important; font-size: .9rem; }

/* avisos flotantes */
.avisos { position: fixed; z-index: 100; right: 18px; bottom: 18px; display: grid; gap: 8px; }
.aviso { background: var(--noche); color: #fff; padding: 11px 16px; border-radius: 12px; box-shadow: var(--sombra-alta); font-size: .9rem; display: flex; gap: 10px; align-items: center; animation: sube .2s ease-out; max-width: 420px; }
.aviso .ico { color: var(--amarillo); }
.aviso--error { background: var(--error); }
.aviso--error .ico { color: #fff; }
@keyframes sube { from { transform: translateY(8px); opacity: 0; } }

/* páginas públicas (entrar, activar, subir) */
.solo { min-height: 100dvh; display: grid; place-items: center; padding: 24px 16px; background: var(--noche); position: relative; overflow: hidden; }
.solo::before { content: ""; position: absolute; width: 140vmax; height: 140vmax; right: -70vmax; top: -70vmax; background: radial-gradient(closest-side, rgba(214,150,104,.3), transparent 62%); pointer-events: none; }
.solo__caja { position: relative; width: min(440px, 100%); background: #fff; border-radius: 22px; padding: 30px 28px; box-shadow: var(--sombra-alta); }
.solo__caja--ancha { width: min(640px, 100%); }
.solo__logo { width: 170px; height: auto; margin-bottom: 20px; }
.solo__logo .trazo { stroke: var(--amarillo); }
.solo h1 { font-size: 1.45rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.25; margin-bottom: 6px; }
.solo__sub { color: var(--tinta-2); margin-bottom: 20px; }
.solo__pie { position: relative; margin-top: 18px; color: #bdb4f2; font-size: .8rem; text-align: center; }
.solo__pie a { color: #fff; }

/* portal del cliente */
.portal-hero { background: var(--noche); color: #fff; border-radius: var(--r-l); padding: 22px 24px; position: relative; overflow: hidden; margin-bottom: 18px; }
.portal-hero h1 { color: var(--amarillo); font-size: 1.6rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.15; }
.portal-hero p { color: #d2d3d7; margin-top: 6px; max-width: 60ch; }
.portal-hero svg.trazo-fondo { position: absolute; right: -60px; bottom: -40px; width: 280px; opacity: .22; max-width: none; }
.portal-hero h1, .portal-hero p { position: relative; }
.portal-hero svg.trazo-fondo path { stroke: var(--violeta); }
.pasos-cli { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.pasos-cli i { width: 26px; height: 8px; border-radius: 4px; background: #e4e3ee; }
.pasos-cli i.hecho { background: var(--violeta); }
.pasos-cli i.actual { background: var(--amarillo); }

/* ---------------------------------------------------------------- responsive */
@media (max-width: 1100px) {
  .rejilla--lado { grid-template-columns: 1fr; }
  .rejilla--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .marco { grid-template-columns: 1fr; }
  .lateral { position: fixed; z-index: 50; left: 0; top: 0; width: min(290px, 86vw); transform: translateX(-102%); transition: transform .25s cubic-bezier(.2,.7,.3,1); box-shadow: var(--sombra-alta); }
  .marco.menu-abierto .lateral { transform: none; }
  .marco.menu-abierto::after { content: ""; position: fixed; inset: 0; z-index: 40; background: rgba(12,11,38,.45); }
  .cabecera { padding: 0 14px; }
  .cabecera__menu, .btn.cabecera__menu { display: inline-flex; }
  .cabecera__buscar { width: auto; flex: 1; max-width: 260px; }
  .contenido { padding: 16px 14px 70px; }
  .rejilla--2, .rejilla--3, .form__fila, .form__fila--3, .datos { grid-template-columns: 1fr; }
  .titulo-pag h1 { font-size: 1.35rem; }
  .ficha-cab .acciones { margin-left: 0; width: 100%; }
  /* tablas como tarjetas */
  .tabla--tarjetas thead { display: none; }
  .tabla--tarjetas, .tabla--tarjetas tbody, .tabla--tarjetas tr, .tabla--tarjetas td { display: block; width: 100%; }
  .tabla--tarjetas tr { padding: 10px 12px; border-bottom: 1px solid var(--linea); }
  .tabla--tarjetas td { border: 0; padding: 3px 0; overflow-wrap: anywhere; }   /* un código largo sin espacios (el sha256 de la bitácora) se parte en vez de salirse de la tarjeta */
  .tabla--tarjetas td[data-t]::before { content: attr(data-t) " · "; color: var(--tinta-3); font-size: .78rem; }
  .tabla--tarjetas .der { text-align: left; }
  .etapa { grid-template-columns: 34px 1fr; }
  .lista > li, .lista > a { flex-wrap: wrap; row-gap: 6px; }
  .lista__txt { flex-basis: calc(100% - 60px); }
  .lista .lista__txt strong { white-space: normal; }
  .etapa__acc { grid-column: 2; }
}
@media (max-width: 520px) {
  .cabecera__buscar { display: none; }
  .metricas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metrica__n { font-size: 1.45rem; }
}

/* ================================================================ Achik: piezas propias */
.lateral__logo img { width: 118px; height: auto; }
.lateral__org { margin: -8px 10px 14px; padding: 10px 12px; border-radius: 10px; background: var(--noche-alto); display: grid; gap: 1px; }
.lateral__org strong { font-size: .9rem; color: #fff; }
.lateral__org span { font-size: .74rem; color: #bdb4f2; }
.asistencia { margin: 14px 4px 0; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; border: 1px dashed var(--noche-linea); background: transparent; color: #e6e5f5; cursor: pointer; font-weight: 500; font-size: .86rem; }
.asistencia:hover { background: var(--noche-alto); }
.asistencia .ico { color: var(--amarillo); }

/* buscador de pacientes (cabecera y formularios) */
.buscador { position: relative; }
.buscador > .ico { position: absolute; left: 11px; top: 11px; color: var(--tinta-3); }
.buscador input { width: 100%; height: 40px; padding: 0 12px 0 36px; border-radius: 10px; border: 1px solid var(--linea-2); background: #fff; }
/* Dentro de un .campo (p. ej. Nuevo turno) la regla general de inputs pisaba el lugar de la lupa */
.campo .buscador input:not([type=checkbox]):not([type=radio]) { padding-left: 36px; }
.buscador input:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(105,81,228,.18); }
.buscador .buscar__res { top: 46px; z-index: 30; }
.buscador--grande input { height: 50px; font-size: 1.05rem; }
.buscador--grande .buscador > .ico { top: 16px; }
.buscar__res a b { min-width: 52px; font-variant-numeric: tabular-nums; color: var(--violeta-hondo); }
.cabecera__buscar .buscador > .ico { top: 10px; }
.cabecera__buscar .buscador input { height: 38px; }

.fila-acc { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; align-items: center; }
.num { font-variant-numeric: tabular-nums; }
.nowrap { white-space: nowrap; }
.chip--neutro { background: var(--neutro-f); }
tr.anulado td { color: var(--tinta-3); text-decoration: line-through; }
tr.anulado td .fila-acc, tr.anulado td .btn { text-decoration: none; }
.campo--linea { display: flex; align-items: center; gap: 8px; }
.metrica__n small { font-size: .9rem; font-weight: 600; color: var(--tinta-3); }

/* turnos */
.turno-n { display: inline-grid; place-items: center; min-width: 54px; height: 40px; padding: 0 10px; border-radius: 10px; background: var(--noche); color: var(--amarillo); font-weight: 800; font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.turno-n--prio { background: var(--naranja); color: #fff; }
.turno-grande { text-align: center; padding: 26px 10px; border-radius: var(--r-l); background: var(--noche); color: #fff; }
.turno-grande span { display: block; font-size: .9rem; color: #bdb4f2; text-transform: uppercase; letter-spacing: .12em; }
.turno-grande strong { display: block; font-size: 5.5rem; line-height: 1; color: var(--amarillo); font-weight: 800; font-variant-numeric: tabular-nums; }
.alergias { display: inline-flex; gap: 6px; align-items: center; margin-top: 8px; padding: 3px 10px; border-radius: 999px; font-size: .82rem; font-weight: 600; background: var(--neutro-f); color: var(--tinta-2); }
.alergias .ico { width: 15px; height: 15px; }
.alergias--si { background: var(--error-f); color: var(--error); }

/* colas (médico y enfermería) */
.cola { display: grid; gap: 10px; }
.cola__item { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 14px 16px; background: #fff; border: 1px solid var(--linea); border-radius: var(--r-l); box-shadow: var(--sombra); }
.cola__item--atencion { border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(105,81,228,.15); }
.cola__item--llamado { border-left: 4px solid var(--amarillo); }
.cola__item--listo { opacity: .7; box-shadow: none; }
.cola__txt { display: grid; gap: 3px; min-width: 0; }
.cola__txt strong { font-size: 1rem; }
.cola__txt > span { font-size: .84rem; color: var(--tinta-2); display: flex; gap: 6px; flex-wrap: wrap; }

/* agenda */
.agenda { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 10px; align-items: start; }
.agenda__col { background: #e9e9f1; border-radius: var(--r-l); padding: 10px; }
.agenda__col header { padding: 4px 6px 10px; display: grid; }
.agenda__col header span { font-size: .78rem; color: var(--tinta-3); }
.agenda__huecos { display: grid; gap: 6px; }
.hueco { display: grid; grid-template-columns: 50px 1fr auto; gap: 8px; align-items: center; text-align: left; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--linea); background: #fff; cursor: pointer; font-size: .86rem; }
.hueco b { font-variant-numeric: tabular-nums; }
.hueco span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hueco i .ico { width: 16px; height: 16px; color: var(--naranja); }
.hueco--libre { background: transparent; border-style: dashed; color: var(--tinta-3); }
.hueco--libre:hover:not([disabled]) { border-color: var(--violeta); background: #fff; color: var(--violeta-hondo); }
.hueco--libre[disabled] { cursor: default; }
.hueco--pendiente { border-left: 4px solid var(--aviso); }
.hueco--confirmada { border-left: 4px solid var(--violeta); }
.hueco--llego, .hueco--atendida { border-left: 4px solid var(--ok); }
.hueco--no_asistio { border-left: 4px solid var(--error); opacity: .75; }

/* disponibilidad */
.bloque { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr auto; gap: 8px; align-items: end; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.semana__dia { background: #fff; border: 1px solid var(--linea); border-radius: var(--r); padding: 12px; display: grid; gap: 6px; align-content: start; min-height: 110px; }
.semana__dia span { font-size: .88rem; font-weight: 600; display: grid; }
.semana__dia small { font-weight: 400; color: var(--tinta-3); font-size: .76rem; }
.semana__dia--libre { background: transparent; border-style: dashed; }

/* caja */
.caja-cerrada { display: grid; justify-items: center; gap: 10px; text-align: center; padding: 40px 20px; }
.caja-cerrada > .ico { width: 44px; height: 44px; color: var(--violeta); }
.caja-cerrada h2 { font-size: 1.3rem; }
.denominaciones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.denominaciones label { display: grid; grid-template-columns: 58px 1fr; align-items: center; gap: 6px; font-weight: 600; font-size: .88rem; }
.denominaciones input { height: 38px; border: 1px solid var(--linea-2); border-radius: 8px; padding: 0 10px; width: 100%; font-variant-numeric: tabular-nums; }
.total-contado { font-size: 1.05rem; }
.total-contado strong { font-size: 1.3rem; font-variant-numeric: tabular-nums; }

/* consulta */
.consulta-cab { display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 16px; }
.consulta-cab h1 { font-size: 1.45rem; font-weight: 700; letter-spacing: -.02em; }
.consulta-signos { margin-left: auto; background: #fff; border: 1px solid var(--linea); border-radius: var(--r); padding: 10px 14px; display: grid; gap: 4px; max-width: 460px; font-size: .88rem; }
.consulta-tit { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.consulta-tit .subtitulo { margin: 0; }
.consulta-tit .campo { width: 150px; }
.dx { display: grid; gap: 6px; margin-bottom: 8px; }
.dx li { display: grid; grid-template-columns: 58px 1fr auto auto; gap: 8px; align-items: center; padding: 6px 10px; border: 1px solid var(--linea); border-radius: 10px; font-size: .88rem; }
.dx li b { color: var(--violeta-hondo); }
.dx .chip { border: 0; cursor: pointer; }
.receta-item { border: 1px solid var(--linea); border-radius: var(--r); padding: 10px 12px; margin-bottom: 10px; display: grid; gap: 8px; }
.receta-item__cab { display: flex; align-items: center; gap: 8px; }
.receta-item__cab .btn { margin-left: auto; }

/* imagen */
.mod { display: inline-grid; place-items: center; min-width: 42px; height: 26px; padding: 0 8px; border-radius: 7px; background: var(--violeta-suave); color: var(--violeta-hondo); font-weight: 700; font-size: .78rem; letter-spacing: .03em; }
.estudios-grid { display: grid; gap: 10px; }
.estudio-tarjeta { display: grid; grid-template-columns: 60px 1fr auto; gap: 14px; align-items: center; padding: 12px 14px; border: 1px solid var(--linea); border-radius: var(--r-l); background: #fff; }
.estudio-tarjeta__mod { width: 60px; height: 60px; border-radius: 12px; background: #0c0b26; color: var(--amarillo); display: grid; place-items: center; font-weight: 800; }
.estudio-tarjeta > div:nth-child(2) { display: grid; gap: 3px; justify-items: start; }
.estudio-tarjeta__concl { font-size: .86rem; color: var(--tinta-2); }
.visor-cab { display: flex; gap: 14px; align-items: flex-start; flex-wrap: wrap; margin-bottom: 6px; }
.visor-cab h1 { font-size: 1.35rem; font-weight: 700; }
.visor-cab .acciones { margin-left: auto; }
.uso-previsto { display: flex; gap: 6px; align-items: center; font-size: .78rem; color: var(--tinta-3); margin-bottom: 10px; }
.uso-previsto .ico { width: 14px; height: 14px; }
.visor-rejilla { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 14px; align-items: start; }
.visor { background: #000; border-radius: var(--r-l); overflow: hidden; height: calc(100dvh - 190px); min-height: 480px; }
.visor iframe { width: 100%; height: 100%; border: 0; display: block; }
/* Comparar estudios del mismo paciente (21/10/2026): pestaña Imágenes de la ficha, recuadro de la pantalla del estudio y pantalla Comparar */
.comparar-ayuda { display: flex; gap: 8px; align-items: center; font-size: .86rem; color: var(--tinta-2); margin: 0 0 10px; }
.comparar-ayuda .ico { flex: none; width: 18px; height: 18px; color: var(--violeta); }
.estudio-tarjeta.estudio-tarjeta--elige { grid-template-columns: auto 60px 1fr auto; }
.estudio-tarjeta--elige > div:nth-child(2) { display: grid; place-items: center; gap: 0; }
.estudio-tarjeta--elige > div:nth-child(3) { display: grid; gap: 3px; justify-items: start; }
.estudio-tarjeta__elegir { display: grid; place-items: center; width: 44px; height: 44px; margin: -8px -6px -8px -8px; border-radius: 10px; cursor: pointer; }
.estudio-tarjeta__elegir:hover { background: var(--panel-2); }
.estudio-tarjeta__elegir input { width: 20px; height: 20px; accent-color: var(--violeta); cursor: pointer; }
.estudio-tarjeta__elegir input:disabled { cursor: not-allowed; }
.estudio-tarjeta:has(input[data-comparar]:checked) { border-color: var(--violeta); box-shadow: inset 0 0 0 1px var(--violeta); }
.comparar-barra { position: sticky; bottom: 12px; z-index: 5; display: flex; gap: 10px 12px; align-items: center; justify-content: flex-end; flex-wrap: wrap; margin-top: 12px; padding: 10px 12px; border: 1px solid var(--linea); border-radius: var(--r-l); background: var(--panel); box-shadow: var(--sombra-alta); }
.comparar-barra .tenue { font-size: .84rem; margin-right: auto; }
.comparar-barra[hidden] { display: none; }
.comparar-barra--plana { position: static; z-index: auto; margin: 0; padding: 10px 0 0; border: 0; border-radius: 0; box-shadow: none; background: none; }
.otros-estudios { margin-bottom: 12px; border: 1px solid var(--linea); border-radius: var(--r-l); background: var(--panel); }
.otros-estudios > summary { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border-radius: var(--r-l); cursor: pointer; list-style: none; -webkit-tap-highlight-color: transparent; }
.otros-estudios > summary::-webkit-details-marker { display: none; }
.otros-estudios > summary > .ico:first-child { flex: none; width: 20px; height: 20px; color: var(--violeta); }
.otros-estudios__tit { display: grid; gap: 1px; }
.otros-estudios__tit .tenue { font-size: .8rem; }
.otros-estudios__flecha { flex: none; margin-left: auto; transition: transform var(--t); }
.otros-estudios[open] .otros-estudios__flecha { transform: rotate(180deg); }
.otros-estudios__cuerpo { padding: 0 14px 12px; border-top: 1px solid var(--linea); }
.otros-estudios__lista { list-style: none; margin: 0; padding: 4px 0 0; display: grid; }
.otros-estudios__lista li { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 6px 0; border-bottom: 1px dashed var(--linea); }
.otros-estudios__lista .marca { min-height: 44px; }
.otros-estudios__lista .marca input { flex: none; width: 20px; height: 20px; }
.otros-estudios__ver { font-size: .82rem; white-space: nowrap; }
.comparar-lista { list-style: none; margin: 4px 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
/* rótulos de la pantalla Comparar (revisión en contra del 21/10/2026): la fecha nunca se corta (el rótulo no se achica por debajo de ella;
 * si no entran, pasan a otra fila) y debajo, el lugar y la descripción, que sí se corta (width 0: no ensancha el rótulo); en el teléfono,
 * una línea por estudio, sin la descripción */
.comparar-lista li { flex: 1 1 0; min-width: auto; }
.comparar-lista a { display: flex; gap: 10px; align-items: center; height: 100%; padding: 8px 12px; border: 1px solid var(--linea); border-radius: var(--r-l); background: var(--panel); color: var(--tinta); text-decoration: none; font-size: .86rem; }
.comparar-lista a:hover { border-color: var(--violeta); }
.comparar-lista__num { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #0c0b26; color: var(--amarillo); font-weight: 800; font-size: .8rem; }
.comparar-lista__txt { display: grid; gap: 3px; flex: 1 1 auto; min-width: 0; }
.comparar-lista__cuando { white-space: nowrap; }
.comparar-lista__linea { display: flex; gap: 8px; align-items: center; min-width: 0; }
.comparar-lista__desc { flex: 1 1 0; width: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tinta-2); font-size: .8rem; }
.comparar-lista__lugar { flex: none; }
.comparar-ayuda--visor { margin: 0 0 8px; font-size: .82rem; }
.comparar-lista__lugar:empty { display: none; }
.visor--comparar { height: calc(100dvh - 250px); min-height: 460px; }
.informe { position: sticky; top: calc(var(--cab) + 12px); max-height: calc(100dvh - 190px); overflow-y: auto; }
@media (max-width: 1100px) { .visor-rejilla { grid-template-columns: 1fr; } .informe { position: static; max-height: none; } .semana { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .comparar-lista { gap: 6px; } .comparar-lista a { padding: 6px 10px; } .comparar-lista__txt { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .comparar-lista__desc { display: none; } }
@media (max-width: 900px) { .visor { height: 70dvh; min-height: 360px; } .visor--comparar { height: 78dvh; min-height: 420px; } .comparar-lista { flex-direction: column; } .estudio-tarjeta.estudio-tarjeta--elige { grid-template-columns: auto 48px 1fr; } .cola__item { grid-template-columns: auto 1fr; } .cola__item .fila-acc { grid-column: 1 / -1; justify-content: flex-start; }
  .consulta-signos { margin-left: 0; } .bloque { grid-template-columns: 1fr 1fr; } .denominaciones { grid-template-columns: repeat(2, minmax(0, 1fr)); } .estudio-tarjeta { grid-template-columns: 48px 1fr; } .estudio-tarjeta .btn { grid-column: 1 / -1; } }

/* resultados del paciente */
.res-estudio { display: grid; gap: 3px; padding: 14px; border-radius: var(--r); background: var(--noche); color: #fff; }
.res-estudio span { color: #bdb4f2; font-size: .86rem; }
a.archivo { text-decoration: none; color: inherit; }
a.archivo .archivo__ico { font-size: .7rem; font-weight: 700; }

/* pantalla de la sala de espera */
body.pantalla { background: var(--noche-hondo); color: #fff; overflow: hidden; }
.pant { height: 100dvh; display: grid; grid-template-columns: 1.6fr 1fr; grid-template-rows: auto 1fr auto; gap: 2vh 3vw; padding: 3vh 3vw; }
.pant__cab { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; font-size: 2.2vw; }
.pant__cab span { font-variant-numeric: tabular-nums; color: #bdb4f2; }
.pant__actual { background: var(--noche); border-radius: 3vw; display: grid; place-content: center; text-align: center; gap: 1vh; }
.pant__etq { font-size: 2.4vw; text-transform: uppercase; letter-spacing: .2em; color: #bdb4f2; }
.pant__actual strong { font-size: 17vw; line-height: .95; font-weight: 800; color: var(--amarillo); font-variant-numeric: tabular-nums; }
.pant__actual > span:last-child { font-size: 3vw; font-weight: 600; }
.pant--nuevo .pant__actual { animation: latido 1.2s ease-out 2; }
@keyframes latido { 30% { box-shadow: 0 0 0 1.2vw rgba(253,223,1,.55); } 100% { box-shadow: 0 0 0 0 rgba(253,223,1,0); } }
@media (prefers-reduced-motion: reduce) { .pant--nuevo .pant__actual { animation: none; } }
.pant__lista h2 { font-size: 1.6vw; color: #bdb4f2; font-weight: 600; margin-bottom: 1.4vh; text-transform: uppercase; letter-spacing: .12em; }
.pant__lista ol { list-style: none; padding: 0; display: grid; gap: 1.4vh; }
.pant__lista li { display: flex; align-items: center; gap: 1.5vw; background: var(--noche); border-radius: 1.2vw; padding: 1.6vh 1.6vw; }
.pant__lista b { font-size: 4vw; font-weight: 800; min-width: 9vw; font-variant-numeric: tabular-nums; }
.pant__lista span { font-size: 1.8vw; color: #d8d6f3; }
.pant__espera { margin-top: 2vh; font-size: 1.6vw; color: #bdb4f2; }
.pant__pie { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; color: #bdb4f2; font-size: 1.4vw; }
.pant__activar { position: fixed; inset: 0; background: rgba(12,11,38,.8); color: #fff; border: 0; font: inherit; font-size: 2.4vw; cursor: pointer; }
a.celda-nombre { text-decoration: none; color: inherit; }
a.celda-nombre:hover strong { color: var(--violeta-hondo); }
.barras--dinero .barra { grid-template-columns: minmax(0, 110px) 1fr auto; }
.barras--dinero .barra__n { min-width: 74px; }
/* página de resultados en el celular: la tarjeta del PDF no debe empujar el ancho */
a.archivo { grid-template-columns: auto minmax(0, 1fr); }
a.archivo > span:last-child { display: grid; min-width: 0; }
.solo > div:not(.solo__caja) { min-width: 0; width: 100%; display: grid; justify-items: center; }
.solo__caja { min-width: 0; }

/* Historia del sistema anterior (pestaña de la ficha): cada atención desplegable */
.hist { background: var(--panel); border: 1px solid var(--linea); border-radius: var(--r); margin-bottom: 8px; }
.hist summary { display: flex; gap: 14px; align-items: baseline; padding: 12px 16px; cursor: pointer; list-style: none; }
.hist summary::-webkit-details-marker { display: none; }
.hist summary::before { content: "›"; color: var(--tinta-3); transition: transform var(--t); }
.hist[open] summary::before { transform: rotate(90deg); }
.hist-fecha { flex: none; width: 92px; font-size: .84rem; color: var(--tinta-3); font-variant-numeric: tabular-nums; }
.hist-tit { display: flex; flex-direction: column; min-width: 0; }
.hist-tit .tenue { font-size: .82rem; overflow-wrap: anywhere; }
.hist-cuerpo { padding: 0 16px 14px 52px; border-top: 1px solid var(--linea); }
.hist-sub { font-size: .8rem; font-weight: 600; color: var(--tinta-3); margin: 14px 0 6px; text-transform: uppercase; letter-spacing: .03em; }
.hist-lista { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: .9rem; }
.hist-cuerpo .datos { grid-template-columns: 1fr; }
@media (max-width: 600px) { .hist summary { flex-direction: column; gap: 2px; } .hist-cuerpo { padding-left: 16px; } }

/* Liquidación */
.liq td { vertical-align: middle; }
.liq input.liq-n { width: 64px; text-align: right; }
.liq input.liq-p { width: 96px; text-align: right; }
.liq input { height: 34px; padding: 0 8px; border: 1px solid var(--linea-2); border-radius: 8px; font: inherit; }
.liq-tot { text-align: right; font-size: 1.05rem; }
.liq-tot strong { font-size: 1.3rem; margin-left: 8px; }

/* contabilidad: asientos del libro diario */
.asiento { padding: 12px 14px; margin-bottom: 12px; display: grid; gap: 8px; }
.asiento--anulado { opacity: .55; }
.asiento__cab { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.asiento__concepto { flex: 1 1 260px; min-width: 0; }
.asiento .tabla-env { box-shadow: none; }
.asiento__haber { padding-left: 36px !important; }
.asiento__monto { width: 120px; }
.form__fila.asiento-linea { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); }
@media (max-width: 640px) { .asiento__monto { width: auto; } .asiento__haber { padding-left: 20px !important; } .form__fila.asiento-linea { grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--linea); padding-bottom: 10px; } }
@media print { .lateral, .cabecera, .titulo-pag .acciones, .pestanas, [data-filtro], .demo-aviso { display: none !important; } .principal, .contenido { margin: 0 !important; padding: 0 !important; } }
/* clínico: mapa de camas y colores de triaje */
.camas { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin-bottom: 18px; }
.cama { text-align: left; border: 1px solid var(--linea); border-left: 6px solid var(--linea); border-radius: var(--r-l); background: var(--panel); padding: 10px 12px; display: grid; gap: 2px; cursor: pointer; font: inherit; color: inherit; min-height: 84px; }
.cama:hover { border-color: var(--violeta); }
.cama__n { font-weight: 700; font-size: 1.05rem; }
.cama__e { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--tenue, #6b6b80); }
.cama__p { font-weight: 600; font-size: .9rem; }
.cama__d { font-size: .8rem; color: var(--tenue, #6b6b80); }
.cama--libre { border-left-color: #2e9e5b; }
.cama--ocupada { border-left-color: #3d5afe; }
.cama--limpieza { border-left-color: #e0a800; }
.cama--bloqueada { border-left-color: #9a9aa6; opacity: .75; }
.triaje { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: .8rem; font-weight: 700; color: #fff; white-space: nowrap; }
.triaje, .lista .triaje { color: #fff !important; }
.triaje--rojo { background: #d32f2f; } .triaje--naranja { background: #ef6c00; } .triaje--amarillo { background: #f9c80e; color: #3a2e00 !important; }
.triaje--verde { background: #2e7d32; } .triaje--azul { background: #1565c0; } .triaje--sin { background: #e4e4ec; color: #3a3a4a !important; }
.triaje-elegir { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; margin-bottom: 12px; }
.triaje-elegir .triaje { padding: 10px 12px; border-radius: 10px; cursor: pointer; font-size: .9rem; }

/* laboratorio: campos dentro de la tabla de resultados y filas de plantilla */
.tabla input { width: 100%; min-width: 80px; padding: 7px 9px; border: 1px solid var(--linea); border-radius: 8px; font: inherit; background: #fff; }
.tabla input:focus { outline: 2px solid var(--violeta); outline-offset: 0; }
.form__fila.plantilla-fila { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 640px) { .form__fila.plantilla-fila { grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--linea); padding-bottom: 10px; } .form__fila.plantilla-fila > :first-child { grid-column: 1 / -1; } }

/* Campanita de avisos (17/10/2026): informes firmados por enviar al paciente (nucleo.js campana) */
.campana { position: relative; }
.campana__boton { position: relative; }
.campana__n { position: absolute; top: 2px; right: 0; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #e5484d; color: #fff; font-size: .7rem; font-weight: 700; line-height: 18px; text-align: center; }
.campana__panel { position: absolute; right: 0; top: calc(100% + 8px); width: min(420px, calc(100vw - 24px)); max-height: 70vh; overflow: auto; background: #fff; border: 1px solid var(--linea); border-radius: 14px; box-shadow: 0 14px 40px rgba(20, 18, 52, .18); z-index: 40; }
.campana__cab { padding: 12px 16px; font-weight: 600; border-bottom: 1px solid var(--linea); }
.campana__lista { list-style: none; margin: 0; padding: 0; }
.campana__lista li { display: flex; gap: 10px; align-items: center; justify-content: space-between; padding: 10px 16px; border-bottom: 1px solid var(--linea); }
.campana__lista li > div:first-child { min-width: 0; display: flex; flex-direction: column; }
.campana__lista span { font-size: .78rem; color: var(--tinta-3); }
.campana__acc { display: flex; gap: 6px; flex: none; }
.campana__vacio { margin: 0; padding: 16px; color: var(--tinta-3); }
.campana__todos { display: block; padding: 10px 16px; font-weight: 600; }
@media (max-width: 760px) { .campana__lista li { flex-direction: column; align-items: stretch; } .campana__acc { justify-content: flex-end; } }
@media (max-width: 520px) { .campana { margin-left: auto; } }

/* Informe firmado: el PDF dentro del panel del estudio (17/10/2026) */
.informe-pdf { height: min(78vh, 900px); min-height: 420px; border: 1px solid var(--linea); border-radius: 10px; overflow: hidden; background: #f4f4f7; }
.informe-pdf iframe { width: 100%; height: 100%; border: 0; display: block; }

/* Historial de versiones del informe (Reversar, 17/10/2026) */
.versiones summary { display: flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 600; list-style: none; }
.versiones summary::-webkit-details-marker { display: none; }
.versiones .lista__txt strong, .versiones .lista__txt span { white-space: normal; overflow: visible; text-overflow: clip; }

/* Informe subido en PDF (18/10/2026): el chip con el médico que informó baja de línea si el nombre es largo (360 px) y el texto del
   borrador que reemplazó queda en Versiones anteriores */
.chip--envuelve { white-space: normal; height: auto; min-height: 22px; padding: 3px 9px; line-height: 1.3; }
.versiones .borrador-texto { margin-top: 4px; font-size: .8rem; color: var(--tinta-2); }
.versiones .borrador-texto summary { cursor: pointer; color: var(--violeta-hondo); font-weight: 600; }
.versiones .borrador-texto p { margin: 4px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }

/* Estudio que llegó dos veces al PACS (19/10/2026, public/js/imagen.js): el visor no lo abre; el recuadro explica y deja elegir la copia */
.visor--aviso { display: flex; align-items: center; justify-content: center; background: var(--panel-2); border: 1px dashed var(--linea-2); height: auto; min-height: 260px; }
.visor__aviso { max-width: 460px; padding: 24px; text-align: center; color: var(--tinta-2); }
.visor__aviso .ico { width: 30px; height: 30px; color: var(--aviso); display: block; margin: 0 auto 10px; }
.visor__aviso strong { display: block; font-size: 1.02rem; color: var(--tinta); }
.visor__aviso p { margin: 8px 0 0; font-size: .9rem; }
.duplicado p { margin: 6px 0; font-weight: 400; }
.duplicado__tit { display: flex; gap: 6px; align-items: center; }
/* el panel del informe mide 380 px: cada copia en columna (datos y debajo el botón), sin desbordar */
.duplicado__copias { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.duplicado__copias li { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; padding: 8px 10px; border-radius: var(--r-s); background: rgba(255,255,255,.7); color: var(--tinta); }
.duplicado__copias .lista__txt { min-width: 0; max-width: 100%; display: flex; flex-direction: column; overflow-wrap: anywhere; }
.duplicado__copias .lista__txt strong { white-space: normal; overflow: visible; text-overflow: clip; }
.duplicado__copias .lista__txt span { font-size: .8rem; color: var(--tinta-3); font-weight: 400; }
/* Unir las dos partes (21/10/2026, public/js/imagen.js): los botones debajo de las copias (el texto largo se parte, sin desbordar el panel
 * de 380 px ni el teléfono) y el avance del trabajo */
.duplicado__unir { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.duplicado__unir .btn { white-space: normal; text-align: left; height: auto; min-height: 40px; line-height: 1.25; padding-top: 8px; padding-bottom: 8px; }
.union-avance p { margin: 6px 0; }
.union-avance__barra { height: 10px; border-radius: 5px; background: rgba(255,255,255,.85); box-shadow: inset 0 0 0 1px var(--linea-2); overflow: hidden; margin: 8px 0 4px; }
.union-avance__barra span { display: block; height: 100%; min-width: 4px; background: var(--violeta); transition: width .5s ease; }
.union-avance__txt { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--tinta); }
@media (prefers-reduced-motion: reduce) { .union-avance__barra span { transition: none; } }
.campana__cab--aviso { display: flex; gap: 6px; align-items: center; color: var(--aviso); background: var(--aviso-f); }
/* (19/10/2026) nota de un informe por enviar: llegó dos veces, ficha sin fecha o fecha distinta; el ícono al lado del texto */
.campana__lista .campana__nota { display: flex; gap: 4px; align-items: flex-start; color: var(--aviso); }
.campana__nota .ico { flex: none; width: 14px; height: 14px; margin-top: 1px; }
.campana__lista .campana__nota span { color: inherit; }
.campana__soporte { display: flex; gap: 6px; align-items: flex-start; margin: 0; padding: 10px 16px; font-size: .8rem; color: var(--tinta-3); border-bottom: 1px solid var(--linea); }
.campana__soporte .ico { width: 15px; height: 15px; margin-top: 1px; }

/* Motivo del estudio (19/10/2026, public/js/imagen.js): arriba del estudio, para que la doctora lo lea antes de informar, y un campo por
 * estudio en el panel Asignar (paciente y examen a la vista) */
.motivo-estudio { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: flex-start; margin-bottom: 10px; font-size: .92rem; }
.motivo-estudio > .ico { flex: none; width: 18px; height: 18px; margin-top: 2px; }
.motivo-estudio__txt { flex: 1 1 220px; min-width: 0; margin: 0; white-space: pre-line; overflow-wrap: anywhere; color: var(--tinta); font-weight: 400; }
.motivo-estudio__txt strong { color: var(--info); font-weight: 600; }
.motivo-estudio__quien { display: block; margin-top: 2px; font-size: .78rem; color: var(--tinta-3); white-space: normal; }
.motivo-estudio .btn { flex: none; }
.motivo-asig__intro { margin-top: 4px; }
/* Asignar: puede informar o solo revisar (22/10/2026). Con una cuenta de Médico los dos quedan apagados (su rol solo deja revisar).
   Revisión de cierre del 22/10/2026: es un fieldset y app.css no tenía regla para fieldset; sin el borde, el relleno ni el margen del
   navegador queda como los demás .campo (el legend ya lleva el estilo de sus etiquetas) */
.modo-asig { display: grid; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.modo-asig legend { padding: 0; margin-bottom: 5px; }
.modo-asig .marca { min-height: 40px; align-items: flex-start; }
.modo-asig .marca input { flex: none; margin-top: 2px; }
.modo-asig .marca input:disabled:not(:checked) + span { opacity: .55; }   /* el marcado (Solo revisar) se lee entero */
.modo-asig .marca:has(input:disabled) { cursor: default; }
.motivo-asig { display: grid; gap: 8px; padding: 10px 12px; border: 1px solid var(--linea); border-radius: 10px; background: var(--panel-2); }
.motivo-asig__cab { display: flex; gap: 8px; align-items: flex-start; margin: 0; font-size: .86rem; }
.motivo-asig__cab .mod { flex: none; }
.motivo-asig__est { display: flex; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.motivo-asig__est .tenue { font-size: .8rem; }
.motivo-asig .campo textarea { min-height: 64px; background: var(--panel); }
/* revisión 19/10/2026: estudio sin motivo (radiología lo agrega desde ahí), qué falta en cada campo del panel Asignar, el texto de otra
 * persona tras un 409 (lo escrito no se pierde) y los avisos bajo el Motivo de la solicitud del informe */
.motivo-estudio--vacio { padding: 8px 12px; border: 1px dashed var(--linea-2); border-radius: 10px; background: var(--panel-2); color: var(--tinta-2); }
.motivo-estudio--vacio .motivo-estudio__txt { color: var(--tinta-2); }
.motivo-estudio--vacio .motivo-estudio__txt strong { color: var(--tinta); }
.campo small.motivo-falta { color: var(--error); font-weight: 600; }
.motivo-otro { display: grid; gap: 6px; justify-items: start; padding: 8px 10px; border-radius: 8px; background: var(--aviso-f); color: var(--aviso); font-size: .84rem; overflow-wrap: anywhere; }
.motivo-otro p { margin: 0; white-space: pre-line; }
.motivo-cambio { margin: -4px 0 0; padding: 6px 10px; border-radius: 8px; background: var(--info-f); color: var(--info); font-size: .8rem; }
.motivo-difiere { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin-top: -4px; font-size: .8rem; color: var(--aviso); }
/* Enviar las imágenes sin informe (19/10/2026, PEDIDOS-IMAGEN-2026-10-19.md §2): el recuadro del estudio, el aviso del diálogo y la página
 * del paciente con el informe "se está procesando" */
.envio-imagenes { display: grid; gap: 8px; justify-items: start; margin-bottom: 14px; padding: 10px 12px; border: 1px solid var(--linea); border-radius: 10px; background: var(--panel-2); }
.envio-imagenes .btn { white-space: normal; height: auto; min-height: 38px; text-align: left; }
.envio-imagenes__hecho { display: flex; gap: 8px; align-items: flex-start; margin: 0; font-size: .86rem; color: var(--tinta-2); overflow-wrap: anywhere; }
.envio-imagenes__hecho > .ico { flex: none; width: 17px; height: 17px; margin-top: 2px; color: var(--info); }
.envio-imagenes__hecho strong { color: var(--tinta); font-weight: 600; }
/* el ícono al lado del texto, no solo en su renglón (svg es display:block en todo app.css): el recuadro Solo para revisar, "Asignado a"
   en el estudio y en la lista, y la nota de la cuenta de Médico (revisión visual del 22/10/2026). El texto va en un <span> */
.linea-ico { display: flex; gap: 6px; align-items: flex-start; }
.linea-ico > .ico { flex: none; width: 1.15em; height: 1.15em; margin-top: .15em; }
.envio-sin-informe { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.envio-sin-informe > .ico { flex: none; margin-top: 2px; }
.envio-linea { display: flex; gap: 6px; align-items: flex-start; margin: 0; font-size: .84rem; }
.envio-linea > .ico { flex: none; width: 15px; height: 15px; margin-top: 2px; }
.envio-sin-informe strong { font-weight: 600; }
.res-pendiente { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: var(--info-f); color: var(--info); font-size: .92rem; text-align: left; }
.res-pendiente > svg { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.res-pendiente strong { display: block; font-weight: 600; }
.res-pendiente span { display: block; margin-top: 2px; font-size: .84rem; color: var(--tinta-2); }
/* Admisión de imagen (22/10/2026, public/js/lab.js T.admisionImagen): la barra de la cédula arriba y la persona elegida con su nombre y su
   edad en grande, para confirmar que es ella antes de admitirla (una cédula mal escrita no trae a otro sin que se note) */
.admision__bus { display: grid; gap: 5px; }
.admision__etq { font-size: .82rem; font-weight: 600; color: var(--tinta-2); }
.admision__bus small { font-size: .78rem; }
.admision__pac { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--linea-2); border-radius: var(--r); background: var(--panel-2); }
.admision__quien { display: flex; gap: 12px; align-items: flex-start; }
.admision__quien > .avatar { width: 48px; height: 48px; font-size: 1rem; background: var(--noche); color: var(--amarillo); }
.admision__quien > .avatar .ico { width: 22px; height: 22px; }
.admision__quien-txt { display: grid; gap: 2px; min-width: 0; flex: 1; }
.admision__nombre { font-size: 1.2rem; font-weight: 700; line-height: 1.25; letter-spacing: -.01em; overflow-wrap: anywhere; }
.admision__edad { font-size: 1.05rem; font-weight: 600; color: var(--violeta-hondo); }
.admision__edad--falta { font-size: .9rem; color: var(--aviso); }
.admision__meta { font-size: .86rem; color: var(--tinta-2); overflow-wrap: anywhere; }
.admision__quien > .btn { flex: none; }
.admision__confirma { display: flex; gap: 8px; align-items: flex-start; margin: 0; }
.admision__confirma > .ico { flex: none; width: 17px; height: 17px; margin-top: 1px; }
.admision__datos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admision__editar { padding-top: 12px; border-top: 1px solid var(--linea); }
/* en el teléfono el botón baja debajo del nombre (si no, el nombre queda en una columna de pocas letras) */
@media (max-width: 640px) {
  .admision__quien { flex-wrap: wrap; }
  .admision__quien-txt { flex-basis: calc(100% - 60px); }
  .admision__quien > .btn { margin-left: 60px; }
}
/* revisión visual del 23/10/2026 (360 px): en la barra de la cédula el nombre se ve ENTERO (cortado con "...", dos pacientes con los mismos
   apellidos se veían iguales y "Paciente nuevo con cédula" perdía los últimos dígitos), y el estudio elegido queda en un renglón con su
   X de quitar (con el chip de la modalidad la X bajaba sola a otro renglón) */
.admision__bus .buscar__res .lista__txt strong { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.admision [data-ex] .lista > li { flex-wrap: nowrap; }
.admision [data-ex] .lista__txt { flex-basis: auto; }
.admision [data-ex] .lista__txt strong { white-space: normal; overflow-wrap: anywhere; }
.admision [data-ex] .lista > li > .mod, .admision [data-ex] .lista > li > .btn { flex: none; }
/* el campo de al lado de la fecha de nacimiento (Sexo) no baja cuando la fecha lleva su ayuda debajo (1366 px) */
.admision .form__fila > .campo { align-content: start; }
.espera-pac { text-decoration: none; }
/* Lista de trabajo del equipo en Ajustes (22/10/2026, public/js/admin.js): un bloque por equipo, separado por una línea */
.wl-equipo { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--linea); }
.wl-equipo .marca { align-items: flex-start; }
.wl-equipo .marca input { flex: none; margin-top: 2px; }   /* que la casilla no se achique cuando el texto ocupa dos renglones (360 px) */
/* Separar estudio (29/10/2026): el ofrecimiento al pie del panel y la lista de series del panel lateral */
.separar-oferta { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--linea); }
.separar-grupos { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: .82rem; }
.separar-series { list-style: none; margin: 0; padding: 0; border: 1px solid var(--linea); border-radius: 10px; }
.separar-series li + li { border-top: 1px solid var(--linea); }
.separar-series .marca { min-height: 44px; padding: 6px 10px; align-items: flex-start; }
.separar-series .marca input { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.separar-resumen { margin: 0; font-size: .86rem; font-weight: 600; font-variant-numeric: tabular-nums; }