/* Paleta médica D016 — blanco y azul (ecosistema UROLOGICA).
   Base del panel «Confirmación de citas» + piezas propias del CRM
   (pestañas, métricas, ficha modal, línea de tiempo). */
:root {
  --azul-900: #0d2b4e;
  --azul-700: #14548c;
  --azul-600: #1a6fb5;
  --azul-100: #e3eef9;
  --azul-050: #f2f7fc;
  --tinta: #12303f;
  --gris: #5b7285;
  --linea: #d8e2ec;
  --error: #b3261e;
  --ok: #14639e;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: var(--azul-050);
  color: var(--tinta);
}
.oculto { display: none !important; }
.mt8 { margin-top: 8px; }

/* ---------- login ---------- */
.login-centro { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.tarjeta { background: #fff; border: 1px solid var(--linea); border-radius: 14px; padding: 22px; }
.login { width: min(380px, 100%); box-shadow: 0 12px 40px rgba(13, 43, 78, .12); }
.login label { display: block; margin: 14px 0 4px; font-weight: 600; color: var(--azul-900); }
.login input {
  width: 100%; padding: 10px 12px; border: 1px solid var(--linea); border-radius: 9px;
  font-size: 16px; margin-top: 4px;
}
.login .btn { width: 100%; }
.login input:focus { outline: 2px solid var(--azul-600); border-color: var(--azul-600); }
.error { color: var(--error); font-size: 14px; }

/* ---------- marca ---------- */
.marca { display: flex; gap: 12px; align-items: center; }
.logo {
  width: 44px; height: 44px; border-radius: 12px; background: var(--azul-700); color: #fff;
  display: grid; place-items: center; font-size: 22px; font-weight: 800; flex: none;
}
.marca h1 { margin: 0; font-size: 19px; color: var(--azul-900); letter-spacing: .2px; }
.marca p { margin: 0; color: var(--gris); font-size: 13px; }

/* ---------- cabecera ---------- */
.cabecera {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
  background: #fff; border-bottom: 1px solid var(--linea); padding: 14px 20px;
  position: sticky; top: 0; z-index: 5;
}
.cabecera-usuario { display: flex; gap: 10px; align-items: center; color: var(--gris); font-size: 14px; }
.estado-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600; background: var(--azul-100); color: var(--azul-900);
  border: 1px solid var(--linea);
}
.chip .punto { width: 8px; height: 8px; border-radius: 50%; background: var(--gris); }
.chip.ok .punto { background: var(--ok); }
.chip.alerta .punto { background: #c2860b; }
.chip.falla .punto { background: var(--error); }

/* ---------- botones ---------- */
.btn {
  border: 1px solid transparent; border-radius: 10px; padding: 9px 16px; font-size: 14.5px;
  font-weight: 600; cursor: pointer; background: var(--azul-100); color: var(--azul-900);
}
.btn:disabled { opacity: .5; cursor: wait; }
.btn.primario { background: var(--azul-600); color: #fff; }
.btn.primario:hover:not(:disabled) { background: var(--azul-700); }
.btn.exito { background: var(--ok); color: #fff; }
.btn.fantasma { background: #fff; border-color: var(--linea); color: var(--azul-900); }
.btn.chico { padding: 5px 10px; font-size: 13px; }
.btn.peligro { background: #fff; border-color: var(--error); color: var(--error); }

/* ---------- métricas ---------- */
.metricas {
  max-width: 1100px; margin: 16px auto 0; padding: 0 20px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px;
}
.metrica {
  background: #fff; border: 1px solid var(--linea); border-radius: 12px; padding: 12px 14px;
}
.metrica .n { font-size: 26px; font-weight: 800; color: var(--azul-900); line-height: 1.1; }
.metrica .t { color: var(--gris); font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; }
.metrica.destacada { background: var(--azul-100); border-color: var(--azul-600); }

/* ---------- pestañas ---------- */
.pestanas {
  max-width: 1100px; margin: 16px auto 0; padding: 0 20px;
  display: flex; gap: 8px; flex-wrap: wrap;
}
.pestana {
  border: 1px solid var(--linea); background: #fff; color: var(--azul-900);
  border-radius: 999px; padding: 8px 16px; font-size: 14px; font-weight: 600; cursor: pointer;
}
.pestana.activa { background: var(--azul-700); border-color: var(--azul-700); color: #fff; }

/* ---------- acciones / filtros ---------- */
.acciones {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  max-width: 1100px; margin: 14px auto 10px; padding: 0 20px;
}
.chips-filtro { display: flex; gap: 6px; flex-wrap: wrap; }
.chip-filtro {
  border: 1px solid var(--linea); background: #fff; color: var(--gris);
  border-radius: 999px; padding: 5px 12px; font-size: 13px; font-weight: 600; cursor: pointer;
}
.chip-filtro.activa { background: var(--azul-100); color: var(--azul-900); border-color: var(--azul-600); }
.buscador {
  flex: 1; min-width: 220px; max-width: 420px; padding: 9px 12px; border: 1px solid var(--linea);
  border-radius: 10px; font-size: 15px;
}
.buscador.ancho { max-width: none; }
.ventana { color: var(--azul-900); font-weight: 600; display: flex; gap: 8px; align-items: center; }
.ventana select { padding: 8px 10px; border-radius: 9px; border: 1px solid var(--linea); font-size: 14px; }
.nota { color: var(--gris); font-size: 13px; }
.vacio { text-align: center; color: var(--gris); padding: 26px; }

/* ---------- banner simulado ---------- */
.banner {
  max-width: 1100px; margin: 12px auto 0; padding: 12px 16px; border-radius: 12px;
  background: #fff7e8; border: 1px solid #e5c98a; color: #6d4c07; font-size: 14px;
}
.banner b { color: #4a3403; }

/* ---------- tabla ---------- */
.tabla-caja {
  max-width: 1100px; margin: 10px auto; background: #fff; border: 1px solid var(--linea);
  border-radius: 14px; overflow: hidden;
}
.tabla-toolbar {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--linea); background: var(--azul-050);
}
.tabla-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--linea); vertical-align: middle; }
th {
  font-size: 12.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--gris);
  background: var(--azul-050); white-space: nowrap;
}
tbody tr:hover { background: var(--azul-050); }
tbody tr.fila-click { cursor: pointer; }

.casilla { font-size: 13px; font-weight: 700; white-space: nowrap; }
.casilla.verificado { color: var(--ok); }
.casilla.invalido { color: var(--error); }
.casilla.desconocido { color: var(--gris); font-weight: 500; }

.fecha-celda b { display: block; color: var(--azul-900); font-size: 13.5px; }
.fecha-celda span { color: var(--gris); font-size: 12.5px; }

.pill {
  display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700;
  background: var(--azul-100); color: var(--azul-900); white-space: nowrap;
}
.pill.nuevo { background: #fdf1d7; color: #7a5a07; }
.pill.contactado { background: var(--azul-100); color: var(--azul-900); }
.pill.agendado { background: #dcefe2; color: #1e6b3a; }
.pill.atendido { background: #e7e9f0; color: #444a63; }
.pill.descartado { background: #f7e3e1; color: #8c2f28; }

select.estado-inline {
  padding: 5px 8px; border-radius: 8px; border: 1px solid var(--linea); font-size: 13px;
  width: auto;
}
.motivo-celda { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gris); }
.linktel { color: var(--azul-600); text-decoration: none; font-weight: 600; }
.nota-celu { font-size: 12px; color: var(--gris); }

/* ---------- ajustes / formularios ---------- */
.ajustes { max-width: 1100px; margin: 14px auto; }
.ajustes summary { cursor: pointer; font-weight: 700; color: var(--azul-900); padding: 4px 2px; }
fieldset { border: 1px solid var(--linea); border-radius: 10px; margin: 14px 0; }
legend { font-weight: 700; color: var(--azul-900); padding: 0 6px; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.grid-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; align-items: end; }
label { font-size: 13.5px; font-weight: 600; color: var(--azul-900); }
input, textarea, select {
  display: block; width: 100%; margin-top: 4px; padding: 8px 10px;
  border: 1px solid var(--linea); border-radius: 8px; font: inherit; font-weight: 400;
}
textarea { font-family: ui-monospace, Menlo, monospace; font-size: 13px; }
code { background: var(--azul-100); border-radius: 5px; padding: 1px 5px; font-size: 12.5px; }
.fila-importar { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; margin-top: 12px; }
.fila-importar select { width: auto; }
#archivo-csv { margin: 10px 0; }

.pie { text-align: center; color: var(--gris); font-size: 12.5px; padding: 26px 0 34px; }

/* ---------- recetas ---------- */
.requerido { color: var(--error); }
.campo-libre { display: block; margin: 10px 0; font-size: 13.5px; font-weight: 600; color: var(--azul-900); }
.campo-libre input, .campo-libre textarea { font-weight: 400; }
.receta-previa { max-width: 300px; white-space: pre-wrap; }
.rec-acciones { display: flex; gap: 6px; flex-wrap: wrap; }
.rec-folio b { color: var(--azul-700); white-space: nowrap; }

/* ---------- contador de registros (pacientes) ---------- */
.contador-caja {
  background: #fff; border: 1px solid var(--azul-600); border-radius: 12px;
  padding: 8px 16px; display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap;
}
.contador-num { font-size: 24px; font-weight: 800; color: var(--azul-900); line-height: 1; }
.contador-txt { font-size: 13px; font-weight: 700; color: var(--azul-900); }
.contador-det { font-size: 12px; color: var(--gris); }

/* ---------- recordatorios ---------- */
.pill.prio-alta { background: #f7e3e1; color: #8c2f28; }
.pill.prio-media { background: #fdf1d7; color: #7a5a07; }
.pill.prio-baja { background: var(--azul-100); color: var(--azul-900); }
.pill.tipo-rd { background: #fff7ed; color: #9a3412; border: 1px solid #fed7aa; white-space: nowrap; }
.pill.enviador { background: #e0f2fe; color: #075985; }
tr.rd-vencido td { background: #fdf3f2; }
tr.rd-vencido:hover td { background: #fae5e3; }
.rd-rel { color: #c2410c; font-weight: 700; }

/* filas de grupo (Vencidos / Hoy / Esta semana / Más adelante) */
tr.rd-grupo td {
  background: var(--azul-100) !important; color: var(--azul-900);
  font-weight: 800; font-size: 12.5px; text-transform: uppercase; letter-spacing: .6px;
  padding: 8px 12px; border-top: 2px solid var(--azul-600);
}
tr.rd-grupo.g-vencidos td { background: #fbe4e2 !important; color: #8c2f28; border-top-color: #dc2626; }
tr.rd-grupo.g-hoy td { background: #fef3c7 !important; color: #92400e; border-top-color: #d97706; }
tr.rd-grupo .rd-grupo-n {
  background: rgba(255,255,255,.75); border-radius: 999px; padding: 1px 8px; margin-left: 6px;
}
.rd-acciones { display: flex; gap: 6px; flex-wrap: wrap; }
.datos-grid.tres { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }

/* ---------- editor de recordatorio (diseño del formulario original) ---------- */
.rd-cabecera { display: flex; gap: 14px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--linea); margin-bottom: 14px; }
.rd-icono {
  width: 46px; height: 46px; border-radius: 50%; background: #fef3c7; font-size: 24px;
  display: grid; place-items: center; flex: none;
}
.rd-cabecera h2 { margin: 0; font-size: 20px; color: #1e293b; }
.rd-sub { color: #64748b; font-size: 13px; margin-top: 2px; }
.rd-form { display: flex; flex-direction: column; gap: 16px; }
.rd-grid2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; }
.rd-campo { display: block; }
.rd-campo input, .rd-form textarea {
  width: 100%; margin-top: 5px; padding: 9px 12px; border: 1px solid #cbd5e1;
  border-radius: 10px; font: inherit; font-size: 15px; background: #fff;
}
.rd-campo input:focus, .rd-form textarea:focus { outline: 2px solid #fdba74; border-color: #f97316; }
.rd-label { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .8px; color: #64748b; }
.rd-label-fila { display: flex; justify-content: space-between; align-items: center; }
.rd-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 7px; }
.rd-chip {
  border: 1px solid #cbd5e1; background: #fff; color: #334155; border-radius: 999px;
  padding: 7px 14px; font-size: 13.5px; font-weight: 600; cursor: pointer;
}
.rd-chip.activa { background: #fff7ed; border-color: #f97316; color: #c2410c; }
.rd-chip.rd-prio-alta.activa { background: #fef2f2; border-color: #dc2626; color: #b91c1c; }
.rd-chip.rd-prio-baja.activa { background: var(--azul-100); border-color: var(--azul-600); color: var(--azul-900); }
.rd-toggle { display: inline-flex; border: 1px solid #cbd5e1; border-radius: 10px; overflow: hidden; margin-top: 7px; }
.rd-seg {
  border: none; background: #fff; color: #64748b; padding: 8px 16px; font-size: 13.5px;
  font-weight: 600; cursor: pointer;
}
.rd-seg.activa { background: #fff7ed; color: #c2410c; }
.rd-fila-dias { display: flex; gap: 16px; align-items: end; margin-top: 10px; }
.rd-dias-campo input { max-width: 160px; font-size: 17px; font-weight: 700; }
.rd-calc { font-size: 17px; color: #1e293b; padding-bottom: 9px; white-space: nowrap; }
.rd-calc span { color: #94a3b8; font-weight: 700; margin-right: 4px; }
.rd-calc b { color: #c2410c; }
.rd-auto {
  border: none; background: none; color: #ea580c; font-size: 12.5px; font-weight: 700;
  cursor: pointer; padding: 0;
}
.rd-auto:hover { text-decoration: underline; }
.rd-enviar {
  width: 100%; margin-top: 18px; padding: 13px; border: none; border-radius: 11px;
  background: #f97316; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer;
}
.rd-enviar:hover:not(:disabled) { background: #ea580c; }
.rd-enviar:disabled { opacity: .55; cursor: wait; }
.rd-nota { color: #94a3b8; font-size: 12.5px; text-align: center; margin: 10px 0 0; }

.rd-nota { color: #94a3b8; font-size: 12.5px; text-align: center; margin: 10px 0 0; }

/* ---------- editor enriquecido de recetas (Quill) ---------- */
#rec-editor {
  min-height: 300px; background: #fff; font-size: 15px; line-height: 1.7;
  border-radius: 0 0 10px 10px; margin-top: 5px;
}
#rec-editor.ql-container { border: 1px solid #cbd5e1; border-top: 0; }
#rec-editor-toolbar.ql-toolbar {
  border: 1px solid #cbd5e1; border-radius: 10px 10px 0 0; margin-top: 5px;
  font-family: inherit;
}
#rec-editor-toolbar .ql-header { width: auto; padding: 2px 6px; }
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before { font-size: 13px; }
.campo-libre:has(#rec-editor-toolbar) input { display: none; }

/* ---------- ficha del paciente: motivo íntegro + primera consulta ---------- */
.motivo-integro { white-space: pre-wrap; max-width: 420px; line-height: 1.55; }
.primera-consulta {
  background: var(--azul-100); border: 1px solid var(--azul-600); border-radius: 10px;
  padding: 10px 14px; margin-bottom: 10px; color: var(--azul-900); line-height: 1.55;
}
.primera-consulta b { color: var(--azul-700); }

/* ---------- archivos del paciente ---------- */
.subida-archivos { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.subida-archivos input[type=file] { flex: none; max-width: 260px; padding: 6px; }
.subida-archivos #arch-desc { flex: 1; min-width: 180px; margin-top: 0; }

@media (max-width: 640px) {
  .rd-grid2 { grid-template-columns: 1fr; }
  .rd-fila-dias { flex-wrap: wrap; }
  .subida-archivos input[type=file] { max-width: none; width: 100%; }
}

/* ---------- ficha modal ---------- */
.fondo-ficha {
  position: fixed; inset: 0; background: rgba(13, 43, 78, .45); z-index: 40;
  display: grid; place-items: start center; padding: 24px 12px; overflow-y: auto;
}
.ficha {
  background: #fff; border-radius: 16px; width: min(880px, 100%);
  box-shadow: 0 24px 80px rgba(13, 43, 78, .35); padding: 22px;
}
.ficha-cabecera {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  border-bottom: 1px solid var(--linea); padding-bottom: 14px; margin-bottom: 14px;
}
.ficha-cabecera h2 { margin: 0; font-size: 21px; color: var(--azul-900); }
.ficha-cabecera .sub { color: var(--gris); font-size: 13.5px; margin-top: 2px; }
.ficha-seccion { margin: 16px 0; }
.ficha-seccion h3 {
  font-size: 13px; text-transform: uppercase; letter-spacing: .5px; color: var(--gris);
  margin: 0 0 8px; border-bottom: 1px solid var(--linea); padding-bottom: 4px;
}
.datos-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px 18px; }
.dato .k { font-size: 11.5px; text-transform: uppercase; letter-spacing: .4px; color: var(--gris); font-weight: 700; }
.dato .v { font-size: 14.5px; color: var(--tinta); }
.dato .v.siempre { white-space: pre-wrap; }
.si-no { font-weight: 700; }
.si-no.si { color: var(--error); }
.si-no.no { color: var(--gris); }

.linea-tiempo { list-style: none; margin: 0; padding: 0; }
.linea-tiempo li {
  position: relative; padding: 8px 0 8px 22px; border-left: 2px solid var(--azul-100);
  margin-left: 8px;
}
.linea-tiempo li::before {
  content: ''; position: absolute; left: -6px; top: 13px; width: 10px; height: 10px;
  border-radius: 50%; background: var(--azul-600); border: 2px solid #fff;
}
.linea-tiempo .cuando { color: var(--gris); font-size: 12px; }
.linea-tiempo .que { font-size: 14px; }
.linea-tiempo .quien { color: var(--azul-700); font-size: 12px; font-weight: 600; }

.nueva-nota { display: flex; gap: 10px; align-items: flex-start; margin-top: 10px; }
.nueva-nota textarea { flex: 1; }
.mini-tabla td { padding: 6px 10px; font-size: 13.5px; }
.acciones-ficha { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 6px; }

/* ---------- toasts ---------- */
#toasts { position: fixed; bottom: 18px; right: 18px; display: flex; flex-direction: column; gap: 10px; z-index: 60; }
.toast {
  background: var(--azul-900); color: #fff; padding: 12px 16px; border-radius: 10px;
  box-shadow: 0 8px 30px rgba(0,0,0,.25); max-width: 380px; font-size: 14px;
  animation: entra .25s ease;
}
.toast.error { background: var(--error); }
.toast.ok { background: var(--ok); }
@keyframes entra { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ===================== MÓVIL (≤700px) ===================== */
input, textarea, select { font-size: 16px; }
.btn { min-height: 44px; }
.btn.chico { min-height: 36px; }

@media (max-width: 700px) {
  .cabecera { position: static; padding: 12px 14px; }
  .marca h1 { font-size: 17px; }
  #reloj { font-size: 12px; }
  .estado-chips { flex-wrap: wrap; width: 100%; }
  .cabecera-usuario { margin-left: auto; }
  .metricas { padding: 0 12px; gap: 8px; grid-template-columns: repeat(2, 1fr); }
  .pestanas { padding: 0 12px; }
  .pestana { padding: 8px 12px; font-size: 13px; }
  .acciones { gap: 10px; padding: 0 12px; }
  .buscador { max-width: none; min-width: 0; width: 100%; order: 5; }
  .tabla-caja { border: none; border-radius: 0; margin: 0; }
  .nota-tabla { display: none; }
  .ajustes { margin: 12px 10px; }
  .pie { padding-bottom: 40px; }

  /* Tabla preconsultas → tarjetas */
  #tabla-preconsultas thead { display: none; }
  #tabla-preconsultas, #tabla-preconsultas tbody { display: block; width: 100%; }
  #tabla-preconsultas tr.fila-pc {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "nombre  pill"
      "tel     tel"
      "motivo  motivo"
      "wa      cita";
    row-gap: 4px; column-gap: 10px;
    background: #fff; border: 1px solid var(--linea); border-radius: 14px;
    margin: 10px 12px; padding: 12px 14px;
    cursor: pointer;
  }
  #tabla-preconsultas td { display: block; border: none; padding: 0; width: auto; }
  td.pc-fecha { display: none; }
  td.pc-nombre { grid-area: nombre; font-weight: 700; color: var(--azul-900); font-size: 16px; }
  td.pc-nombre .nota-celu { display: block; }
  td.pc-estado { grid-area: pill; text-align: right; }
  td.pc-estado .estado-inline { display: none; }
  td.pc-estado .pill { display: inline-block; }
  td.pc-tel { grid-area: tel; }
  td.pc-motivo { grid-area: motivo; }
  td.pc-motivo .motivo-celda { white-space: normal; }
  td.pc-wa { grid-area: wa; }
  td.pc-cita { grid-area: cita; text-align: right; }
  td.pc-cita:empty::after { content: '—'; color: var(--gris); }

  /* Tabla recetas → tarjetas */
  #tabla-recetas thead { display: none; }
  #tabla-recetas, #tabla-recetas tbody { display: block; width: 100%; }
  #tabla-recetas tr.fila-rec {
    display: grid; grid-template-columns: 1fr auto; row-gap: 4px;
    background: #fff; border: 1px solid var(--linea); border-radius: 14px;
    margin: 10px 12px; padding: 12px 14px; cursor: pointer;
  }
  #tabla-recetas td { display: block; border: none; padding: 0; width: auto; }
  td.rec-folio { font-size: 13px; color: var(--azul-700); }
  td.rec-fecha { display: none; }
  td.rec-paciente { font-weight: 700; color: var(--azul-900); font-size: 16px; }
  td.rec-paciente .nota-celu { display: block; font-weight: 400; }
  td.rec-contenido .receta-previa { max-width: none; }
  td.rec-nota { color: var(--gris); font-size: 13px; }
  td.rec-impresa { text-align: right; }
  td.rec-acciones { display: flex; gap: 6px; flex-wrap: wrap; grid-column: 1 / -1; }

  /* Tabla recordatorios → tarjetas */
  #tabla-recordatorios thead { display: none; }
  #tabla-recordatorios, #tabla-recordatorios tbody { display: block; width: 100%; }
  #tabla-recordatorios tr.fila-rd {
    display: grid; grid-template-columns: 1fr auto; row-gap: 4px;
    background: #fff; border: 1px solid var(--linea); border-radius: 14px;
    margin: 10px 12px; padding: 12px 14px; cursor: pointer;
  }
  #tabla-recordatorios tr.fila-rd.rd-vencido { background: #fdf3f2; border-color: #eec5c1; }
  #tabla-recordatorios td { display: block; border: none; padding: 0; width: auto; }
  td.rd-fecha { font-size: 13px; color: var(--azul-700); font-weight: 700; }
  td.rd-fecha span { display: block; color: var(--gris); font-weight: 400; font-size: 12px; }
  td.rd-paciente { font-weight: 700; color: var(--azul-900); font-size: 16px; }
  td.rd-paciente .nota-celu { display: block; font-weight: 400; }
  td.rd-mensaje .motivo-celda { max-width: none; white-space: normal; }
  td.rd-prioridad, td.rd-wa { text-align: right; }
  td.rd-estado { text-align: right; }
  td.rd-acciones { display: flex; gap: 6px; flex-wrap: wrap; grid-column: 1 / -1; }
  .contador-caja { width: 100%; }

  /* Tabla pacientes → tarjetas */
  #tabla-pacientes thead { display: none; }
  #tabla-pacientes, #tabla-pacientes tbody { display: block; width: 100%; }
  #tabla-pacientes tr.fila-pac {
    display: grid; grid-template-columns: 1fr auto; row-gap: 3px;
    background: #fff; border: 1px solid var(--linea); border-radius: 14px;
    margin: 10px 12px; padding: 12px 14px; cursor: pointer;
  }
  #tabla-pacientes td { display: block; border: none; padding: 0; width: auto; }
  td.pac-nombre { font-weight: 700; color: var(--azul-900); font-size: 16px; }
  td.pac-tel { color: var(--gris); }
  td.pac-wa { text-align: right; }
}