/* Estándar HistoMedic: proporciones de la referencia visual, colores del tema.
   Cargar después de los estilos del módulo. No sustituir fuentes de iconos. */
:root {
    --hm-font-family: Arial, Helvetica, sans-serif;
    --hm-font-size: 14px;
    --hm-field-font-size: 13px;
    --hm-field-radius: 2px;
    --hm-label-color: rgb(15, 10, 74);
    --bs-font-sans-serif: var(--hm-font-family);
    --bs-body-font-family: var(--hm-font-family);
    --hm-theme-surface: #ffffff;
    --hm-theme-text: #172b47;
    --hm-theme-border: #ced9e7;
}

/* La misma clase del tema instalado gobierna formularios, modales y controles nativos. */
html { color-scheme: light; }
html.dark {
    color-scheme: dark;
    --hm-label-color: #e7eef8;
    --hm-theme-surface: #202b3a;
    --hm-theme-text: #edf3fb;
    --hm-theme-border: #66758b;
    --bs-body-bg: #202b3a;
    --bs-body-color: #edf3fb;
    --hm-theme-page-background: #1c222b;
}

/* Fondo común de formularios: en oscuro sustituir la imagen clara por el tono del Censo.
   No aplicar filtros al contenedor: tarjetas, logos y controles conservan sus colores.
   La prioridad del color iguala el !important del fondo legacy de custom.css.
   Al retirar html.dark se recuperan íntegros los fondos originales del modo claro. */
html.dark :is(.fondo-general, .fondo-inicio, body.login-modulo, body.logout-modulo) {
    background-image: none;
    background-color: var(--hm-theme-page-background) !important;
}

/* Acción de la barra superior: etiqueta completa en escritorio e icono accesible en móvil. */
.header .hm-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    gap: 8px;
    min-height: 38px;
    padding: 7px 10px;
    margin-right: 10px;
    border: 1px solid var(--hm-theme-border);
    border-radius: 6px;
    background: var(--hm-theme-surface);
    color: var(--hm-theme-text);
    font-size: 13px;
}
.header .hm-theme-toggle:focus-visible { outline: 2px solid #3097f6; outline-offset: 3px; }
.header .userbox .role { color: #52647b; }
html.dark .header .userbox .role { color: #bdcada; }
/* Navegación común: solo colores; mantener expansión, enlaces, permisos y logos existentes. */
html.dark .sidebar-left { background-color: #1c222b; color: #edf3fb; }
html.dark .sidebar-left :is(.sidebar-title, .text-secondary) { color: #bdcada !important; }
html.dark .sidebar-left ul.nav-main li > a { color: #dce7f5; }
html.dark .sidebar-left ul.nav-main .nav-children { background-color: #181f29; }
html.dark .sidebar-left ul.nav-main li.nav-active > a,
html.dark .sidebar-left ul.nav-main > li.nav-expanded > a { color: #9aceff; background-color: #293e55; }
html.dark .sidebar-left ul.nav-main li > a:hover,
html.dark .sidebar-left ul.nav-main li > a:focus-visible { color: #fff; background-color: #32465c; }
html.dark .sidebar-left ul.nav-main li > a:focus-visible { outline: 2px solid #9aceff; outline-offset: -2px; }
html.dark .sidebar-left .sidebar-toggle,
html.dark .header .toggle-sidebar-left { color: #edf3fb; background-color: #263242; }
html.dark .header { background-color: #1c222b; color: #edf3fb; }
html.dark .header .userbox > a, html.dark .header .userbox .name { color: #edf3fb; }
html.dark .header .userbox .custom-caret { color: #bdcada; }
html.dark .header .userbox.show { background-color: #202b3a; }
html.dark .header .userbox .dropdown-menu { background-color: #202b3a; border-color: #66758b; }
html.dark .header .userbox .dropdown-menu a { color: #edf3fb; }
html.dark .header .userbox .dropdown-menu a:hover,
html.dark .header .userbox .dropdown-menu a:focus-visible { color: #fff; background-color: #32465c; }
html.dark .page-header h2 { color: #edf3fb; }
html.dark .page-header .breadcrumbs :is(a, span, i) { color: #c6d1e0; }
/* Accesos de Inicio: títulos y descripciones legibles también al pasar el puntero. */
html.dark .fondo-inicio .btn-inicio { background-color: #202b3a; color: #edf3fb; border-color: #66758b !important; }
html.dark .fondo-inicio .btn-inicio :is(h6, p) { color: inherit; }
html.dark .fondo-inicio .btn-inicio .text-secondary { color: #c6d1e0 !important; }
html.dark .fondo-inicio .btn-inicio .text-primary { color: #9aceff !important; }
html.dark .fondo-inicio .btn-inicio:hover,
html.dark .fondo-inicio a.card-inicio:focus-visible .btn-inicio { background-color: #293e55; border-color: #9aceff !important; }
html.dark .fondo-inicio a.card-inicio:focus-visible { outline: 2px solid #9aceff; outline-offset: 3px; }
@media (max-width: 575px) {
    .header .hm-theme-toggle { width: 44px; min-height: 44px; padding: 8px; margin-right: 4px; }
    .header .hm-theme-toggle [data-hm-theme-label] { display: none; }
}

/* Cambiar solo colores: conservar dimensiones, validación, readonly, disabled y widgets instalados. */
html.dark .hm-form { color: var(--hm-theme-text); }
html.dark .hm-form :is(.text-muted, .text-secondary, .text-tertiary, .text-dark, .text-color-dark) { color: #c6d1e0 !important; }
html.dark .hm-form .text-primary { color: #9aceff !important; }
html.dark .hm-form :is(.form-control, .form-select),
html.dark .select2-dropdown,
html.dark .select2-container .select2-selection,
html.dark .select2-search__field {
    background-color: #263242;
    color: #edf3fb;
}
html.dark .hm-form .form-select { border-color: var(--hm-theme-border); }
html.dark .hm-form :is(input, textarea)::placeholder { color: #bdcada !important; opacity: 1; }
html.dark .hm-form :is(.form-control, .form-select):is(:disabled, [readonly]) { background-color: #1c2532; color: #c6d1e0; }
html.dark .hm-form .input-group-text { background: #344256; color: #edf3fb; border-color: var(--hm-theme-border); }
html.dark .hm-form .invalid-feedback { color: #ffb4ae; }
html.dark .hm-form .valid-feedback { color: #a6dfbb; }
/* Contraste de ayudas y texto corriente: el tema legacy fija grises para p/form-text. */
html.dark .hm-form p { color: inherit; }
html.dark .hm-form :is(.form-text, .help-block) { color: #c6d1e0; }
html.dark .hm-form a:not(.btn), html.dark .hm-form .btn-link { color: #9aceff; }
html.dark :is(.content-body, .hm-form, .modal-content) .text-success { color: #a6dfbb !important; }
html.dark :is(.content-body, .hm-form, .modal-content) .text-danger { color: #ffb4ae !important; }
html.dark :is(.content-body, .hm-form, .modal-content) .text-warning { color: #f7d18a !important; }
html.dark :is(.content-body, .hm-form, .modal-content) .text-info { color: #9fe0ef !important; }
/* Avisos sobre superficies oscuras: conservar la distinción de éxito, error y advertencia. */
html.dark :is(.content-body, .hm-form, .modal-content) .alert-success { color: #b4e3c5; background-color: #203e32; border-color: #42705a; }
html.dark :is(.content-body, .hm-form, .modal-content) .alert-danger { color: #ffd0cb; background-color: #49302f; border-color: #8a5753; }
html.dark :is(.content-body, .hm-form, .modal-content) .alert-warning { color: #ffe0a3; background-color: #493c24; border-color: #897246; }
html.dark :is(.content-body, .hm-form, .modal-content) :is(.alert-info, .alert-primary) { color: #c0e4ff; background-color: #253d50; border-color: #527691; }
html.dark :is(.login-toggle, .password-toggle) { color: #c6d1e0 !important; }
/* La matriz de permisos conserva sus filas, casillas y franjas; solo cambia la paleta. */
html.dark .hm-form .table { --bs-table-color: #edf3fb; --bs-table-bg: #263242; --bs-table-striped-bg: #2d3b4c; --bs-table-striped-color: #edf3fb; --bs-table-hover-color: #edf3fb; --bs-table-hover-bg: #344256; }
html.dark .hm-form .table :is(th, td) { color: #edf3fb; }

/* Acciones: mismo significado cromático con fondos que admiten texto legible (>=4.5:1).
   Cambiar solo colores; conservar tamaño, disabled, eventos y efectos del tema instalado. */
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-primary, .btn-outline-primary) { --hm-btn-bg: #1768b4; --hm-btn-fg: #fff; --hm-btn-outline: #9aceff; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-secondary, .btn-outline-secondary, .btn-default) { --hm-btn-bg: #46566d; --hm-btn-fg: #fff; --hm-btn-outline: #c6d1e0; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-success, .btn-outline-success) { --hm-btn-bg: #236b46; --hm-btn-fg: #fff; --hm-btn-outline: #a6dfbb; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-danger, .btn-outline-danger) { --hm-btn-bg: #ad3441; --hm-btn-fg: #fff; --hm-btn-outline: #ffb4ae; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-warning, .btn-outline-warning) { --hm-btn-bg: #e8b14b; --hm-btn-fg: #172b47; --hm-btn-outline: #f7d18a; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-info, .btn-outline-info) { --hm-btn-bg: #24768d; --hm-btn-fg: #fff; --hm-btn-outline: #9fe0ef; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-light, .btn-outline-light) { --hm-btn-bg: #d7e2ee; --hm-btn-fg: #172b47; --hm-btn-outline: #e7eef8; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) :is(.btn-dark, .btn-outline-dark) { --hm-btn-bg: #111a27; --hm-btn-fg: #edf3fb; --hm-btn-outline: #c6d1e0; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info,.btn-light,.btn-dark,.btn-default) {
    background-color: var(--hm-btn-bg) !important; border-color: var(--hm-btn-bg) !important; color: var(--hm-btn-fg) !important;
}
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) .btn[class*="btn-outline-"] {
    background-color: transparent !important; border-color: var(--hm-btn-outline) !important; color: var(--hm-btn-outline) !important;
}
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) .btn[class*="btn-outline-"]:is(:hover,:focus-visible,:active,.active,[aria-pressed="true"]) {
    background-color: var(--hm-btn-bg) !important; border-color: var(--hm-btn-bg) !important; color: var(--hm-btn-fg) !important;
}
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) .btn :is(span,strong) { color: inherit !important; }
html.dark :is(.content-body, .hm-form, .modal-content, .login-modulo, .logout-modulo, .hm-module-header) .btn[class*="hvr-shutter"]::before { background-color: var(--hm-btn-bg) !important; }
html.dark .select2-container .select2-selection__rendered,
html.dark .select2-results__option { color: #edf3fb; }
html.dark .select2-container .select2-selection__choice { background: #394960; color: #edf3fb; }
html.dark .select2-container .select2-selection__choice__remove { color: #edf3fb; }
html.dark .select2-results__option[aria-selected="true"] { background: #394960; }
html.dark .select2-results__option--highlighted[aria-selected] { background: #1768b4; color: #ffffff; }
html.dark .select2-container--disabled .select2-selection { background: #1c2532; color: #c6d1e0; }
html.dark .modal-content { background: var(--hm-theme-surface); color: var(--hm-theme-text); border-color: var(--hm-theme-border); }
html.dark :is(.modal-header, .modal-footer) { border-color: var(--hm-theme-border); }
html.dark .modal-title { color: var(--hm-theme-text); }
html.dark .modal-content :is(.text-dark, .text-color-dark, .text-muted, .text-secondary, .text-tertiary) { color: #c6d1e0 !important; }
html.dark .modal-content :is(a:not(.btn), .btn-link, .text-primary) { color: #9aceff; }
/* Avisos comunes con cabecera inline: conservar el estado cromático con títulos blancos legibles. */
html.dark #modalSuccess .modal-header { background-color: #236b46 !important; }
html.dark #modalDanger .modal-header { background-color: #ad3441 !important; }
html.dark :is(#modalWarning, #modalWarningOnly) .modal-header { background-color: #77521f !important; }
html.dark #modalInfo .modal-header { background-color: #24768d !important; }
html.dark :is(.datepicker-dropdown, .ui-autocomplete) { background: var(--hm-theme-surface); color: var(--hm-theme-text); border-color: var(--hm-theme-border); }
html.dark .hm-form .note-editor :is(.note-editable, .note-toolbar, .note-statusbar) { background: #263242; color: #edf3fb; }
html.dark .hm-form .note-editor .note-btn { background: #344256; color: #edf3fb; border-color: #66758b; }
html.dark .hm-form .note-editor .note-dropdown-menu { background: #263242; color: #edf3fb; }
html.dark .hm-form .note-editor .note-dropdown-menu a { color: #edf3fb; }
html.dark .login-modulo :is(.text-secondary, .text-tertiary),
html.dark .logout-modulo .text-muted { color: #c6d1e0 !important; }
html.dark .login-modulo .login-field-error { color: #ffb4ae; }
html.dark .modal-content .close { color: #edf3fb; }
html.dark .modal-content .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
/* El archivo nativo también debe caber cuando el plugin de adjuntos aún no se ha inicializado. */
.hm-form input[type="file"] { max-width: 100%; min-width: 0; }
.select2-container .select2-selection__placeholder { color: #52647b; }
html.dark .select2-container .select2-selection__placeholder { color: #bdcada; }

body {
    font-family: var(--hm-font-family) !important;
    font-size: var(--hm-font-size);
    font-weight: 400;
    line-height: 1.5;
}

/* Selectores de texto, sin selector universal: Font Awesome, Boxicons,
   Dropify y los pseudoelementos del tema conservan sus propias fuentes. */
body :where(h1, h2, h3, h4, h5, h6, p, a, label, input, textarea, select,
    button, table, th, td, .tooltip, .popover, .dropdown-menu,
    .select2-container, .select2-dropdown, .dropify-message p) {
    font-family: var(--hm-font-family) !important;
}

/* Color solicitado para todas las etiquetas; prevalece sobre utilidades del tema. */
body label,
body label.control-label,
body label.form-label,
body .hm-form label {
    color: var(--hm-label-color) !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 1px rgba(15, 10, 74, 0.16);
}

.control-label,
.form-label,
.form-group > label:not(.form-check-label) {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 8px;
}

/* Altura original del tema; interlineado y padding simétrico centran el texto
   de controles de una línea sin imponer una altura nueva. */
input.form-control:not(.form-control-sm):not(.form-control-lg):not([type="file"]):not([type="checkbox"]):not([type="radio"]),
select.form-control:not(.form-control-sm):not(.form-control-lg),
.form-select:not(.form-select-sm):not(.form-select-lg) {
    font-size: var(--hm-field-font-size);
    font-weight: 400;
    line-height: 1.5;
    padding-block: 0.375rem;
    padding-inline: 10px;
    border-width: 1px;
    border-radius: var(--hm-field-radius);
}

textarea.form-control:not(.form-control-sm):not(.form-control-lg) {
    font-size: var(--hm-field-font-size);
    font-weight: 400;
    padding-inline: 10px;
    border-width: 1px;
    border-radius: var(--hm-field-radius);
    resize: vertical;
}

/* Select2 conserva su altura múltiple y sus flechas; solo se unifica el texto. */
.select2-container .select2-selection,
.select2-container .select2-results,
.select2-container .select2-search__field {
    font-family: var(--hm-font-family) !important;
    font-size: var(--hm-field-font-size);
    font-weight: 400;
}

/* Centrado de selección simple, sin afectar la altura ni selección múltiple. */
.select2-container .select2-selection--single {
    display: flex;
    align-items: center;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    flex: 1;
    min-width: 0;
    line-height: 1.5;
}

/* La acción Mostrar/Ocultar se ancla solo al campo, no a etiquetas o ayuda. */
.hm-password-field {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

.hm-password-field > input.form-control {
    grid-area: 1 / 1;
    min-width: 0;
    padding-right: 5.5rem !important;
    background-position: right 5rem center;
}

.hm-password-field > :is(.show-hide, .show-hide-confirm, .show-hide-smtp) {
    position: relative;
    grid-area: 1 / 1;
    justify-self: end;
    align-self: center;
    top: auto;
    right: 10px;
    transform: none;
    display: flex;
    align-items: center;
    margin: 0;
    line-height: 1;
}

.hm-password-field > .invalid-feedback {
    grid-column: 1;
}

.hm-password-field > :is(.show-hide, .show-hide-confirm, .show-hide-smtp) span {
    font-size: 12px;
    line-height: 1;
    padding: 4px;
    white-space: nowrap;
}

/* Formularios homologados con Usuarios: conservar columnas y tamaños del módulo.
   El tema añade padding entre grupos; retirarlo de filas alinea sus etiquetas. */
.hm-form .form-group {
    margin-bottom: 20px;
}

.hm-form .row > .form-group,
.hm-form .form-row > .form-group {
    padding-top: 0;
}

/* Compatibilidad de modales legacy con la grilla Bootstrap 5 ya instalada. */
.hm-form .form-row {
    display: flex;
    flex-wrap: wrap;
    margin-inline: -0.75rem;
}

.hm-form .form-row > .form-group {
    padding-inline: 0.75rem;
}

/* Visibilidad de contraseñas mediante botones nativos (Login/cambio propio).
   Mantener el comportamiento accesible y las alturas específicas de cada vista. */
.hm-form .password-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--hm-font-family);
    font-size: var(--hm-field-font-size);
}

.hm-form :is(button, a, [role="button"]):focus-visible {
    outline: 2px solid var(--color-primary, #0088cc);
    outline-offset: 2px;
}

.hm-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 22px;
}

.hm-form-grid > * {
    min-width: 0;
}

/* El tema añade padding entre grupos consecutivos; la grilla usa solo gap
   para que las etiquetas de una misma fila queden alineadas. */
.hm-form .hm-form-grid > .form-group {
    margin: 0;
    padding-top: 0;
}

.hm-form-full {
    grid-column: 1 / -1;
}

.hm-form-panel {
    padding: 32px 36px;
    border-radius: 16px;
}

@media (max-width: 767px) {
    .hm-form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .hm-form-panel {
        padding: 20px;
    }
}