/* MediXentral — estilos propios sobre Tabler */

.mx-brand { font-weight: 700; letter-spacing: .3px; }

/* Select2 alineado con inputs de Tabler */
.select2-container .select2-selection--single { height: 38px; border-color: var(--tblr-border-color); }
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 36px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; }
.select2-container { width: 100% !important; }

/* Portal del paciente: tarjetas grandes de examen */
.mx-examen-card { transition: transform .08s ease, box-shadow .08s ease; }
.mx-examen-card:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1rem rgba(0,0,0,.10); }
.mx-examen-card .mx-examen-icono { font-size: 2.4rem; line-height: 1; }
.mx-examen-valor { font-size: 1.9rem; font-weight: 700; line-height: 1.1; }

/* Resultado del pre-diagnóstico */
.mx-resultado { border-left: 6px solid var(--tblr-border-color); }
.mx-resultado .mx-clasif { font-size: 1.6rem; font-weight: 700; }
.mx-valor-grande { font-size: 3rem; font-weight: 800; line-height: 1; }

/* Inputs numéricos grandes en el formulario de medición */
.mx-input-medir { font-size: 2rem; font-weight: 700; text-align: center; height: auto; padding: .5rem; }

/* Input de archivo oculto pero ACTIVABLE (no display:none, que Chrome bloquea
   al abrir el diálogo desde un label). */
.mx-file-hidden {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    border: 0; opacity: 0;
}

/* Guía de ayuda: capturas de pantalla */
.mx-shot {
    max-width: 100%;
    border: 1px solid var(--tblr-border-color);
    border-radius: 8px;
    box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.10);
    display: block;
    margin: .5rem 0;
}
.mx-ayuda h2 { scroll-margin-top: 5rem; margin-top: 2.5rem; }
.mx-ayuda .mx-paso { counter-increment: mxpaso; }
.mx-ayuda ol.mx-pasos { font-size: 1.05rem; line-height: 1.7; }

@media print {
    .navbar, .mx-no-print, .page-header .btn { display: none !important; }
    .page-wrapper { margin: 0 !important; }
}

/* ============ RECETA (formato del SISPA: dos mitades con corte) ============ */
.rx-fondo { background: #6b7a8f; min-height: 100vh; padding: 1px 0; }
.rx-hoja {
    width: 210mm; min-height: 148mm;          /* media hoja: mitad superior de A4 */
    margin: 14px auto; padding: 4mm 2mm;
    background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.35);
    display: flex; gap: 0; color: #1a2a3a;
}
.rx-mitad { flex: 1; position: relative; padding: 2mm 3mm; display: flex; flex-direction: column; min-width: 0; }
.rx-marca { position: absolute; left: 50%; top: 58%; width: 40mm; transform: translate(-50%, -50%);
    opacity: .07; pointer-events: none; z-index: 0; }
.rx-membrete, .rx-paciente, .rx-cuerpo, .rx-firma { position: relative; z-index: 1; }
.rx-corte { width: 8mm; flex-shrink: 0; position: relative; display: flex; align-items: center; justify-content: center; color: #999; }
.rx-corte::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; border-left: 2px dashed #b0b0b0; }
.rx-corte span { position: relative; background: #fff; padding: 1mm 0; font-size: 13px; }

.rx-membrete { display: flex; align-items: center; gap: 3mm; border: 1.5px solid #d8b44a;
    background: linear-gradient(#fffdf3, #fbf0c9); border-radius: 3mm; padding: 2mm 3mm; }
.rx-logo { width: 13mm; height: 13mm; object-fit: contain; }
.rx-datos-medico { flex: 1; text-align: center; line-height: 1.2; }
.rx-nombre { font-family: Georgia, serif; font-weight: bold; font-size: 14px; color: #1a3a6b; }
.rx-credencial { font-size: 7px; color: #555; letter-spacing: .3px; text-transform: uppercase; }
.rx-hospital { font-weight: bold; font-size: 9.5px; color: #b8352f; margin-top: .5mm; }
.rx-contacto { font-size: 7.5px; color: #444; }

.rx-paciente { margin: 3mm 0 2mm; font-size: 10.5px; }
.rx-paciente span { color: #555; font-size: 9.5px; }
.rx-paciente > div { border-bottom: 1px dotted #999; padding: 1mm 0; }

.rx-cuerpo { flex: 1; position: relative; z-index: 1; }
.rx-rp { font-family: Georgia, serif; font-size: 20px; font-weight: bold; color: #1a3a6b; margin: 1mm 0 2mm; }
.rx-lista { margin: 0; padding-left: 6mm; }
.rx-lista li { margin-bottom: 2mm; font-size: 10.5px; }
.rx-cant { color: #b8352f; font-weight: bold; white-space: nowrap; margin-left: 4px; }
.rx-indica { font-size: 9.5px; color: #234; }
.rx-obs { font-size: 9px; margin-top: 2mm; }

.rx-firma { margin-top: auto; display: flex; justify-content: center; padding-top: 8mm; }
.rx-linea-firma { border-top: 1px solid #333; padding-top: 1mm; font-size: 9.5px; font-weight: bold; text-align: center; min-width: 55mm; }

/* Variante A4 apaisada: misma receta a página completa */
.rx-hoja--a4 { width: 297mm; min-height: 210mm; padding: 8mm 5mm; }
.rx-hoja--a4 .rx-logo { width: 18mm; height: 18mm; }
.rx-hoja--a4 .rx-nombre { font-size: 18px; }
.rx-hoja--a4 .rx-credencial { font-size: 9px; }
.rx-hoja--a4 .rx-hospital { font-size: 12px; }
.rx-hoja--a4 .rx-contacto { font-size: 9.5px; }
.rx-hoja--a4 .rx-paciente { font-size: 13px; }
.rx-hoja--a4 .rx-paciente span { font-size: 11.5px; }
.rx-hoja--a4 .rx-rp { font-size: 26px; }
.rx-hoja--a4 .rx-lista li { font-size: 13px; margin-bottom: 3mm; }
.rx-hoja--a4 .rx-indica { font-size: 12px; }
.rx-hoja--a4 .rx-obs { font-size: 11px; }
.rx-hoja--a4 .rx-linea-firma { font-size: 12px; min-width: 70mm; }
.rx-hoja--a4 .rx-marca { width: 60mm; }

.rx-botones { text-align: center; margin: 14px 0; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

@media print {
    @page { size: A4 portrait; margin: 0; }
    /* La variante A4 apaisada fija su @page desde la propia página (style inline). */
    body { background: #fff !important; }
    .rx-fondo { background: #fff; padding: 0; }
    .rx-botones { display: none !important; }
    .rx-hoja { margin: 0; box-shadow: none; }
    .rx-membrete { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ===== Solicitud de estudios (orden de laboratorio, forma del SISPA) ===== */
/* Hoja de marcado en pantalla: columnas de categorías con casilleros */
.mx-hoja-examenes { column-width: 250px; column-gap: 12px; }
.mx-cat-examenes {
    break-inside: avoid; border: 1px solid #d4dbe3; border-radius: 6px;
    padding: 4px 8px 6px; margin: 0 0 10px; background: #fbfcfe;
}
.mx-cat-examenes legend {
    float: none; width: auto; font-size: 12px; font-weight: bold; color: #fff;
    background: #1a4e8a; border-radius: 4px; padding: 2px 10px; margin-bottom: 4px;
}
.mx-examen-item {
    display: flex; gap: 6px; align-items: flex-start; padding: 2px 4px;
    border-radius: 4px; cursor: pointer; font-size: 13px; margin: 0;
}
.mx-examen-item span { min-width: 0; overflow-wrap: anywhere; }
.mx-examen-item input { width: 15px; height: 15px; accent-color: #1a4e8a; flex-shrink: 0; margin-top: 2px; }
.mx-examen-item:hover { background: #eaf3ff; }
.mx-examen-item.marcado { background: #dff1de; font-weight: bold; }
.mx-examen-item.marcado span::after { content: ' ✗'; color: #c00; }

/* Orden imprimible: título, grupos por categoría en columnas */
.rx-titulo-orden {
    text-align: center; font-family: Georgia, serif; font-weight: bold;
    font-size: 12px; color: #1a3a6b; letter-spacing: .5px; margin-top: 2mm;
}
.rx-titulo-orden span { color: #b8352f; }
.rx-exa-titulo { font-weight: bold; font-size: 9.5px; margin: 1mm 0; }
.rx-grupos { columns: 3; column-gap: 4mm; }
.rx-grupo { break-inside: avoid; border: 1px solid #c9d3df; border-radius: 2mm; padding: 1mm 2mm 1.5mm; margin-bottom: 2.5mm; }
.rx-grupo-titulo {
    background: #1a4e8a; color: #fff; font-size: 8px; font-weight: bold;
    letter-spacing: .4px; border-radius: 1.5mm; padding: .6mm 2.5mm; margin-bottom: 1mm; display: inline-block;
}
.rx-grupo .rx-exa { border-bottom: 1px dotted #d5dce4; font-size: 8.5px; padding: .7mm 0; }
.rx-grupo .rx-exa:last-child { border-bottom: none; }
.rx-casilla { font-size: 10px; }

/* Variante A4 vertical completa para la orden */
.rx-hoja--a4v { width: 210mm; min-height: 297mm; padding: 8mm 6mm; }
.rx-hoja--a4v .rx-logo { width: 18mm; height: 18mm; }
.rx-hoja--a4v .rx-nombre { font-size: 18px; }
.rx-hoja--a4v .rx-credencial { font-size: 9px; }
.rx-hoja--a4v .rx-hospital { font-size: 12px; }
.rx-hoja--a4v .rx-contacto { font-size: 9.5px; }
.rx-hoja--a4v .rx-titulo-orden { font-size: 16px; margin-top: 4mm; }
.rx-hoja--a4v .rx-paciente { font-size: 13px; }
.rx-hoja--a4v .rx-paciente span { font-size: 11.5px; }
.rx-hoja--a4v .rx-exa-titulo { font-size: 12px; }
.rx-hoja--a4v .rx-grupos { columns: 2; }
.rx-hoja--a4v .rx-grupo-titulo { font-size: 10px; }
.rx-hoja--a4v .rx-grupo .rx-exa { font-size: 11px; padding: 1mm 0; }
.rx-hoja--a4v .rx-casilla { font-size: 12px; }
.rx-hoja--a4v .rx-obs { font-size: 11px; }
.rx-hoja--a4v .rx-linea-firma { font-size: 12px; min-width: 70mm; }
.rx-hoja--a4v .rx-marca { width: 60mm; }
@media print { .rx-grupo-titulo, .mx-cat-examenes legend { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }

/* Solicitud escrita para el especialista en la orden impresa */
.rx-solicitud {
    border: 1px solid #b8352f; border-radius: 2mm; padding: 1.5mm 2.5mm;
    margin-top: 2mm; font-size: 9px; line-height: 1.35;
}
.rx-solicitud-titulo { color: #b8352f; font-weight: bold; font-size: 8px; letter-spacing: .5px; margin-bottom: .5mm; }
.rx-hoja--a4v .rx-solicitud { font-size: 12px; padding: 2.5mm 3.5mm; }
.rx-hoja--a4v .rx-solicitud-titulo { font-size: 10.5px; }

/* Pestañas coloreadas de la hoja de pedido: cada hoja con su color, y las
   cabeceras de categoría del panel a juego (se sabe en qué hoja se está). */
.mx-tab {
    --hc: #0054a6;
    color: var(--hc) !important; font-weight: 600;
    border: 1px solid var(--hc) !important; border-bottom: none !important;
    border-radius: 8px 8px 0 0; margin-right: 5px; background: #fff;
}
@supports (background: color-mix(in srgb, red 10%, white)) {
    .mx-tab { background: color-mix(in srgb, var(--hc) 9%, #fff); }
}
.mx-tab.active, .mx-tab:hover { background: var(--hc) !important; color: #fff !important; }
.mx-pane .mx-cat-examenes legend { background: var(--hc); }
.mx-pane .mx-cat-examenes { border-color: var(--hc); border-width: 1px; }
.mx-pane .mx-examen-item input { accent-color: var(--hc); }

/* Las pestañas se montan sobre el card-body (margen negativo de
   card-header-tabs): sin capa propia, la mitad inferior del botón no
   recibía el clic. */
.mx-tab { position: relative; z-index: 1; padding: 8px 18px; }

/* ===== RIDE de la factura electrónica ===== */
.ride-cabecera { display: flex; gap: 6mm; align-items: flex-start; }
.ride-emisor { flex: 1; display: flex; gap: 4mm; align-items: flex-start; }
.ride-logo { width: 24mm; max-height: 24mm; object-fit: contain; }
.ride-razon { font-weight: bold; font-size: 15px; color: #1a3a6b; }
.ride-comercial { font-size: 12px; color: #b8352f; font-weight: bold; }
.ride-dato { font-size: 10px; color: #333; }
.ride-comprobante { width: 82mm; border: 1px solid #333; border-radius: 2mm; padding: 2mm 3mm; }
.ride-ruc { font-weight: bold; font-size: 12px; }
.ride-titulo { font-weight: bold; font-size: 16px; letter-spacing: 1px; margin: 1mm 0; }
.ride-numero { font-size: 13px; font-weight: bold; color: #b8352f; margin-bottom: 1mm; }
.ride-clave { font-family: monospace; font-size: 8.5px; word-break: break-all; margin-bottom: 1mm; }
.ride-cliente { border: 1px solid #333; border-radius: 2mm; padding: 2mm 3mm; margin: 3mm 0; font-size: 11px; }
.ride-cliente span { color: #555; font-size: 10px; }
.ride-tabla { width: 100%; border-collapse: collapse; font-size: 10.5px; }
.ride-tabla th { background: #eef2f7; border: 1px solid #99a; padding: 1mm 2mm; text-align: left; font-size: 9.5px; }
.ride-tabla td { border: 1px solid #c3ccd8; padding: 1mm 2mm; }
.ride-tabla .num { text-align: right; }
.ride-pie { display: flex; gap: 6mm; margin-top: 4mm; align-items: flex-start; }
.ride-pagos { flex: 1; border: 1px solid #333; border-radius: 2mm; padding: 2mm 3mm; font-size: 11px; }
.ride-sub { font-weight: bold; font-size: 9.5px; color: #555; margin-bottom: 1mm; }
.ride-totales { width: 70mm; border-collapse: collapse; font-size: 11px; }
.ride-totales td { border: 1px solid #c3ccd8; padding: 1mm 2mm; }
.ride-totales .num { text-align: right; }
.ride-total td { font-weight: bold; background: #eef2f7; font-size: 12.5px; }
@media print { .ride-tabla th, .ride-total td { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }