/* Módulo de salud: una sola hoja para el inicio del consultorio, la historia clínica y la ficha.
   Principios: la próxima acción siempre a la vista, estados por color consistentes,
   botones grandes para mostrador, nada de información que no se use en el día a día. */
:root {
    --salud-primario: #0f766e;   /* verde azulado: acento de botones y estados del consultorio */
    --salud-primario-oscuro: #0b5e57;
    --salud-espera: #fff6d6;
    --salud-espera-borde: #f3c33c;
    --salud-demora: #c62828;
    --salud-texto-suave: #6b7280;
    --salud-fondo-cabecera: #f4f7fb;
}

.salud-toolbar { background: #fff; border: 1px solid #e3e8ef; border-radius: .5rem; padding: .75rem; margin-bottom: .75rem; }
.salud-toolbar .form-control, .salud-toolbar .form-select { min-height: 2.6rem; }
.btn-lg-accion { padding: .55rem 1.1rem; font-weight: 600; }

/* Resumen del día: chips que también filtran */
.salud-resumen { display: flex; flex-wrap: wrap; gap: .4rem; padding: .6rem .75rem; background: var(--salud-fondo-cabecera); border: 1px solid #e3e8ef; border-top: 0; }
.salud-resumen .chip { border: 1px solid #d5dbe5; background: #fff; border-radius: 999px; padding: .25rem .8rem; font-size: .9rem; color: #334155; cursor: pointer; }
.salud-resumen .chip:hover { border-color: var(--salud-primario); }
.salud-resumen .chip.activo { background: var(--salud-primario); color: #fff; border-color: var(--salud-primario); }
.salud-resumen .chip .num { font-weight: 700; margin-left: .25rem; }
.salud-resumen .chip.espera:not(.activo) { background: var(--salud-espera); border-color: var(--salud-espera-borde); }
.salud-resumen .chip.sinpagar:not(.activo) { color: #b02a37; border-color: #e7a1a9; }

/* Tabla de turnos */
.tabla-salud th { font-weight: 500; color: #4a5568; background: var(--salud-fondo-cabecera); white-space: nowrap; }
.tabla-salud td { vertical-align: middle; }
.tabla-salud .hora { font-size: 1.05rem; font-weight: 600; }
.tabla-salud tr.fila-espera > td { background: var(--salud-espera); }
.tabla-salud tr.fila-demorado .hora { color: var(--salud-demora); }
.tabla-salud tr.fila-baja > td { color: #9aa3b2; }
.tabla-salud tr.fila-baja .fw-semibold { text-decoration: line-through; }
.tabla-salud .accion-principal { min-width: 7.5rem; }

.salud-vacio { padding: 3rem 1rem; text-align: center; color: var(--salud-texto-suave); }
.salud-vacio i { font-size: 2.5rem; display: block; margin-bottom: .5rem; color: #b8c2d3; }

.salud-tabs .nav-link { font-size: 1.05rem; padding: .75rem 1.25rem; }
.dias-semana .nav-link { padding: .5rem 1rem; }
.dias-semana .nav-link .badge { font-size: .65rem; }
.dias-semana .nav-link.hoy { font-weight: 600; }
.buscador-pacientes { background: var(--salud-primario); padding: .75rem; border-radius: .375rem; }
.buscador-pacientes input { font-size: 1.05rem; }

/* Historia clínica */
.hc-alerta-alergias { font-size: 1rem; }
.hc-alerta-alergias strong { letter-spacing: .3px; }

/* Carga de evolución: cabecera del paciente, formulario por secciones y panel lateral */
.hc-cabecera { border: 1px solid #e3e8ef; border-radius: .6rem; background: #fff; margin-bottom: .75rem; }
.hc-cabecera .hc-cabecera-cuerpo { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; padding: .75rem 1rem; }
.hc-avatar { width: 3rem; height: 3rem; border-radius: 50%; background: var(--salud-primario); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.1rem; flex: 0 0 auto; }
.hc-nombre { font-size: 1.35rem; font-weight: 600; margin: 0; line-height: 1.2; }
.hc-datos { display: flex; flex-wrap: wrap; gap: .15rem 1rem; font-size: .88rem; color: var(--salud-texto-suave); }
.hc-datos i { margin-right: .25rem; }
.hc-datos .falta { color: #b8c2d3; font-style: italic; }
/* Ficha de datos del paciente en la cabecera de la historia: etiqueta chica arriba, valor abajo */
.hc-ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .4rem 1.1rem; max-width: 1100px; }
.hc-dato { min-width: 0; }
.hc-dato .et { font-size: .68rem; text-transform: uppercase; letter-spacing: .4px; color: #8a94ab; line-height: 1.1; }
.hc-dato .et i { margin-right: .25rem; }
.hc-dato .val { font-size: .92rem; font-weight: 500; color: #24304f; line-height: 1.25; }
.hc-dato .val.falta { color: #b8c2d3; font-style: italic; font-weight: 400; }
.hc-dato .btn-link.falta { font-size: .85rem; text-decoration: none; }
.hc-dato .btn-link.falta:hover { color: var(--salud-primario); font-style: normal; }
.hc-atendiendo { background: #e8f2fd; border-top: 1px solid #cfe2f8; padding: .45rem 1rem; font-size: .9rem; border-radius: 0 0 .6rem .6rem; }
.hc-form .hc-seccion { font-size: .75rem; text-transform: uppercase; letter-spacing: .4px; color: #8a94ab; font-weight: 600; margin-bottom: .2rem; }
.hc-form textarea { resize: vertical; }
.hc-config { background: var(--salud-fondo-cabecera); border-bottom: 1px solid #e3e8ef; padding: .6rem 1rem; }
.hc-proximo { border-left: 3px solid #2e9d5b; padding-left: .6rem; margin-bottom: .4rem; }
.horarios-libres { max-height: 210px; overflow-y: auto; }

/* =============================================================
   Inicio del consultorio (turnos y pacientes): diseño minimalista.
   Título grande del día, pestañas tipo segmento, días en píldoras,
   filtros subrayados y filas limpias con un punto de color por estado.
   ============================================================= */
/* Ocupa el ancho disponible: en monitores grandes no deja márgenes vacíos a los costados
   (el tope solo evita filas interminables en pantallas ultra anchas) */
.ct-pagina { max-width: 1840px; margin: 0 auto; padding: 1rem 1rem 2rem; }

.ct-segmento { display: inline-flex; background: #eef0f3; border-radius: .6rem; padding: .2rem; margin-bottom: 1rem; }
.ct-segmento button { border: 0; background: transparent; padding: .4rem 1.1rem; border-radius: .45rem; font-weight: 500; color: #4b5563; }
.ct-segmento button.activo { background: #fff; color: #111827; box-shadow: 0 1px 2px rgba(0,0,0,.08); }

.ct-titulo { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .75rem 1rem; margin-bottom: 1rem; }
.ct-titulo h1 { font-size: 1.9rem; font-weight: 600; margin: 0; letter-spacing: -.3px; color: #111827; }
.ct-titulo h1::first-letter { text-transform: uppercase; }
.ct-subtitulo { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; color: var(--salud-texto-suave); margin-top: .15rem; }
.ct-prof .input-group { width: auto; flex-wrap: nowrap; }
.ct-prof .form-control { border: 0; box-shadow: none; background: transparent; font-weight: 600; color: #111827; padding: .1rem .25rem; min-width: 12rem; }
.ct-prof .btn { border: 0; background: transparent; color: #111827; padding: .1rem .25rem; }
.ct-acciones { display: flex; flex-wrap: wrap; gap: .5rem; }

.ct-btn-primario { background: var(--salud-primario); border: 1px solid var(--salud-primario); color: #fff; font-weight: 600; padding: .55rem 1.1rem; border-radius: .5rem; }
.ct-btn-primario:hover, .ct-btn-primario:focus { background: var(--salud-primario-oscuro); border-color: var(--salud-primario-oscuro); color: #fff; }
.ct-btn-secundario { background: #fff; border: 1px solid #d9dee5; color: #111827; padding: .55rem 1rem; border-radius: .5rem; }
.ct-btn-secundario:hover { background: #f5f7f9; color: #111827; }
.ct-btn-accion { border: 1.5px solid var(--salud-primario); color: var(--salud-primario); background: #fff; font-weight: 600; border-radius: .5rem; padding: .4rem 1rem; }
.ct-btn-accion:hover { background: var(--salud-primario); border-color: var(--salud-primario); color: #fff; }
.ct-btn-accion.suave { border-color: #d9dee5; color: #374151; font-weight: 500; }
.ct-btn-accion.suave:hover { background: #f5f7f9; color: #111827; }
.ct-btn-accion.peligro { border-color: #e7a1a9; color: #b02a37; }
.ct-btn-accion.peligro:hover { background: #b02a37; border-color: #b02a37; color: #fff; }
.ct-mas { border: 0; background: transparent; color: #6b7280; padding: .4rem .5rem; border-radius: .4rem; }
.ct-mas:hover { background: #eef0f3; color: #111827; }
.ct-icono { border: 0; background: transparent; color: #4b5563; padding: .4rem .55rem; border-radius: .4rem; text-decoration: none; }
.ct-icono:hover { background: #eef0f3; color: #111827; }

.ct-semana { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin-bottom: 1rem; }
.ct-flecha { border: 0; background: transparent; color: #374151; padding: .4rem .55rem; border-radius: .4rem; }
.ct-flecha:hover { background: #eef0f3; }
.ct-dias { display: inline-flex; background: #eef0f3; border-radius: .7rem; padding: .25rem; gap: .15rem; margin: 0 .35rem; }
.ct-dias button { border: 0; background: transparent; border-radius: .5rem; padding: .35rem .9rem; display: flex; flex-direction: column; align-items: center; line-height: 1.15; color: #374151; min-width: 3.9rem; }
.ct-dias button small { font-size: .72rem; color: #6b7280; text-transform: capitalize; }
.ct-dias button span { font-weight: 600; font-size: 1.05rem; }
.ct-dias button.activo { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.ct-dias button.activo small, .ct-dias button.activo span { color: var(--salud-primario); }
.ct-ir-fecha { display: inline-flex; align-items: center; gap: .4rem; color: #374151; padding: .3rem .6rem; border-radius: .4rem; cursor: pointer; }
.ct-ir-fecha:hover { background: #eef0f3; }
.ct-ir-fecha input { border: 0; background: transparent; color: #374151; width: 8.6rem; padding: 0; }
.ct-ir-fecha input:focus { outline: none; }

.ct-aviso { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; background: #fff7e6; border: 1px solid #f3d9a4; border-radius: .6rem; padding: .6rem .9rem; margin-bottom: 1rem; color: #5b4300; }

.ct-panel { background: #fff; border: 1px solid #e5e8ec; border-radius: .8rem; overflow: hidden; }
.ct-filtros { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; padding: 0 .75rem; border-bottom: 1px solid #e5e8ec; }
.ct-filtros > button { border: 0; background: transparent; padding: .85rem .6rem; color: #4b5563; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: .92rem; white-space: nowrap; }
.ct-filtros > button span { color: #9ca3af; margin-left: .15rem; }
.ct-filtros > button:hover { color: #111827; }
.ct-filtros > button.activo { color: #111827; font-weight: 600; border-bottom-color: #111827; }
.ct-filtros > button.sinpagar.activo { color: #b02a37; border-bottom-color: #b02a37; }
.ct-filtros-der { margin-left: auto; display: flex; gap: .15rem; }

.ct-tabla td { vertical-align: middle; padding: .85rem .75rem; border-color: #eef0f3; }
.ct-tabla tbody tr:last-child td { border-bottom: 0; }
.ct-tabla thead th { font-weight: 500; font-size: .76rem; text-transform: uppercase; letter-spacing: .3px; color: #6b7280; background: #fafbfc; border-bottom: 1px solid #e5e8ec; padding: .6rem .75rem; }
.ct-tabla .s { font-size: .82rem; color: var(--salud-texto-suave); }
.ct-hora { white-space: nowrap; }
.ct-hora .h { font-size: 1.1rem; font-weight: 600; line-height: 1.2; color: #111827; }
.ct-sobreturno { color: #b45309; font-weight: 600; }
.ct-paciente a { color: #111827; text-decoration: none; font-weight: 500; }
.ct-paciente a:hover { color: var(--salud-primario); }
.ct-motivo { color: #374151; }
.ct-suave { color: var(--salud-texto-suave); }
.ct-pago { white-space: nowrap; }
.ct-pagada { color: #15803d; font-size: .9rem; }
.ct-estado { white-space: nowrap; color: #374151; }
.punto { display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; margin-right: .45rem; background: #9ca3af; vertical-align: middle; }
.punto-reservado { background: #3b82f6; }
.punto-confirmado { background: #06b6d4; }
.punto-espera { background: #f59e0b; }
.punto-atendido { background: #10b981; }
.punto-baja { background: #ef4444; }
.ct-tabla tr.fila-espera > td { background: #fffdf5; }
.ct-tabla tr.fila-demorado .h { color: var(--salud-demora); }
.ct-tabla tr.fila-baja td, .ct-tabla tr.fila-baja .ct-paciente a { color: #9ca3af; }
.ct-tabla tr.fila-baja .ct-paciente a { text-decoration: line-through; }
.ct-acciones-fila { text-align: right; white-space: nowrap; }
.ct-acciones-fila .ct-btn-accion { min-width: 6.5rem; }

.ct-buscador { position: relative; padding: .75rem; border-bottom: 1px solid #e5e8ec; }
.ct-buscador i { position: absolute; left: 1.5rem; top: 50%; transform: translateY(-50%); color: #9ca3af; }
.ct-buscador input { padding-left: 2.3rem; border-radius: .5rem; border-color: #e5e8ec; }
.ct-buscador input:focus { border-color: var(--salud-primario); box-shadow: 0 0 0 .2rem rgba(15,118,110,.12); }
.ct-paginacion { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .15rem; padding: .6rem; border-top: 1px solid #e5e8ec; }
.ct-pagina-activa { background: #111827; color: #fff; border-radius: .4rem; }

.ct-toast { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 1090; display: flex; align-items: center; gap: .6rem; background: #111827; color: #fff; padding: .7rem 1rem; border-radius: .6rem; box-shadow: 0 8px 24px rgba(0,0,0,.2); font-size: .92rem; max-width: calc(100vw - 2.5rem); }
.ct-toast .btn-close { font-size: .65rem; }

@media (max-width: 767.98px) {
    .ct-pagina { padding: .75rem .5rem 1.5rem; }
    .ct-titulo h1 { font-size: 1.45rem; }
    .ct-acciones .btn { flex: 1 1 auto; text-align: center; }
    .ct-dias button { min-width: 2.9rem; padding: .3rem .5rem; }
    .ct-tabla.tabla-tarjetas > tbody > tr { padding: .7rem .85rem; }
    .ct-tabla.tabla-tarjetas > tbody > tr > td.tt-esquina { top: .75rem; }
    .ct-tabla.tabla-tarjetas tr.fila-espera { background: #fffdf5; }
    .ct-filtros { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .ct-acciones-fila .ct-btn-accion { min-width: auto; }
}

/* =============================================================
   Atención y evolución (historia clínica): mismo lenguaje que el inicio.
   Cabecera con avatar y datos en una línea, franja del turno, formulario
   en un panel con pie fijo, panel lateral de antecedentes y próximo turno,
   y las evoluciones anteriores como tarjetas.
   ============================================================= */
.hc2-volver { display: inline-flex; align-items: center; gap: .25rem; color: var(--salud-texto-suave); text-decoration: none; font-size: .92rem; margin-bottom: .9rem; }
.hc2-volver:hover { color: #111827; }
.hc2-cab { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1rem; margin-bottom: .9rem; }
.hc2-avatar { width: 3.4rem; height: 3.4rem; border-radius: 50%; background: #e6f1ef; color: var(--salud-primario); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 1.15rem; flex: 0 0 auto; }
.hc2-cab-texto { flex: 1 1 18rem; min-width: 0; }
.hc2-cab-texto h1 { font-size: 1.75rem; font-weight: 600; margin: 0; letter-spacing: -.3px; color: #111827; line-height: 1.2; }
.hc2-meta { display: flex; flex-wrap: wrap; gap: .15rem .9rem; color: var(--salud-texto-suave); margin-top: .2rem; font-size: .95rem; }
.hc2-link { border: 0; background: transparent; color: var(--salud-primario); padding: 0; font-size: .9rem; font-weight: 500; }
.hc2-link:hover { text-decoration: underline; }
.hc2-link.activo { color: #111827; }

.hc2-turno { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.1rem; background: #e9f3f1; border-radius: .6rem; padding: .6rem 1rem; margin-bottom: 1rem; color: #1f2937; font-size: .95rem; }
.hc2-turno .punto { margin-right: .35rem; }
.hc2-ok { color: #15803d; }
.hc2-nota { color: var(--salud-primario); font-size: .88rem; }
.hc2-alergias { display: flex; align-items: center; gap: .6rem; background: #fdecec; border: 1px solid #f5b5b5; color: #991b1b; border-radius: .6rem; padding: .6rem .9rem; margin-bottom: 1rem; font-size: 1rem; }
.hc2-alergias i { font-size: 1.2rem; }

.hc2-panel-cab { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .95rem 1.25rem; border-bottom: 1px solid #e5e8ec; }
.hc2-panel-cab h2 { font-size: 1.05rem; font-weight: 600; margin: 0; color: #111827; }
.hc2-panel-cuerpo { padding: 1.1rem 1.25rem; }
.hc2-lateral { margin-bottom: 1rem; }
.hc2-dato { margin-bottom: .75rem; }
.hc2-dato:last-child { margin-bottom: 0; }
.hc2-dato .et, .hc2-evo-dato .et { font-size: .78rem; color: #6b7280; line-height: 1.2; }
.hc2-dato .val { color: #111827; white-space: pre-wrap; }
.hc2-dato .val.falta { color: #9ca3af; }
.hc2-proximo { border-left: 3px solid var(--salud-primario); padding-left: .6rem; margin-bottom: .6rem; }

.hc2-label { display: block; font-size: .88rem; font-weight: 500; color: #374151; margin-bottom: .3rem; }
.hc2-form .form-control, .hc2-form .form-select { border-color: #dfe3e8; border-radius: .5rem; padding: .55rem .75rem; }
.hc2-form .form-control:focus, .hc2-form .form-select:focus { border-color: var(--salud-primario); box-shadow: 0 0 0 .2rem rgba(15,118,110,.12); }
.hc2-form textarea.form-control { resize: vertical; }
.hc2-firma { padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #eef0f3; }
.hc2-config { background: #fafbfc; border-bottom: 1px solid #e5e8ec; padding: .75rem 1.25rem; }
.hc2-drop { position: relative; display: flex; align-items: center; justify-content: center; gap: .5rem; border: 1.5px dashed #d1d5db; border-radius: .6rem; padding: 1.4rem 1rem; color: #4b5563; text-align: center; cursor: pointer; margin: 0; }
.hc2-drop:hover { border-color: var(--salud-primario); background: #f6fbfa; }
.hc2-drop input[type=file] { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.hc2-enlace { color: var(--salud-primario); font-weight: 500; }
.hc2-pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; padding: .9rem 1.25rem; border-top: 1px solid #e5e8ec; background: #fafbfc; }
.ct-btn-secundario.sin-borde { border-color: transparent; background: transparent; }
.ct-btn-secundario.sin-borde:hover { background: #eef0f3; }

.hc2-lista-cab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; margin: 0 0 .75rem; }
.hc2-lista-cab h2 { font-size: 1.05rem; font-weight: 600; margin: 0; color: #111827; }
.hc2-lista-cab h2 span { color: #9ca3af; font-weight: 500; margin-left: .25rem; }
.hc2-evo { margin-bottom: .9rem; }
.hc2-evo.resaltada { border-color: #f3c33c; box-shadow: 0 0 0 3px #fff3c4; }
.hc2-evo-cab { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; padding: .85rem 1.25rem .4rem; }
.hc2-evo-cab .fecha { font-weight: 600; color: #111827; }
.hc2-evo-cuerpo { padding: .4rem 1.25rem 1rem; }
.hc2-evo-dato { display: grid; grid-template-columns: 9rem 1fr; gap: .25rem 1rem; padding: .3rem 0; }
.hc2-evo-dato .et { font-size: .88rem; padding-top: .05rem; }
.hc2-evo-dato .val { color: #111827; white-space: pre-wrap; }
.hc2-chip { display: inline-flex; align-items: center; gap: .3rem; background: #eef0f3; color: #4b5563; border-radius: 999px; padding: .15rem .6rem; font-size: .78rem; }
.hc2-chip a { color: #111827; text-decoration: none; }
.hc2-chip.oscuro { background: #111827; color: #fff; }
.hc2-quitar { border: 0; background: transparent; color: #9ca3af; padding: 0 0 0 .15rem; line-height: 1; }
.hc2-quitar:hover { color: #b02a37; }
.hc2-adjuntos { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: .6rem; }
.hc2-version { border-left: 2px dashed #c9ced8; padding-left: .75rem; margin: .6rem 0 .4rem .25rem; font-size: .85rem; color: #5b6478; }

@media (max-width: 767.98px) {
    .hc2-cab-texto h1 { font-size: 1.35rem; }
    .hc2-avatar { width: 2.8rem; height: 2.8rem; font-size: 1rem; }
    .hc2-cab .ct-acciones { width: 100%; }
    .hc2-turno .ms-auto { margin-left: 0 !important; width: 100%; }
    .hc2-panel-cab, .hc2-panel-cuerpo, .hc2-pie, .hc2-evo-cab, .hc2-evo-cuerpo { padding-left: .9rem; padding-right: .9rem; }
    .hc2-evo-dato { grid-template-columns: 1fr; gap: 0; }
    .hc2-pie .btn { flex: 1 1 auto; }
}

@media (max-width: 767.98px) {
    .salud-toolbar .ms-auto { margin-left: 0 !important; width: 100%; }
    .salud-toolbar .ms-auto .btn { flex: 1 1 auto; }
    .salud-toolbar .ms-auto .dropdown .btn { flex: 0 0 auto; }
    .tabla-salud .accion-principal { min-width: auto; }
}

/* ───── Celular (menos de 768 px). En escritorio nada de esto aplica. ─────
   .tabla-tarjetas: cada fila de la tabla pasa a ser una tarjeta (sin columnas que se corran
   de costado). En cada celda: data-label="…" pone la etiqueta; .tt-esquina la lleva arriba a la
   derecha (estado); .tt-acciones deja los botones abajo; .tt-oculta la saca. */
@media (max-width: 767.98px) {
    .salud-movil-ancho { width: 100% !important; }
    .table-responsive:has(> .tabla-tarjetas) { overflow: visible; }
    .tabla-tarjetas thead { display: none; }
    .tabla-tarjetas, .tabla-tarjetas > tbody { display: block; width: 100%; }
    .tabla-tarjetas > tbody > tr { display: flex; flex-wrap: wrap; align-items: baseline; position: relative; padding: .6rem .75rem; border-bottom: 1px solid #e3e8ef; }
    .tabla-tarjetas > tbody > tr > td { display: block; width: 100%; border: 0 !important; padding: .1rem 0 !important; background: transparent; box-shadow: none !important; text-align: left !important; }
    .tabla-tarjetas > tbody > tr > td[colspan] { text-align: center !important; }
    .tabla-tarjetas > tbody > tr > td[data-label]::before { content: attr(data-label) ": "; color: #8a94ab; font-size: .78rem; }
    .tabla-tarjetas > tbody > tr > td.tt-esquina { position: absolute; top: .6rem; right: .75rem; width: auto; padding: 0 !important; }
    .tabla-tarjetas > tbody > tr > td.tt-acciones { padding-top: .45rem !important; white-space: normal !important; display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
    .tabla-tarjetas > tbody > tr > td.tt-acciones .me-1 { margin-right: 0 !important; }
    .tabla-tarjetas > tbody > tr > td.tt-titulo { font-size: 1.02rem; padding-right: 6.5rem !important; }
    .tabla-tarjetas > tbody > tr > td.tt-oculta { display: none; }
    .tabla-tarjetas > tbody > tr > td.tt-primero { order: -1; }
    .tabla-tarjetas > tbody > tr > td.tt-enlinea { display: inline-block; width: auto; margin-right: .45rem; font-size: 1.02rem; font-weight: 600; }
    /* Filas de una sola línea (lugar libre de la agenda): hora, estado y botón a la derecha */
    .tabla-tarjetas > tbody > tr.tt-linea { flex-wrap: nowrap; align-items: center; gap: .6rem; padding: .4rem .75rem; }
    .tabla-tarjetas > tbody > tr.tt-linea > td { width: auto; }
    .tabla-tarjetas > tbody > tr.tt-linea > td:last-child { margin-left: auto; }
    .tabla-tarjetas.table-striped > tbody > tr:nth-of-type(odd) { background: #f7f9fc; }
    .tabla-salud.tabla-tarjetas tr.fila-espera { background: var(--salud-espera); }
    .tabla-salud.tabla-tarjetas tr.fila-baja { color: #9aa3b2; }

    /* Días de la semana y chips del resumen: una sola fila que se desliza */
    .dias-semana { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
    .dias-semana .nav-link { white-space: nowrap; padding: .45rem .8rem; }
    .salud-resumen { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .salud-resumen .chip { white-space: nowrap; }

    /* Historia clínica: cabecera del paciente en dos columnas */
    .hc-cabecera .hc-cabecera-cuerpo { padding: .65rem .75rem; gap: .6rem; align-items: flex-start; }
    .hc-avatar { width: 2.5rem; height: 2.5rem; font-size: .95rem; }
    .hc-cabecera .hc-cabecera-cuerpo > .me-auto { flex: 1 1 calc(100% - 4rem); min-width: 0; }
    .hc-ficha { grid-template-columns: 1fr 1fr; gap: .45rem .75rem; }
    .hc-nombre { font-size: 1.2rem; }
    .hc-acciones { width: 100%; }
    .hc-acciones > .btn, .hc-acciones > a.btn { flex: 1 1 auto; }
    /* Primero la consulta; el panel (próximo turno, antecedentes, turnos) debajo */
    .hc-col-lateral { order: 2; }

    /* Modales del consultorio a pantalla completa. Mientras hay uno abierto, el área de contenido
       pasa por encima de la barra superior (si no, la barra tapa el título del modal). */
    .content-area:has(.modal-salud) { z-index: 950; }
    .modal-salud .modal-dialog { margin: 0; max-width: none; width: 100%; min-height: 100%; }
    .modal-salud .modal-content { min-height: 100vh; border: 0; border-radius: 0; }
    .modal-salud .modal-footer { position: sticky; bottom: 0; background: #fff; flex-wrap: wrap; }
    .modal-salud .modal-footer > .btn { flex: 1 1 auto; }
}
@media print {
    .d-print-none, .nav, .btn, .salud-toolbar, .salud-resumen, .ct-toast, .ct-segmento, .ct-semana, .ct-filtros, .hc2-volver { display: none !important; }
    .ct-panel { border: 0; }
}

/* ===== Tema del consultorio: el azul de Bootstrap pasa al verde de salud =====
   Solo en las pantallas del módulo (MainLayout pone .tema-salud en salud/, turnos/ e historias-clinicas/). */
.tema-salud .btn-primary { color: #fff; background-color: var(--salud-primario); border-color: var(--salud-primario); }
.tema-salud .btn-primary:hover, .tema-salud .btn-primary:focus { color: #fff; background-color: var(--salud-primario-oscuro); border-color: var(--salud-primario-oscuro); }
.tema-salud .btn-primary:active, .tema-salud .btn-primary.active, .tema-salud .show > .btn-primary.dropdown-toggle { background-color: #0a524c; border-color: #0a524c; }
.tema-salud .btn-primary:disabled, .tema-salud .btn-primary.disabled { background-color: var(--salud-primario); border-color: var(--salud-primario); }
.tema-salud .btn-primary:focus, .tema-salud .btn-outline-primary:focus { box-shadow: 0 0 0 .25rem rgba(15, 118, 110, .35); }
.tema-salud .btn-outline-primary { color: var(--salud-primario); border-color: var(--salud-primario); }
.tema-salud .btn-outline-primary:hover, .tema-salud .btn-outline-primary:active, .tema-salud .btn-outline-primary.active,
.tema-salud .show > .btn-outline-primary.dropdown-toggle { color: #fff; background-color: var(--salud-primario); border-color: var(--salud-primario); }
.tema-salud .btn-outline-primary:disabled { color: var(--salud-primario); background: transparent; }
.tema-salud .bg-primary { background-color: var(--salud-primario) !important; }
.tema-salud .text-primary { color: var(--salud-primario) !important; }
.tema-salud .border-primary { border-color: var(--salud-primario) !important; }
.tema-salud .nav-pills .nav-link.active { background-color: var(--salud-primario); }
.tema-salud .form-check-input:checked { background-color: var(--salud-primario); border-color: var(--salud-primario); }
.tema-salud .form-control:focus, .tema-salud .form-select:focus, .tema-salud .form-check-input:focus {
    border-color: #5fb3aa; box-shadow: 0 0 0 .25rem rgba(15, 118, 110, .2); }
.tema-salud .spinner-border.text-primary { color: var(--salud-primario) !important; }
.tema-salud a:not(.btn):not(.dropdown-item):not(.badge):not(.nav-link) { color: var(--salud-primario); }
.tema-salud a:not(.btn):not(.dropdown-item):not(.badge):not(.nav-link):hover { color: var(--salud-primario-oscuro); }
.tema-salud .nav-tabs .nav-link.active, .tema-salud .nav-tabs .nav-link:hover { color: var(--salud-primario); }
.tema-salud .btn-link { color: var(--salud-primario); }
.tema-salud .btn-link:hover { color: var(--salud-primario-oscuro); }
