/* ==========================================================================
   SIAC — estética de DemoSIAC aplicada a Kendo UI 2021 (tema bootstrap-v4 LESS)
   y a los paneles de SmartAdmin que usan las vistas existentes.

   Se carga después de _Head (Kendo, SmartAdmin, site.css) y de siac-ui.css.
   Todo va bajo body.siac, así que solo afecta al layout principal.
   Las clases corresponden al HTML que genera Kendo 2021.x (k-state-*, k-dropdown-wrap,
   k-picker-wrap, k-numeric-wrap...). Si se actualiza Kendo a 2023+ hay que revisar esta hoja.
   ========================================================================== */

/* El pie de página queda abajo aunque el contenido sea corto */
body.siac {
    min-height: 100vh;
}

/* Tipografía: site.css fija 14px / Roboto con !important en varios widgets */
.siac .k-widget,
.siac .k-dropdown,
.siac .k-input,
.siac .k-textbox,
.siac .k-combobox,
.siac .k-tabstrip,
.siac .k-window,
.siac .k-multiselect,
.siac .k-grid,
.siac .k-button {
    font-family: 'Noto Sans', -apple-system, 'Segoe UI', Roboto, sans-serif !important;
    font-size: .875rem !important;
}

/* Paneles de SmartAdmin (panel / panel-hdr / panel-container) con aspecto de tarjeta
   ========================================================================== */
.siac .panel {
    margin-bottom: 1.5rem;
    border: 1px solid var(--siac-borde);
    border-radius: var(--siac-radio);
    background: #fff;
    box-shadow: var(--siac-sombra);
}

.siac .panel-hdr {
    min-height: 0;
    padding: .85rem 1.25rem;
    border-bottom: 1px solid var(--siac-borde);
    border-radius: var(--siac-radio) var(--siac-radio) 0 0;
    background: #fff;
}

.siac .panel-hdr h2 {
    margin: 0;
    padding: 0;
    color: var(--siac-guinda-oscuro);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

.siac .panel-hdr h2 small,
.siac .panel-hdr h2 span {
    margin-left: .35rem;
    color: var(--siac-gris);
    font-weight: 400;
}

.siac .panel-container,
.siac .panel-content {
    border-radius: 0 0 var(--siac-radio) var(--siac-radio);
}

.siac .panel-content {
    padding: 1.25rem;
}

.siac .card {
    border-color: var(--siac-borde);
    border-radius: var(--siac-radio);
    box-shadow: var(--siac-sombra);
}

.siac .card-header {
    border-bottom-color: var(--siac-borde);
    background: #fff;
    color: var(--siac-guinda-oscuro);
    font-weight: 700;
}

.siac .card-header:first-child {
    border-radius: var(--siac-radio) var(--siac-radio) 0 0;
}

/* Botones de Bootstrap que usan las vistas (btn-info / btn-success / btn-secondary) */
.siac .btn-info {
    border-color: var(--siac-guinda);
    background-color: var(--siac-guinda);
    color: #fff;
}

.siac .btn-info:hover,
.siac .btn-info:focus,
.siac .btn-info:not(:disabled):active {
    border-color: var(--siac-guinda-oscuro);
    background-color: var(--siac-guinda-oscuro);
    color: #fff;
}

.siac .btn-success {
    border-color: var(--siac-verde);
    background-color: var(--siac-verde);
}

.siac .btn-secondary,
.siac .btn-default {
    border-color: var(--siac-borde);
    background-color: #fff;
    color: var(--siac-texto);
}

.siac .btn-secondary:hover,
.siac .btn-default:hover {
    border-color: var(--siac-dorado);
    background-color: var(--siac-dorado-suave);
    color: var(--siac-guinda-oscuro);
}

/* Botones de Kendo
   ========================================================================== */
.siac .k-button {
    border-color: var(--siac-borde);
    border-radius: 6px;
    background: #fff;
    color: var(--siac-texto);
    font-weight: 600;
    box-shadow: none;
}

.siac .k-button:hover,
.siac .k-button.k-state-hover {
    border-color: var(--siac-dorado);
    background: var(--siac-dorado-suave);
    color: var(--siac-guinda-oscuro);
}

.siac .k-button:focus,
.siac .k-button.k-state-focused {
    box-shadow: 0 0 0 .2rem rgba(155, 34, 71, .15);
}

.siac .k-button.k-primary,
.siac .k-button.k-button-solid-primary {
    border-color: var(--siac-guinda);
    background: var(--siac-guinda);
    color: #fff;
}

.siac .k-button.k-primary:hover,
.siac .k-button.k-primary.k-state-hover,
.siac .k-button.k-primary:active {
    border-color: var(--siac-guinda-oscuro);
    background: var(--siac-guinda-oscuro);
    color: #fff;
}

/* site.css pone .k-icon { margin: 0 !important }; en botones con texto se separa el ícono */
.siac .k-button-icontext .k-icon,
.siac .k-button-icontext .k-image {
    margin: 0 .4rem 0 0 !important;
}

.siac .k-button.k-state-disabled,
.siac .k-button[disabled] {
    opacity: .5;
}

/* Campos: textbox, textarea, numérico, combos, fechas, multiselect
   ========================================================================== */
.siac .k-textbox,
.siac .k-textarea,
.siac .k-dropdown-wrap,
.siac .k-picker-wrap,
.siac .k-numeric-wrap,
.siac .k-multiselect-wrap,
.siac .k-maskedtextbox > .k-textbox,
.siac input.k-textbox {
    border-color: var(--siac-borde-campo);
    border-radius: 6px;
    background-color: #fff;
    box-shadow: none;
}

.siac .k-dropdown-wrap .k-input,
.siac .k-picker-wrap .k-input,
.siac .k-numeric-wrap .k-input,
.siac .k-textbox > .k-input {
    height: calc(1.5em + 1rem);
    padding: .5rem .75rem;
    color: var(--siac-texto);
}

/* El botón de abrir (flecha / calendario / spinner) sin fondo gris */
.siac .k-dropdown-wrap .k-select,
.siac .k-picker-wrap .k-select,
.siac .k-numeric-wrap .k-select {
    border-left-color: transparent;
    background: transparent;
    color: var(--siac-gris);
}

.siac .k-dropdown .k-dropdown-wrap,
.siac .k-dropdown .k-dropdown-wrap.k-state-default {
    background-image: none;
}

.siac .k-textbox:hover,
.siac .k-textarea:hover,
.siac .k-dropdown-wrap.k-state-hover,
.siac .k-picker-wrap.k-state-hover,
.siac .k-numeric-wrap.k-state-hover,
.siac .k-multiselect-wrap:hover {
    border-color: var(--snd-neutro-500);
    background-color: #fff;
}

.siac .k-textbox.k-state-focused,
.siac .k-textbox:focus-within,
.siac .k-textarea.k-state-focused,
.siac .k-textarea:focus-within,
.siac .k-dropdown-wrap.k-state-focused,
.siac .k-dropdown-wrap.k-state-border-down,
.siac .k-dropdown-wrap.k-state-border-up,
.siac .k-picker-wrap.k-state-focused,
.siac .k-numeric-wrap.k-state-focused,
.siac .k-multiselect.k-state-focused > .k-multiselect-wrap {
    border-color: var(--siac-guinda);
    box-shadow: 0 0 0 .2rem rgba(155, 34, 71, .12);
}

.siac .k-state-disabled .k-dropdown-wrap,
.siac .k-state-disabled .k-picker-wrap,
.siac .k-state-disabled .k-numeric-wrap,
.siac .k-textbox.k-state-disabled,
.siac .k-textarea.k-state-disabled {
    background-color: var(--snd-neutro-300);
    opacity: 1;
}

.siac .k-state-invalid > .k-dropdown-wrap,
.siac .k-textbox.k-state-invalid,
.siac .k-invalid,
.siac .k-textbox.input-validation-error {
    border-color: var(--siac-rojo) !important;
}

.siac .k-invalid-msg,
.siac .k-tooltip-validation {
    border-color: var(--siac-rojo-suave);
    background: var(--siac-rojo-suave);
    color: var(--siac-rojo);
}

/* Etiquetas seleccionadas del multiselect */
.siac .k-multiselect-wrap li.k-button {
    border: 0;
    border-radius: 999px;
    background: var(--siac-guinda-suave);
    color: var(--siac-guinda-oscuro);
}

/* Listas desplegables, calendarios y menús (van en un popup fuera del contenido) */
.siac .k-popup {
    border-color: var(--siac-borde);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

.siac .k-list .k-item,
.siac .k-list-container .k-item {
    border-radius: 4px;
}

.siac .k-list .k-item.k-state-hover,
.siac .k-list .k-item:hover {
    background: var(--siac-fondo);
    color: var(--siac-texto);
}

.siac .k-list .k-item.k-state-focused {
    box-shadow: inset 0 0 0 1px var(--siac-dorado-claro);
}

.siac .k-list .k-item.k-state-selected,
.siac .k-calendar .k-state-selected .k-link,
.siac .k-calendar td.k-state-selected .k-link,
.siac .k-calendar .k-footer .k-nav-today {
    background: var(--siac-guinda);
    color: #fff;
}

.siac .k-calendar .k-today .k-link {
    box-shadow: inset 0 0 0 1px var(--siac-guinda);
    color: var(--siac-guinda);
}

.siac .k-calendar .k-footer .k-nav-today {
    background: transparent;
    color: var(--siac-guinda);
}

/* Casillas y opciones */
.siac .k-checkbox:checked,
.siac .k-radio:checked {
    border-color: var(--siac-guinda);
    background-color: var(--siac-guinda);
}

.siac .k-checkbox:focus,
.siac .k-radio:focus {
    box-shadow: 0 0 0 .2rem rgba(155, 34, 71, .15);
}

/* kendo-radiogroup como control segmentado: envolverlo en <div class="siac-k-segmentado">.
   El radiogroup sigue funcionando igual (value(), evento change); solo cambia el aspecto.
   Requiere la etiqueta después del radio (label-position After, el valor por omisión). */
.siac .siac-k-segmentado .k-radio-list {
    display: inline-flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 3px;
    border: 1px solid var(--siac-borde);
    border-radius: 8px;
    background: var(--siac-fondo);
    list-style: none;
}

.siac .siac-k-segmentado .k-radio-item {
    position: relative;
    margin: 0;
    padding: 0;
}

.siac .siac-k-segmentado .k-radio {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.siac .siac-k-segmentado .k-radio-label {
    margin: 0;
    padding: .4rem .85rem;
    border-radius: 6px;
    color: var(--siac-gris);
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s;
}

.siac .siac-k-segmentado .k-radio-label::before,
.siac .siac-k-segmentado .k-radio-label::after {
    display: none;
}

.siac .siac-k-segmentado .k-radio:checked + .k-radio-label {
    background: #fff;
    color: var(--siac-guinda);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
}

.siac .siac-k-segmentado .k-radio:focus-visible + .k-radio-label {
    outline: 2px solid var(--siac-guinda);
}

/* kendo-radiogroup como opciones en tarjeta: envolverlo en <div class="siac-k-opciones"> */
.siac .siac-k-opciones .k-radio-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.siac .siac-k-opciones .k-radio-item {
    display: flex;
    align-items: flex-start;
    margin: 0;
    padding: .85rem 1rem;
    border: 1px solid var(--siac-borde-campo);
    border-radius: 8px;
    background: #fff;
}

.siac .siac-k-opciones .k-radio-item:has(.k-radio:checked) {
    border-color: var(--siac-guinda);
    background: var(--siac-guinda-suave);
}

.siac .siac-k-opciones .k-radio {
    flex: 0 0 auto;
    margin: .2rem .6rem 0 0;
}

.siac .siac-k-opciones .k-radio-label {
    margin: 0;
    color: var(--siac-texto);
    font-size: .85rem;
    font-weight: 600;
    cursor: pointer;
}

/* Barra de acciones como pie de una tarjeta */
.siac .siac-card > .siac-barra-acciones {
    border-radius: 0 0 var(--siac-radio) var(--siac-radio);
}

/* Encabezados armados en los controladores: "<a href='listado'><i class='fa-arrow-circle-left'></i></a> Título" */
.siac .siac-page-title > a:first-child {
    margin-right: .35rem;
    color: var(--siac-dorado) !important;
    text-decoration: none !important;
}

.siac .siac-page-title > a:first-child:hover {
    color: var(--siac-guinda) !important;
}

.siac .siac-page-title .fw-300 {
    font-weight: 400;
}

/* Etiquetas (asp-for) dentro de una ficha: toman el estilo del <dt> */
.siac .siac-ficha dt label {
    margin: 0;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
}

/* Grid sin borde ni sombra propios cuando va dentro de una tarjeta siac-card */
.siac .siac-card > .k-grid {
    border-width: 1px 0 0;
    border-radius: 0 0 var(--siac-radio) var(--siac-radio);
}

/* Interruptor: conserva el significado sí (verde) / no (rojo) de site.css con la paleta */
.siac .k-switch-on .k-switch-container {
    background-color: var(--siac-verde) !important;
}

.siac .k-switch-off .k-switch-container {
    background-color: var(--snd-neutro-500) !important;
}

.siac .k-switch-off .k-switch-label-off {
    color: #fff;
}

/* Grid
   ========================================================================== */
.siac .k-grid {
    overflow: hidden;
    border-color: var(--siac-borde);
    border-radius: var(--siac-radio);
    background: #fff;
    box-shadow: var(--siac-sombra);
}

.siac .panel .k-grid,
.siac .card .k-grid,
.siac .siac-card .k-grid {
    border-radius: 0;
    box-shadow: none;
}

.siac .k-grid-toolbar,
.siac .k-grouping-header {
    padding: .75rem 1rem;
    border-color: var(--siac-borde);
    background: #fff;
    color: var(--siac-gris);
}

/* Encabezados de tabla: guinda de la paleta (--siac-tabla-encabezado, ver siac-ui.css) con letra blanca */
.siac .k-grid-header,
.siac .k-grid-header-wrap,
.siac .k-grid .k-header {
    border-color: rgba(255, 255, 255, .18);
    background: var(--siac-tabla-encabezado);
}

.siac .k-grid-header th.k-header {
    padding: .7rem 1rem;
    border-color: rgba(255, 255, 255, .18);
    color: #fff;
    font-size: .72rem !important;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    vertical-align: middle;
}

/* Espacio para el ícono de filtro (va posicionado a la derecha del encabezado) */
.siac .k-grid-header th.k-header.k-filterable,
.siac .k-grid-header th.k-header.k-with-icon {
    padding-right: 2.25rem;
}

.siac .k-grid-header th.k-header > .k-link,
.siac .k-grid-header th.k-header .k-link,
.siac .k-grid-header .k-grid-filter,
.siac .k-grid-header .k-header-column-menu {
    color: #fff;
}

/* Ordenado / al pasar el cursor: dorado claro, legible sobre guinda */
.siac .k-grid-header th.k-header.k-sorted > .k-link,
.siac .k-grid-header th.k-header > .k-link:hover,
.siac .k-grid-header .k-i-sort-asc-sm,
.siac .k-grid-header .k-i-sort-desc-sm {
    color: var(--snd-dorado-300);
}

.siac .k-grid-header .k-grid-filter:hover,
.siac .k-grid-header .k-header-column-menu:hover {
    background: rgba(255, 255, 255, .14);
    color: #fff;
}

/* Filtro aplicado: ícono en dorado para que se distinga del encabezado guinda */
.siac .k-grid-header .k-grid-filter.k-state-active,
.siac .k-grid-header .k-header-column-menu.k-state-active {
    background: var(--siac-dorado);
    color: #fff;
}

.siac .k-grid td {
    padding: .6rem 1rem;
    border-color: var(--snd-neutro-300);
    vertical-align: middle;
}

/* Celdas de sangría de los grupos: sin relleno (si no, muestran "…") */
.siac .k-grid td.k-group-cell,
.siac .k-grid td.k-hierarchy-cell {
    padding: 0;
}

/* Buscador de la barra del grid */
.siac .k-grid-toolbar .k-grid-search {
    width: 360px;
    max-width: 100%;
}

.siac .k-grid tr.k-alt {
    background: #fff;
}

.siac .k-grid tbody tr:hover,
.siac .k-grid tbody tr.k-state-hover {
    background: var(--snd-neutro-200);
}

.siac .k-grid tr.k-state-selected,
.siac .k-grid td.k-state-selected {
    background: var(--siac-guinda-suave);
    color: var(--siac-texto);
}

.siac .k-grid .k-grouping-row td,
.siac .k-grid .k-group-cell {
    background: var(--siac-dorado-suave);
    color: var(--siac-guinda-oscuro);
    font-weight: 700;
}

.siac .k-grid .k-command-cell .k-button {
    padding: .25rem .5rem;
}

.siac .k-grid .k-filter-row th {
    background: #fff;
}

.siac .k-grouping-header .k-group-indicator {
    border-color: var(--siac-dorado);
    border-radius: 999px;
    background: var(--siac-dorado-suave);
    color: var(--siac-guinda-oscuro);
}

/* Paginador */
.siac .k-pager-wrap {
    padding: .6rem 1rem;
    border-color: var(--siac-borde);
    background: #fff;
    color: var(--siac-gris);
}

.siac .k-pager-wrap .k-link,
.siac .k-pager-numbers .k-link {
    min-width: 32px;
    height: 32px;
    border: 1px solid var(--siac-borde);
    border-radius: 6px !important;
    color: var(--siac-texto);
    font-weight: 600;
}

.siac .k-pager-numbers .k-link {
    margin: 0 .1rem;
}

.siac .k-pager-wrap .k-link:hover {
    border-color: var(--siac-dorado);
    background: var(--siac-dorado-suave);
    color: var(--siac-guinda-oscuro);
}

.siac .k-pager-numbers .k-state-selected,
.siac .k-pager-numbers .k-link.k-state-selected {
    border-color: var(--siac-guinda);
    border-radius: 6px;
    background: var(--siac-guinda);
    color: #fff;
}

.siac .k-pager-wrap .k-state-disabled {
    opacity: .4;
}

/* Pestañas (kendo-tabstrip)
   ========================================================================== */
.siac .k-tabstrip {
    border: 0;
    background: transparent;
}

.siac .k-tabstrip-items {
    padding: 0;
    border-bottom: 1px solid var(--siac-borde);
}

.siac .k-tabstrip-items .k-item {
    margin-bottom: -1px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    background: transparent;
}

.siac .k-tabstrip-items .k-item .k-link {
    padding: .8rem 1rem;
    color: var(--siac-gris);
    font-weight: 600;
}

.siac .k-tabstrip-items .k-item.k-state-hover .k-link,
.siac .k-tabstrip-items .k-item:hover .k-link {
    color: var(--siac-guinda);
}

.siac .k-tabstrip-items .k-item.k-state-active {
    border-bottom-color: var(--siac-guinda);
    background: transparent;
}

.siac .k-tabstrip-items .k-item.k-state-active .k-link {
    color: var(--siac-guinda);
}

.siac .k-tabstrip > .k-content {
    padding: 1.25rem 0 0;
    border: 0;
    background: transparent;
}

/* Indicador de pasos (kendo-stepper): paso actual y completados en guinda, línea de avance en dorado.
   Con .siac-stepper-indicador los pasos no se pueden pulsar (se avanza con los botones del formulario) */
.siac .k-stepper .k-step-indicator {
    border-color: var(--siac-borde-campo);
    background: #fff;
    color: var(--siac-gris);
    font-weight: 700;
}

.siac .k-stepper .k-step-current .k-step-indicator,
.siac .k-stepper .k-step-done .k-step-indicator {
    border-color: var(--siac-guinda);
    background: var(--siac-guinda);
    color: #fff;
}

.siac .k-stepper .k-step-current .k-step-indicator::after {
    border-color: var(--siac-guinda);
}

.siac .k-stepper .k-step-label {
    color: var(--siac-gris);
    font-size: .85rem;
}

.siac .k-stepper .k-step-current .k-step-label,
.siac .k-stepper .k-step-done .k-step-label {
    color: var(--siac-guinda-oscuro);
    font-weight: 700;
}

.siac .k-stepper .k-progressbar {
    background: var(--siac-borde);
}

.siac .k-stepper .k-progressbar .k-state-selected,
.siac .k-stepper .k-progressbar .k-selected {
    border-color: var(--siac-dorado);
    background: var(--siac-dorado);
}

.siac .siac-stepper-indicador .k-step-link {
    cursor: default;
    pointer-events: none;
}

.siac .k-stepper .k-step-link:focus,
.siac .k-stepper .k-step-focus .k-step-indicator {
    box-shadow: none;
}

/* Paneles plegables (kendo-expansionpanel) con aspecto de tarjeta
   ========================================================================== */
.siac .k-expander {
    margin-bottom: 1rem;
    overflow: hidden;
    border: 1px solid var(--siac-borde);
    border-radius: var(--siac-radio);
    background: #fff;
    box-shadow: var(--siac-sombra);
}

.siac .k-expander + .k-expander {
    border-top-width: 1px;
}

/* site.css le pone un borde verde a la izquierda y 12px; aquí va como tarjeta */
.siac .k-expander-header {
    padding: .9rem 1.25rem;
    border-left: 0;
    background: #fff;
    font-size: .875rem;
}

.siac .k-expander-header:hover {
    background: var(--snd-dorado-100);
}

.siac .k-expander.k-state-focused,
.siac .k-expander:focus {
    box-shadow: 0 0 0 .2rem rgba(155, 34, 71, .12);
}

.siac .k-expander-title {
    color: var(--siac-guinda-oscuro);
    font-weight: 700;
    text-transform: none;
}

.siac .k-expander-sub-title {
    color: var(--siac-gris);
}

.siac .k-expander-indicator {
    color: var(--siac-gris);
}

.siac .k-expander.k-expanded > .k-expander-header {
    border-bottom: 1px solid var(--siac-borde);
}

.siac .k-expander-content {
    padding: 1.25rem !important;
}

/* Ventanas (kendo-window) y diálogos
   ========================================================================== */
.siac .k-window,
.siac .k-dialog {
    overflow: hidden;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, .2);
}

.siac .k-window-titlebar {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--siac-borde);
    background: #fff;
    color: var(--siac-guinda-oscuro);
}

.siac .k-window-title {
    font-size: 1rem;
    font-weight: 700;
}

.siac .k-window-titlebar .k-window-action {
    color: var(--siac-gris);
}

.siac .k-window-content {
    padding: 1.25rem;
}

.siac .k-overlay {
    background-color: var(--snd-neutro-800);
    opacity: .45;
}

/* Carga de archivos (kendo-upload)
   ========================================================================== */
.siac .k-upload {
    border-color: var(--siac-borde-campo);
    border-radius: 8px;
}

.siac .k-upload .k-dropzone {
    border-radius: 8px;
    background: var(--siac-fondo);
}

.siac .k-upload .k-dropzone.k-dropzone-hovered,
.siac .k-upload .k-dropzone:hover {
    background: var(--siac-dorado-suave);
}

.siac .k-upload .k-upload-button {
    border-color: var(--siac-dorado);
    color: var(--siac-guinda-oscuro);
}

.siac .k-upload .k-upload-status .k-i-check,
.siac .k-upload .k-file-success .k-file-name {
    color: var(--siac-verde);
}

/* Otros
   ========================================================================== */
.siac .k-badge {
    border-radius: 999px;
    font-weight: 700;
}

/* Insignias "Nuevo/Nueva" junto a las etiquetas (abren la ventana de alta del catálogo) */
.siac .k-badge-info {
    border-color: var(--siac-dorado);
    background: var(--siac-dorado-suave);
    color: var(--siac-guinda-oscuro);
    font-size: .7rem !important;
    cursor: pointer;
}

.siac a:hover .k-badge-info {
    background: var(--siac-dorado);
    color: #fff;
}

.siac .k-badge-primary,
.siac .k-badge.k-badge-solid-primary {
    border-color: var(--siac-guinda);
    background: var(--siac-guinda);
}

.siac .k-loader-primary,
.siac .k-loader .k-loader-segment {
    color: var(--siac-guinda);
}

.siac .k-progressbar .k-state-selected {
    border-color: var(--siac-guinda);
    background: var(--siac-guinda);
}

.siac .k-scrollview {
    border-radius: var(--siac-radio);
}

/* ==========================================================================
   Colores de estado y clases de Bootstrap / SmartAdmin con la paleta del
   Sistema Nacional de Diseño (snd.gob.mx/estilos/colores) y la guía GOB.mx v3
   ========================================================================== */
.siac {
    color: var(--siac-texto);
}

/* Alertas: fondo 100 + texto 500 del color semántico */
.siac .alert {
    border-width: 0 0 0 4px;
    border-radius: 8px;
}

.siac .alert-success { border-color: var(--snd-verde-ok-500); background: var(--snd-verde-ok-100); color: var(--snd-verde-ok-500); }
.siac .alert-info { border-color: var(--snd-azul-500); background: var(--snd-azul-100); color: var(--snd-azul-500); }
.siac .alert-warning { border-color: var(--snd-amarillo-500); background: var(--snd-amarillo-100); color: var(--snd-amarillo-500); }
.siac .alert-danger { border-color: var(--snd-rojo-500); background: var(--snd-rojo-100); color: var(--snd-rojo-500); }
.siac .alert-primary { border-color: var(--snd-guinda-600); background: var(--snd-guinda-100); color: var(--snd-guinda-900); }

/* Insignias */
.siac .badge { border-radius: 999px; font-weight: 700; }
.siac .badge-success { background: var(--snd-verde-ok-100); color: var(--snd-verde-ok-500); }
.siac .badge-info { background: var(--snd-azul-100); color: var(--snd-azul-500); }
.siac .badge-warning { background: var(--snd-amarillo-100); color: var(--snd-amarillo-500); }
.siac .badge-danger { background: var(--snd-rojo-100); color: var(--snd-rojo-500); }
.siac .badge-primary { background: var(--snd-guinda-600); color: #fff; }
.siac .badge-secondary { background: var(--snd-neutro-300); color: var(--snd-neutro-700); }

/* Texto y fondos de utilidad */
.siac .text-primary, .siac .color-primary-500, .siac .color-primary-400, .siac .color-primary-300 { color: var(--snd-guinda-600) !important; }
.siac .text-success, .siac .color-success-500, .siac .color-success-400 { color: var(--snd-verde-ok-500) !important; }
.siac .text-danger, .siac .color-danger-500, .siac .color-danger-400, .siac .color-danger-300 { color: var(--snd-rojo-500) !important; }
.siac .text-info { color: var(--snd-azul-500) !important; }
.siac .text-warning { color: var(--snd-amarillo-500) !important; }
.siac .text-muted { color: var(--snd-neutro-600) !important; }

/* Mosaicos de color de SmartAdmin (indicadores en pantallas aún no rediseñadas) */
.siac .bg-primary, .siac .bg-primary-300, .siac .bg-primary-400, .siac .bg-primary-500 { background-color: var(--snd-guinda-600) !important; }
.siac .bg-info, .siac .bg-info-300, .siac .bg-info-400, .siac .bg-info-500 { background-color: var(--snd-verde-600) !important; }
.siac .bg-success, .siac .bg-success-300, .siac .bg-success-400, .siac .bg-success-500 { background-color: var(--snd-verde-ok-500) !important; }
.siac .bg-warning, .siac .bg-warning-300, .siac .bg-warning-400, .siac .bg-warning-500 { background-color: var(--snd-dorado-600) !important; }
.siac .bg-danger, .siac .bg-danger-300, .siac .bg-danger-400, .siac .bg-danger-500 { background-color: var(--snd-rojo-500) !important; }

/* Botones de estado */
.siac .btn-success { border-color: var(--snd-verde-ok-500); background-color: var(--snd-verde-ok-500); color: #fff; }
.siac .btn-danger { border-color: var(--snd-rojo-500); background-color: var(--snd-rojo-500); color: #fff; }
.siac .btn-warning { border-color: var(--snd-dorado-600); background-color: var(--snd-dorado-600); color: #fff; }
.siac .btn-outline-danger { border-color: var(--snd-rojo-500); color: var(--snd-rojo-500); }
.siac .btn-outline-danger:hover { background-color: var(--snd-rojo-500); color: #fff; }

/* Separador con encabezado de GOB.mx v3 (<hr class="red">) */
.siac hr.red {
    width: 35px;
    height: 5px;
    margin: .5rem 0 1rem;
    border: 0;
    background: var(--snd-guinda-600);
}

/* Etiquetas de Kendo (kendo-badge) */
.siac .k-badge-success { border-color: var(--snd-verde-ok-500); background: var(--snd-verde-ok-500); color: #fff; }
.siac .k-badge-error { border-color: var(--snd-rojo-500); background: var(--snd-rojo-500); color: #fff; }
.siac .k-badge-warning { border-color: var(--snd-amarillo-500); background: var(--snd-amarillo-500); color: #fff; }