body.ui-theme-custom {
    color: var(--sgdok-text);
}

.ui-theme-custom .main-header,
.ui-theme-custom .main-sidebar .brand-link {
    background: linear-gradient(110deg, var(--sgdok-primary), color-mix(in srgb, var(--sgdok-primary), black 22%)) !important;
    color: #fff !important;
}

.ui-theme-custom .main-header .nav-link,
.ui-theme-custom .main-header .nav-link i,
.ui-theme-custom .main-header .nav-link label {
    color: #fff !important;
}

.ui-theme-custom .main-header .navbar-brand .brand-text,
.ui-theme-custom .main-header .navbar-brand .nav-icon {
    color: #fff !important;
}

.ui-theme-custom .main-sidebar {
    background: #fff;
}

.ui-theme-custom .sidebar .user-panel #lb_nombreusuario,
.ui-theme-custom .main-sidebar .nav-sidebar .nav-link,
.ui-theme-custom .main-sidebar .nav-icon {
    color: var(--sgdok-primary) !important;
}

.ui-theme-custom .nav-sidebar > .nav-item > .nav-link.active {
    background: var(--sgdok-primary);
    color: #fff !important;
}

.ui-theme-custom .nav-sidebar > .nav-item > .nav-link.active .nav-icon,
.ui-theme-custom .nav-sidebar > .nav-item > .nav-link.active .right {
    color: #fff !important;
}

.ui-theme-custom .nav-treeview > .nav-item > .nav-link.active,
.ui-theme-custom .nav-sidebar .nav-link:hover:not(.active) {
    background: var(--sgdok-primary-light);
    color: var(--sgdok-primary) !important;
}

.ui-theme-custom .content-wrapper {
    background: var(--sgdok-surface);
}

.ui-theme-custom .content-header h1,
.ui-theme-custom .breadcrumb a,
.ui-theme-custom .card-title,
.ui-theme-custom .text-teal-sm,
.ui-theme-custom .text-teal-custom {
    color: var(--sgdok-primary) !important;
}

.ui-theme-custom .content-header h1::after {
    content: '';
    display: block;
    width: min(100%, 220px);
    height: 4px;
    margin-top: 8px;
    background: linear-gradient(90deg, var(--sgdok-primary) 0 25%, var(--sgdok-red) 25% 50%, var(--sgdok-turquoise) 50% 75%, var(--sgdok-yellow) 75%);
}

.ui-theme-custom .card,
.ui-theme-custom .info-box {
    border-radius: 6px;
    box-shadow: 0 1px 6px rgba(46, 58, 74, .1);
}

.ui-theme-custom .card > .card-header {
    background: var(--sgdok-primary-light);
    color: var(--sgdok-primary) !important;
}

.ui-theme-custom .card > .card-header[style*='background-color: teal'] {
    background: var(--sgdok-primary) !important;
    color: #fff !important;
}

.ui-theme-custom .card > .card-header[style*='background-color: teal'] .card-title,
.ui-theme-custom .card > .card-header[style*='background-color: teal'] .btn-tool {
    color: #fff !important;
}

.ui-theme-custom .card-primary:not(.card-outline) > .card-header,
.ui-theme-custom .bg-primary,
.ui-theme-custom .bg-gradient-primary,
.ui-theme-custom .badge-primary {
    background: var(--sgdok-primary) !important;
    border-color: var(--sgdok-primary) !important;
    color: #fff !important;
}

.ui-theme-custom .bg-info,
.ui-theme-custom .badge-info,
.ui-theme-custom .bg-success,
.ui-theme-custom .badge-success,
.ui-theme-custom .bg-teal {
    background: var(--sgdok-turquoise) !important;
    border-color: var(--sgdok-turquoise) !important;
    color: #fff !important;
}

.ui-theme-custom .bg-danger,
.ui-theme-custom .badge-danger {
    background: var(--sgdok-red) !important;
    border-color: var(--sgdok-red) !important;
    color: #fff !important;
}

.ui-theme-custom .text-success,
.ui-theme-custom .text-info {
    color: var(--sgdok-turquoise) !important;
}

.ui-theme-custom :is([id^="list-visadores"], [id^="list-firmantes"], [id^="list-destinatario"], [id^="list-funcionarios-visacion-"], [id^="list-funcionarios-firmante-"], [id^="list-funcionarios-destinatario-"]) .list-group-item:not(.active) > .input-group > p.text-success {
    color: var(--sgdok-text) !important;
}

.ui-theme-custom .bg-warning,
.ui-theme-custom .badge-warning {
    background: var(--sgdok-yellow) !important;
    border-color: var(--sgdok-yellow) !important;
    color: var(--sgdok-text) !important;
}

.ui-theme-custom :is(.btn-primary, .btn-outline-primary) {
    --sgdok-btn-color: var(--sgdok-button-primary);
}

.ui-theme-custom :is(.btn-secondary, .btn-outline-secondary) {
    --sgdok-btn-color: var(--sgdok-button-secondary);
}

.ui-theme-custom :is(.btn-success, .btn-outline-success) {
    --sgdok-btn-color: var(--sgdok-button-success);
}

.ui-theme-custom :is(.btn-info, .btn-outline-info) {
    --sgdok-btn-color: var(--sgdok-button-info);
}

.ui-theme-custom :is(.btn-warning, .btn-outline-warning) {
    --sgdok-btn-color: var(--sgdok-button-warning);
    --sgdok-btn-foreground: var(--sgdok-text);
}

.ui-theme-custom :is(.btn-danger, .btn-outline-danger) {
    --sgdok-btn-color: var(--sgdok-button-danger);
}

.ui-theme-custom :is(.btn-light, .btn-outline-light) {
    --sgdok-btn-color: var(--sgdok-button-light);
    --sgdok-btn-foreground: var(--sgdok-text);
}

.ui-theme-custom :is(.btn-dark, .btn-outline-dark) {
    --sgdok-btn-color: var(--sgdok-button-dark);
}

.ui-theme-custom .btn:is(.btn-primary, .btn-secondary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-light, .btn-dark) {
    background: var(--sgdok-btn-color) !important;
    border-color: var(--sgdok-btn-color) !important;
    color: var(--sgdok-btn-foreground, #fff) !important;
}

.ui-theme-custom .btn:is(.btn-primary, .btn-secondary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-light, .btn-dark):is(:hover, :focus, :active, .active) {
    background: color-mix(in srgb, var(--sgdok-btn-color), black 14%) !important;
    border-color: color-mix(in srgb, var(--sgdok-btn-color), black 14%) !important;
}

.ui-theme-custom .btn:is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-info, .btn-outline-warning, .btn-outline-danger, .btn-outline-light, .btn-outline-dark) {
    background: transparent !important;
    border-color: var(--sgdok-btn-color) !important;
    color: var(--sgdok-btn-color) !important;
}

.ui-theme-custom .btn:is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-info, .btn-outline-warning, .btn-outline-danger, .btn-outline-light, .btn-outline-dark):is(:hover, :focus, :active, .active) {
    background: var(--sgdok-btn-color) !important;
    color: var(--sgdok-btn-foreground, #fff) !important;
}

.ui-theme-custom .btn:is(.btn-primary, .btn-secondary, .btn-success, .btn-info, .btn-warning, .btn-danger, .btn-light, .btn-dark, .btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-info, .btn-outline-warning, .btn-outline-danger, .btn-outline-light, .btn-outline-dark):focus {
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--sgdok-btn-color), transparent 75%) !important;
}

.ui-theme-custom .btn-link {
    color: var(--sgdok-button-primary) !important;
}

.ui-theme-custom .btn:is(.bg-exp-anidados, .bg-exp-relacionado, .bg-btn-imprimir-pdf, .bg-btn-ver-datosdocumentos) {
    --sgdok-btn-color: var(--sgdok-button-success);
    background: linear-gradient(180deg, color-mix(in srgb, var(--sgdok-btn-color), white 16%), var(--sgdok-btn-color)) !important;
}

.ui-theme-custom .btn:is(.bg-crea-expediente-dinamico, .bg-btn-editar-plantilla, .bg-btn-aceptar-rechazar) {
    --sgdok-btn-color: var(--sgdok-button-primary);
    background: var(--sgdok-btn-color) !important;
}

.ui-theme-custom .btn:is(.bg-exp-anidados, .bg-exp-relacionado, .bg-btn-imprimir-pdf, .bg-btn-ver-datosdocumentos, .bg-crea-expediente-dinamico, .bg-btn-editar-plantilla, .bg-btn-aceptar-rechazar) {
    border-color: var(--sgdok-btn-color) !important;
    color: #fff !important;
}

.ui-theme-custom .btn:is(.bg-exp-anidados, .bg-exp-relacionado, .bg-btn-imprimir-pdf, .bg-btn-ver-datosdocumentos):is(:hover, :focus, :active) {
    background: linear-gradient(180deg, color-mix(in srgb, var(--sgdok-btn-color), black 5%), color-mix(in srgb, var(--sgdok-btn-color), black 15%)) !important;
}

.ui-theme-custom .btn:is(.bg-crea-expediente-dinamico, .bg-btn-editar-plantilla, .bg-btn-aceptar-rechazar):is(:hover, :focus, :active) {
    background: color-mix(in srgb, var(--sgdok-btn-color), black 14%) !important;
}

.ui-theme-custom .theme-action-primary {
    --sgdok-btn-color: var(--sgdok-button-primary);
}

.ui-theme-custom .theme-action-danger {
    --sgdok-btn-color: var(--sgdok-button-danger);
}

.ui-theme-custom .btn:is(.theme-action-primary, .theme-action-danger) {
    background: var(--sgdok-btn-color) !important;
    border-color: var(--sgdok-btn-color) !important;
    color: #fff !important;
}

.ui-theme-custom .btn:is(.theme-action-primary, .theme-action-danger):is(:hover, :focus, :active) {
    background: color-mix(in srgb, var(--sgdok-btn-color), black 14%) !important;
}

.ui-theme-custom .btn.theme-action-outline-primary {
    background: transparent !important;
    border-color: var(--sgdok-button-primary) !important;
    color: var(--sgdok-button-primary) !important;
}

.ui-theme-custom .btn.theme-action-outline-primary:is(:hover, :focus, :active) {
    background: var(--sgdok-button-primary) !important;
    color: #fff !important;
}

.firma-pdf-page-nav {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
    width: 100%;
    height: 32px;
    border: 1px solid var(--sgdok-button-secondary, #6c757d);
    border-radius: 4px;
    background: #fff;
    color: #495057;
}

.firma-pdf-page-nav > .btn {
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
}

.firma-pdf-page-nav > .btn:first-child {
    border-radius: 3px 0 0 3px;
}

.firma-pdf-page-nav > .btn:last-child {
    border-radius: 0 3px 3px 0;
}

.firma-pdf-page-nav__position {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 0;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.firma-pdf-page-nav__input {
    box-sizing: border-box;
    width: 4.25em;
    min-width: 0;
    height: 24px;
    padding: 1px 4px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    background: #f8f9fa;
    color: inherit;
    font: inherit;
    font-weight: 600;
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}

.firma-pdf-page-nav__input::-webkit-inner-spin-button,
.firma-pdf-page-nav__input::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.firma-pdf-page-nav__input:focus {
    outline: 0;
    border-color: var(--sgdok-primary, #007bff);
    background: #fff;
    box-shadow: 0 0 0 2px var(--sgdok-primary-light, #e7f1ff);
}

.firma-pdf-page-nav__input:disabled {
    color: #6c757d;
    background: #e9ecef;
}

.ui-theme-custom :is(#modal_posicionar_firmas_pdf, #modal_editar_rubricas_detalle) .modal-header {
    background: var(--sgdok-primary-light);
    color: var(--sgdok-primary);
}

.ui-theme-custom :is(#modal_posicionar_firmas_pdf, #modal_editar_rubricas_detalle) .modal-title,
.ui-theme-custom :is(#modal_posicionar_firmas_pdf, #modal_editar_rubricas_detalle) .modal-header .close {
    color: var(--sgdok-primary);
}

.ui-theme-custom :is(#modal_posicionar_firmas_pdf, #modal_editar_rubricas_detalle) .alert-info {
    background: var(--sgdok-primary-light);
    border-color: var(--sgdok-primary-light);
    color: var(--sgdok-primary);
}

.ui-theme-custom .swal2-popup .swal2-styled.swal2-confirm {
    --sgdok-swal-button-color: var(--sgdok-button-primary);
}

.ui-theme-custom .swal2-popup .swal2-styled:is(.swal2-cancel, .swal2-deny),
.ui-theme-custom .swal2-popup.theme-swal-danger-confirm .swal2-styled.swal2-confirm {
    --sgdok-swal-button-color: var(--sgdok-button-danger);
}

.ui-theme-custom .swal2-popup.theme-swal-danger-confirm .swal2-styled.swal2-cancel {
    --sgdok-swal-button-color: var(--sgdok-button-secondary);
}

.ui-theme-custom .swal2-popup.theme-swal-success-confirm .swal2-styled.swal2-confirm {
    --sgdok-swal-button-color: var(--sgdok-button-success);
}

.ui-theme-custom .swal2-popup .swal2-styled:is(.swal2-confirm, .swal2-cancel, .swal2-deny) {
    background: var(--sgdok-swal-button-color) !important;
    color: #fff !important;
}

.ui-theme-custom .swal2-popup .swal2-styled:is(.swal2-confirm, .swal2-cancel, .swal2-deny):is(:hover, :focus) {
    background: color-mix(in srgb, var(--sgdok-swal-button-color), black 14%) !important;
}

.ui-theme-custom .swal2-popup .swal2-styled:is(.swal2-confirm, .swal2-cancel, .swal2-deny):focus {
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--sgdok-swal-button-color), transparent 75%) !important;
}

.ui-theme-custom .form-control:focus,
.ui-theme-custom .custom-select:focus {
    border-color: var(--sgdok-primary);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--sgdok-primary), transparent 82%);
}

.ui-theme-custom .page-item.active .page-link,
.ui-theme-custom .progress-bar,
.ui-theme-custom .custom-control-input:checked ~ .custom-control-label::before {
    background: var(--sgdok-primary);
    border-color: var(--sgdok-primary);
}

.ui-theme-custom .page-link,
.ui-theme-custom table.dataTable thead th {
    color: var(--sgdok-primary);
}

.ui-theme-custom table.table > tbody > tr > :is(td, th) {
    color: var(--sgdok-table-text);
}

.ui-theme-custom #div_noticias .card-header label,
.ui-theme-custom #lb_area {
    color: var(--sgdok-red) !important;
}

.ui-theme-custom .info-box .info-box-icon,
.ui-theme-custom .info-box h1 {
    color: var(--sgdok-primary);
}

.ui-theme-custom .info-box.selectExp .info-box-text {
    color: var(--sgdok-primary) !important;
}

.ui-theme-custom .info-box:has([id*='aceptad']) .info-box-icon,
.ui-theme-custom .info-box:has([id*='aceptad']) h1,
.ui-theme-custom .info-box:has([id*='aceptad']) .progress-bar {
    color: var(--sgdok-turquoise);
}

.ui-theme-custom .info-box:has([id*='rechazad']) .info-box-icon,
.ui-theme-custom .info-box:has([id*='rechazad']) h1,
.ui-theme-custom .info-box:has([id*='rechazad']) .progress-bar {
    color: var(--sgdok-red);
}

.ui-theme-custom.login-page {
    background: var(--sgdok-surface);
}

.ui-theme-custom.login-page .login-box-msg,
.ui-theme-custom.login-page .login-card-body a {
    color: var(--sgdok-primary);
}

.theme-color-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.theme-color-field {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.theme-color-field input[type='color'] {
    width: 44px;
    height: 34px;
    padding: 2px;
    flex: 0 0 auto;
    cursor: pointer;
}

.theme-color-field span {
    min-width: 0;
}

@media (max-width: 575px) {
    .theme-color-grid {
        grid-template-columns: 1fr;
    }
}
