.loading {
    display: none;
    background-position: 50% 50%;
    position: fixed;
    z-index: 100000;
    background-image: url('/dist/img/peploading.gif');
    background-color: #DDF4FF;
    opacity: 0.6;
    filter: alpha(opacity=60);
    background-repeat: no-repeat;
}

.tramaBack {
    background-image: url('../dist/img/trama.png');
    height: 100%;
    background-position: left;
    background-repeat: no-repeat;
    background-size : cover;
}

.tramaBackMenu {
    /*background-image: url('../dist/img/trama2.png');*/
    height: 250px;
    background-position: right;
    background-repeat: no-repeat;
    position: relative;
}

.saltoAr {
    margin-top: 8px;
}

.saltoAb {
    margin-bottom: 8px;
}


/* Kendo Grid Icons */
.k-grid-kedit {
    background-color: #007bff !important;
    background-image: url('../dist/img/edit.png') !important;
    background-repeat: no-repeat;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
}

.k-grid-kcertificate {
    background-image: url('../dist/img/save2.png') !important;
    background-repeat: no-repeat;
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
}

.k-grid-kadd {
    background-color: #3e8903 !important;
    background-image: url('../dist/img/add.png') !important;
    background-repeat: no-repeat;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    background-size: contain;
    background-position: center;
}

.k-grid-kdelete {
    background-color: #f80e06 !important;
    background-image: url('../dist/img/delete.png') !important;
    background-repeat: no-repeat;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
}

.k-grid-kcancel {
    background-color: #655b5a !important;
    background-image: url('../dist/img/cancel.png') !important;
    background-repeat: no-repeat;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
}

.k-grid td {
    padding-top: 0.2em !important;
    padding-right: 0.4em !important;
    padding-bottom: 0.2em !important;
    padding-left: 0.4em !important;
}
.k-grid-header th.k-header {
    font-weight: bold !important;

}

/* Kendo Grid: preferir comportamiento por defecto para mantener alineación header/body */

/* Styles for validation helpers*/
.field-validation-error, .validation-summary-errors {
    color: #ff0000;
}

    .validation-summary-errors ul {
        list-style: none;
    }

.field-validation-valid {
    display: none;
}

.input-validation-error {
    background-color: #ffeeee;
}

.editbtn, .delbtn, .editnst, .delnst {
    padding: .2em .3em;
}

/* grid btns */
.editbtn, .delbtn, .editnst, .delnst {
    padding: .2em .3em;
}

.ico-crud {
    background-image: url(editdel.png);
}

.ico-edit, .ico-del {
    display: block;
    overflow: hidden;
    height: 18px;
    width: 18px;
    background-repeat: no-repeat;
}

.ico-edit {
    background-position: 0 -1px;
}

.ico-del {
    background-position: -17px -1px;
}
/* grid btns */

/* form layout */
.efield {
    padding: 5px 0;
}

.elabel {
    text-align: right;
    width: 150px;
    display: inline-block;
    zoom: 1;
    *display: inline;
    vertical-align: top;
    margin-top: 1px;
    padding-right: 3px;
}

    .elabel label {
        font-weight: 600;
    }

@media (max-width: 480px) {
    .elabel {
        text-align: left;
        display: block;
    }
}

.einput {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: top;
}

    .einput .o-dd, .einput .awe-datepicker-field, .einput .awe-lookup-field, .einput, .einput .awe-multilookup-field, .einput .etxt {
        min-width: 15em;
    }

.awe-popup .einput .awe-multilookup-field .awe-display {
    max-height: 7.3em;
    overflow-y: auto;
}

/* misc */
.bar {
    padding: 5px 0;
}

.mbtn {
    padding: 0.4em 0.9em;
}


.avatar-image-container {
    overflow: hidden;
    width: 110px;
    height: 110px;
    max-height: 110px;
    border: 2px solid #00b1ad;
    border-radius: 110px;
}

.avatar-image-container img {
    width: 110px;
    height: 110px;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0,0,0,0.15) !important;
}

.black-left-border {
    border-left: solid black 2px !important
}
/* Contenedor principal */
.preHerenciaMail-container {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
}

/* Header */
.preHerenciaMail-header,
.preHerenciaMail-footer {
    background-color: #1D951B;
}

.preHerenciaMail-header {
    height: 4px;
}

.preHerenciaMail-footer {
    height: 2px;
}

/* Logo */
.preHerenciaMail-logo-container {
    text-align: center;
    margin: 20px 0;
}

.preHerenciaMail-logo {
    max-width: 150px;
}

/* Título */
.preHerenciaMail-title {
    color: #0056b3;
    font-size: 1.5em;
    margin-bottom: 10px;
}

/* Introducción */
.preHerenciaMail-intro {
    font-size: 1em;
    margin-bottom: 20px;
}

/* Cards */
.preHerenciaMail-card {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
}

.preHerenciaMail-card-header {
    background-color: #f1f1f1;
    padding: 10px;
    font-weight: bold;
}

.preHerenciaMail-card-body {
    padding: 10px;
}

/* Listas */
.preHerenciaMail-list {
    list-style-type: disc;
    margin: 0 0 20px 20px;
}

.preHerenciaMail-subList {
    list-style-type: circle;
    margin: 5px 0 10px 20px;
}

.btn-redondeado-2026 {
    padding: 0.375rem 1rem; /* Aproximado a px-3 py-2 */
    border-radius: 50rem; /* rounded-pill */
    font-size: 1rem; /* Tamaño mediano similar a btn-md */
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); /* Sombra ligera */
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.estado-badge {
    display: inline-block;
    min-width: 82px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    border-radius: 999px;
    padding: 4px 8px;
    text-transform: uppercase;
    line-height: 1.2;
}

.estado-badge--borrador {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffe69c;
}

.estado-badge--propuesto {
    background: #cfe2ff;
    color: #084298;
    border: 1px solid #9ec5fe;
}

.estado-badge--aprobado {
    background: #d1e7dd;
    color: #0f5132;
    border: 1px solid #a3cfbb;
}

.estado-badge--rechazado {
    background: #f8d7da;
    color: #842029;
    border: 1px solid #f1aeb5;
}

.estado-badge--archivado {
    background: #e9ecef;
    color: #495057;
    border: 1px solid #ced4da;
}

/* Shell oscuro del backoffice sobre AdminLTE.
   Kendo se ajustará en una segunda fase separada. */
body.dark-mode .main-header.navbar {
    background-color: #111827;
    border-bottom: 1px solid #1f2937;
}

body.dark-mode .main-header.navbar .nav-link,
body.dark-mode .main-header.navbar .navbar-nav .nav-link {
    color: #e5e7eb;
}

body.dark-mode .main-header.navbar .nav-link:hover,
body.dark-mode .main-header.navbar .navbar-nav .nav-link:hover {
    color: #ffffff;
}

body.dark-mode .main-sidebar {
    background: linear-gradient(180deg, #111827 0%, #0f172a 100%);
}

body.dark-mode .brand-link {
    border-bottom: 1px solid #1f2937;
}

body.dark-mode .content-wrapper {
    background-color: #0b1220;
    color: #e5e7eb;
}

body.dark-mode .content-wrapper .content-header,
body.dark-mode .content-wrapper .content {
    color: inherit;
}

body.dark-mode .card,
body.dark-mode .modal-content,
body.dark-mode .preHerenciaMail-container,
body.dark-mode .preHerenciaMail-card {
    background-color: #111827;
    color: #e5e7eb;
    border-color: #243041;
}

body.dark-mode .card-header,
body.dark-mode .card-footer,
body.dark-mode .modal-header,
body.dark-mode .preHerenciaMail-card-header {
    background-color: #172033;
    color: #f8fafc;
    border-color: #243041;
}

body.dark-mode .card-body,
body.dark-mode .modal-body,
body.dark-mode .modal-footer,
body.dark-mode .preHerenciaMail-card-body {
    background-color: transparent;
    color: inherit;
}

body.dark-mode .close {
    color: #f8fafc;
    text-shadow: none;
    opacity: 0.85;
}

body.dark-mode .close:hover {
    color: #ffffff;
    opacity: 1;
}

body.dark-mode .form-control,
body.dark-mode .custom-select,
body.dark-mode textarea.form-control,
body.dark-mode input.form-control,
body.dark-mode select.form-control {
    background-color: #0f172a;
    border-color: #334155;
    color: #e5e7eb;
}

body.dark-mode .form-control:focus,
body.dark-mode .custom-select:focus {
    background-color: #0f172a;
    border-color: #60a5fa;
    color: #ffffff;
    box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.18);
}

body.dark-mode .form-control::placeholder,
body.dark-mode textarea.form-control::placeholder,
body.dark-mode input.form-control::placeholder {
    color: #94a3b8;
}

body.dark-mode label,
body.dark-mode .control-label,
body.dark-mode .form-label,
body.dark-mode .modal-title,
body.dark-mode .card-title,
body.dark-mode .text-muted {
    color: #dbe4f0 !important;
}

body.dark-mode .btn-light,
body.dark-mode .btn.btn-light {
    background-color: #1e293b;
    border-color: #334155;
    color: #e5e7eb;
}

body.dark-mode .btn-light:hover,
body.dark-mode .btn.btn-light:hover {
    background-color: #334155;
    border-color: #475569;
    color: #ffffff;
}

body.dark-mode .table,
body.dark-mode .table td,
body.dark-mode .table th {
    color: #e5e7eb;
    border-color: #243041;
}

body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(148, 163, 184, 0.08) !important;
}

body.dark-mode .row[style*="aliceblue"] {
    background-color: #172033 !important;
    color: #e5e7eb;
    border: 1px solid #243041;
    border-radius: 0.5rem;
}

body.dark-mode .icheck-primary > label,
body.dark-mode .icheck-primary > input:first-child + label::before,
body.dark-mode .icheck-primary > input:first-child:checked + label::before {
    color: #e5e7eb;
}

/* Kendo oscuro sobre tema bootstrap claro.
   El alcance queda encapsulado en dark-mode para no romper la variante clara. */
body.dark-mode .k-grid,
body.dark-mode .k-widget.k-grid,
body.dark-mode .k-grid-content,
body.dark-mode .k-grid-header,
body.dark-mode .k-grid-header-wrap,
body.dark-mode .k-grid .k-grid-content-locked,
body.dark-mode .k-grid .k-grid-header-locked,
body.dark-mode .k-grouping-header,
body.dark-mode .k-grid-pager,
body.dark-mode .k-pager-wrap {
    background-color: #111827;
    color: #e5e7eb;
    border-color: #243041;
}

body.dark-mode .k-grid-header,
body.dark-mode .k-grid .k-grouping-header,
body.dark-mode .k-grid .k-header,
body.dark-mode .k-grid-header .k-header,
body.dark-mode .k-grid .k-filter-row,
body.dark-mode .k-grid .k-filter-row td,
body.dark-mode .k-grid .k-group-footer td,
body.dark-mode .k-grid .k-grid-footer,
body.dark-mode .k-grid .k-grid-footer td {
    background-color: #172033;
    color: #f8fafc;
    border-color: #243041;
}

body.dark-mode .k-grid-header .k-link,
body.dark-mode .k-grid-header .k-link:link,
body.dark-mode .k-grid-header .k-link:visited,
body.dark-mode .k-grouping-header .k-link,
body.dark-mode .k-grid .k-sort-order,
body.dark-mode .k-grid .k-i-sort-asc-sm,
body.dark-mode .k-grid .k-i-sort-desc-sm,
body.dark-mode .k-grid .k-icon {
    color: #dbe4f0;
}

body.dark-mode .k-grid table,
body.dark-mode .k-grid tbody,
body.dark-mode .k-grid tr,
body.dark-mode .k-grid td,
body.dark-mode .k-grid th {
    border-color: #243041;
}

body.dark-mode .k-grid td,
body.dark-mode .k-grid .k-table-td,
body.dark-mode .k-grid .k-master-row,
body.dark-mode .k-grid .k-master-row td,
body.dark-mode .k-grid .k-alt,
body.dark-mode .k-grid .k-alt td {
    background-color: #111827;
    color: #e5e7eb;
}

body.dark-mode .k-grid .k-alt,
body.dark-mode .k-grid .k-alt td {
    background-color: #0f172a;
}

body.dark-mode .k-grid tr:hover,
body.dark-mode .k-grid tr:hover td,
body.dark-mode .k-grid .k-master-row:hover,
body.dark-mode .k-grid .k-master-row:hover td {
    background-color: #1e293b;
    color: #ffffff;
}

body.dark-mode .k-grid tr.k-selected,
body.dark-mode .k-grid tr.k-selected td,
body.dark-mode .k-grid tr.k-state-selected,
body.dark-mode .k-grid tr.k-state-selected td,
body.dark-mode .k-grid td.k-selected,
body.dark-mode .k-grid td.k-state-selected,
body.dark-mode .k-list .k-item.k-selected,
body.dark-mode .k-list .k-item.k-state-selected {
    background-color: #2563eb;
    color: #eff6ff;
}

body.dark-mode .k-grid td.k-grid-content-sticky,
body.dark-mode .k-grid .k-grid-header-sticky,
body.dark-mode .k-grid .k-grid-footer-sticky {
    background-color: inherit;
    border-color: #243041;
}

body.dark-mode .k-input,
body.dark-mode .k-widget.k-input,
body.dark-mode .k-picker,
body.dark-mode .k-widget.k-picker,
body.dark-mode .k-textbox,
body.dark-mode .k-input-inner,
body.dark-mode .k-input-solid,
body.dark-mode .k-dropdownlist,
body.dark-mode .k-combobox,
body.dark-mode .k-datepicker,
body.dark-mode .k-timepicker,
body.dark-mode .k-datetimepicker,
body.dark-mode .k-numerictextbox,
body.dark-mode .k-multiselect {
    background-color: #0f172a;
    color: #e5e7eb;
    border-color: #334155;
}

body.dark-mode .k-input:hover,
body.dark-mode .k-widget.k-input:hover,
body.dark-mode .k-picker:hover,
body.dark-mode .k-widget.k-picker:hover,
body.dark-mode .k-textbox:hover,
body.dark-mode .k-dropdownlist:hover,
body.dark-mode .k-combobox:hover,
body.dark-mode .k-multiselect:hover {
    background-color: #111827;
    border-color: #475569;
    color: #ffffff;
}

body.dark-mode .k-input.k-focus,
body.dark-mode .k-input:focus,
body.dark-mode .k-input:focus-within,
body.dark-mode .k-picker.k-focus,
body.dark-mode .k-picker:focus,
body.dark-mode .k-picker:focus-within,
body.dark-mode .k-textbox:focus,
body.dark-mode .k-dropdownlist.k-focus,
body.dark-mode .k-combobox.k-focus,
body.dark-mode .k-multiselect.k-focus {
    background-color: #0f172a;
    border-color: #60a5fa;
    box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.18);
}

body.dark-mode .k-input-inner,
body.dark-mode .k-input-button,
body.dark-mode .k-select,
body.dark-mode .k-picker .k-icon,
body.dark-mode .k-input-inner::placeholder {
    color: #dbe4f0;
}

body.dark-mode .k-popup,
body.dark-mode .k-list-container,
body.dark-mode .k-animation-container .k-popup,
body.dark-mode .k-calendar-container,
body.dark-mode .k-filter-menu,
body.dark-mode .k-column-menu,
body.dark-mode .k-grid .k-filter-options,
body.dark-mode .k-window,
body.dark-mode .k-dialog {
    background-color: #111827;
    color: #e5e7eb;
    border-color: #243041;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
}

body.dark-mode .k-list,
body.dark-mode .k-list-ul,
body.dark-mode .k-list-content,
body.dark-mode .k-list-item,
body.dark-mode .k-item {
    background-color: #111827;
    color: #e5e7eb;
    border-color: #243041;
}

body.dark-mode .k-list .k-item:hover,
body.dark-mode .k-list .k-item.k-hover,
body.dark-mode .k-list .k-item.k-state-hover,
body.dark-mode .k-item:hover,
body.dark-mode .k-item.k-hover,
body.dark-mode .k-item.k-state-hover {
    background-color: #1e293b;
    color: #ffffff;
}

body.dark-mode .k-window-titlebar,
body.dark-mode .k-dialog-titlebar {
    background-color: #172033;
    color: #f8fafc;
    border-color: #243041;
}

body.dark-mode .k-window-content,
body.dark-mode .k-dialog-content {
    background-color: #111827;
    color: #e5e7eb;
}

body.dark-mode .k-pager-wrap,
body.dark-mode .k-grid-pager,
body.dark-mode .k-pager-nav,
body.dark-mode .k-pager-numbers .k-link,
body.dark-mode .k-pager-input,
body.dark-mode .k-pager-sizes {
    color: #dbe4f0;
    border-color: #243041;
}

body.dark-mode .k-pager-numbers .k-link,
body.dark-mode .k-pager-nav {
    background-color: #172033;
}

body.dark-mode .k-pager-numbers .k-link:hover,
body.dark-mode .k-pager-nav:hover {
    background-color: #1e293b;
    color: #ffffff;
}

body.dark-mode .k-pager-numbers .k-state-selected,
body.dark-mode .k-pager-numbers .k-selected,
body.dark-mode .k-pager-numbers .k-link.k-selected {
    background-color: #2563eb;
    color: #eff6ff;
    border-color: #2563eb;
}

body.dark-mode .k-grid .k-grid-norecords,
body.dark-mode .k-grid-norecords-template {
    background-color: #111827;
    color: #94a3b8;
    border-color: #243041;
}

body.dark-mode .main-footer {
    background-color: #111827;
    border-top: 1px solid #1f2937;
    color: #cbd5e1;
}

body.dark-mode .main-footer a {
    color: #93c5fd;
}