@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

html, body {
    font-family: 'Poppins', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Etiquetas de los controles de formulario */
.form-label {
    font-weight: 600;
    color: #3b5998;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ======================= */
/* SCROLLBAR PERSONALIZADO */
/* ======================= */

/* Scrollbar general para navegadores Webkit (Chrome, Safari, Edge) */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f5f9;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Scrollbar para el sidebar (fondo oscuro) */
.nav-scrollable::-webkit-scrollbar {
    width: 6px;
}

.nav-scrollable::-webkit-scrollbar-track {
    background: transparent;
}

.nav-scrollable::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.15);
    border-radius: 3px;
}

.nav-scrollable::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* Scrollbar para el sidebar en Firefox */
.nav-scrollable {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}

/* Scrollbar general en Firefox */
html {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f1f5f9;
}

/* ======================= */
/* ESTILOS GRID GENERICOS  */
/* ======================= */

/* Header del DataGrid con color del menú principal */
.dark-grid .mud-table-head {
    background: linear-gradient(180deg, var(--brand-grad-start, #1e293b) 0%, var(--brand-grad-end, #0f172a) 100%) !important;
}

.dark-grid .mud-table-head th,
.dark-grid .mud-table-head .mud-table-cell {
    color: var(--brand-text, #ffffff) !important;
    font-weight: 600 !important;
    background: transparent !important;
}

.dark-grid .mud-table-head .mud-table-cell .mud-icon-root,
.dark-grid .mud-table-head .mud-sort-icon {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.7) !important;
}

/* Footer/Pager del DataGrid */
.dark-grid .mud-table-pagination {
    background: linear-gradient(180deg, var(--brand-grad-start, #1e293b) 0%, var(--brand-grad-end, #0f172a) 100%) !important;
    color: var(--brand-text, #ffffff) !important;
    border-top: none !important;
}

.dark-grid .mud-table-pagination .mud-table-pagination-caption,
.dark-grid .mud-table-pagination .mud-table-pagination-select,
.dark-grid .mud-table-pagination .mud-select-input,
.dark-grid .mud-table-pagination .mud-input,
.dark-grid .mud-table-pagination .mud-input-control,
.dark-grid .mud-table-pagination p {
    color: var(--brand-text, #ffffff) !important;
}

.dark-grid .mud-table-pagination .mud-icon-button {
    color: var(--brand-text, #ffffff) !important;
}

.dark-grid .mud-table-pagination .mud-icon-button:disabled {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.3) !important;
}

/* ======================= */
/* FIX: Ancho del dropdown Rows Per Page en paginacion */
/* ======================= */
.mud-table-pagination-toolbar .mud-table-pagination-select {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: 90px !important;
}
.mud-table-pagination-toolbar .mud-table-pagination-select .mud-input-control {
    width: 80px !important;
}
.mud-table-pagination-toolbar .mud-table-pagination-select .mud-input-slot {
    width: 60px !important;
}

.dark-grid .mud-table-pagination .mud-select .mud-icon-root {
    color: var(--brand-text, #ffffff) !important;
}

/* Paginador del MudDataGrid */
.dark-grid .mud-table-pagination-toolbar {
    background: linear-gradient(180deg, var(--brand-grad-start, #1e293b) 0%, var(--brand-grad-end, #0f172a) 100%) !important;
    color: var(--brand-text, #ffffff) !important;
}

.dark-grid .mud-table-pagination-toolbar p,
.dark-grid .mud-table-pagination-toolbar .mud-table-pagination-display {
    color: var(--brand-text, #ffffff) !important;
}

.dark-grid .mud-table-pagination-actions .mud-icon-button {
    color: var(--brand-text, #ffffff) !important;
}

.dark-grid .mud-table-pagination-actions .mud-icon-button:disabled {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.3) !important;
}

/* Footer del DataGrid */
.dark-grid .mud-table-footer {
    background: linear-gradient(180deg, var(--brand-grad-start, #1e293b) 0%, var(--brand-grad-end, #0f172a) 100%) !important;
}

.dark-grid .mud-table-foot {
    background: linear-gradient(180deg, var(--brand-grad-start, #1e293b) 0%, var(--brand-grad-end, #0f172a) 100%) !important;
}

.dark-grid .mud-table-foot td {
    color: var(--brand-text, #ffffff) !important;
    background: transparent !important;
}

/* ======================= */
/* LÍNEAS VERTICALES GRID  */
/* ======================= */

.grid-vertical-lines .mud-table-head th {
    border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.grid-vertical-lines .mud-table-head th:last-child {
    border-right: none !important;
}

.grid-vertical-lines .mud-table-body td {
    border-right: 1px solid #e0e0e0 !important;
}

.grid-vertical-lines .mud-table-body td:last-child {
    border-right: none !important;
}

/* ======================= */
/* RESPONSIVE ANCHO TOTAL  */
/* Para pantallas <= 1366px */
/* ======================= */

@media screen and (max-width: 1366px) {
    /* Layout wrapper sin límite */
    .content-wrapper,
    article.content-wrapper,
    .main-content .content-area .content-wrapper {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* Área de contenido con menos padding */
    .content-area,
    .main-content .content-area {
        padding: 0.75rem !important;
    }

    /* MudContainer de MudBlazor sin límite */
    .mud-container,
    .mud-container-maxwidth-xl,
    .mud-container-maxwidth-lg,
    .mud-container-maxwidth-md {
        max-width: 100% !important;
        width: 100% !important;
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    /* DataGrid responsive */
    .mud-table,
    .mud-data-grid {
        max-width: 100% !important;
        overflow-x: auto !important;
    }

    .mud-table-container {
        max-width: 100% !important;
    }

    /* Evitar scroll horizontal en el body */
    body {
        overflow-x: hidden !important;
    }

    /* Paper sin desbordamiento.
       Se excluyen los MudCard: un MudCard ES un .mud-paper, y con overflow-x: auto le salia
       barra de scroll horizontal en cuanto su contenido se pasaba por unos pocos px, que es
       justo lo que provocan los margenes negativos que MudGrid aplica a sus lados (y que el
       padding del card ya absorbe). Los MudPaper "pelones" SI conservan el scroll: son los que
       envuelven los MudDataGrid anchos, y ahi si hace falta poder desplazarlos. */
    .mud-paper:not(.mud-card) {
        max-width: 100% !important;
        overflow-x: auto !important;
    }
}

/* ======================= */
/* PREVENIR SCROLL GLOBAL  */
/* ======================= */

html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Asegurar que el contenido principal no desborde */
.main-content,
.content-area {
    overflow-x: hidden;
    max-width: 100%;
}

/* DataGrid siempre ajustado */
.mud-table {
    table-layout: auto;
}

.mud-table-cell {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ======================= */
/* BOTON HAMBURGUESA       */
/* ======================= */
.menu-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: none;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    color: var(--brand-text, #ffffff);
    cursor: pointer;
    transition: all 0.2s ease;
}

.menu-toggle:hover {
    background: rgba(255, 255, 255, 0.3);
    color: var(--brand-text, #ffffff);
}

.menu-toggle i {
    font-size: 1.4rem;
}

/* ======================= */
/* POPUP AUTO-WIDTH        */
/* Para MudSelect y MudAutocomplete - el popup se ajusta al contenido */
/* Usar: PopoverClass="mud-popover-auto-width" */
/* ======================= */
.mud-popover-auto-width {
    width: auto !important;
    min-width: unset !important;
}

/* Popup del paginador de grids - ancho justo para 4 digitos (hasta "9999"). */
/* Los MudSelect/Autocomplete de la app siempre usan PopoverClass="mud-popover-auto-width". */
/* El unico popover de MudSelect sin esa clase es el de "rows per page" del pager, por eso lo aislamos asi. */
.mud-popover.mud-popover-open:not(.mud-popover-auto-width):has(.mud-list-item) {
    min-width: unset !important;
    max-width: 70px !important;
    width: auto !important;
}

/* ======================= */
/* CONTROLES NO EDITABLES (READONLY) */
/* Fondo AliceBlue + texto centrado + sin foco por teclado (tabindex="-1"). */
/* Pista visual estandar para que el usuario sepa que el campo no es editable. */
/* Aplicar en MudTextField/MudNumericField que muestran datos calculados, */
/* IDs, auditoria, etc. Junto con la clase usar: */
/*   ReadOnly="true" UserAttributes="@(new() { { "tabindex", "-1" } })" */
/* ======================= */
.audit-readonly input {
    text-align: center;
    background-color: AliceBlue !important;
}
.audit-readonly .mud-input-slot,
.audit-readonly .mud-input-outlined-input,
.audit-readonly .mud-input.mud-input-outlined,
.audit-readonly .mud-input-control-input-container {
    background-color: AliceBlue !important;
}

/* ======================= */
/* DATE/TIME PICKERS COMPACTOS */
/* Reduce el padding del boton del icono en MudDatePicker/MudTimePicker para */
/* dar mas espacio al texto y evitar que se corte el ultimo digito del año. */
/* ======================= */
.mud-picker .mud-input-adornment-end {
    padding-left: 0 !important;
}
.mud-picker .mud-input-adornment-end .mud-icon-button {
    padding: 4px !important;
}
.mud-picker .mud-input-adornment-end .mud-icon-button .mud-icon-root {
    font-size: 1.1rem !important;
}

/* Botones mas compactos en pantallas chicas */
@media (max-width: 1900px) {
    .mud-button .mud-typography-button {
        font-size: 0.7rem !important;
    }
}

/* ======================= */
/* GRID CONTEXT MENU       */
/* Right-click en header para copiar columna */
/* ======================= */
.grid-context-menu {
    display: none;
    position: fixed;
    z-index: 99999;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.18);
    min-width: 200px;
    padding: 4px 0;
    font-family: 'Segoe UI', 'Poppins', sans-serif;
}

.grid-ctx-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 16px;
    cursor: pointer;
    font-size: 13px;
    color: #1e293b;
    transition: background 0.15s;
    user-select: none;
}

.grid-ctx-item:hover {
    background: #e3f2fd;
}

.grid-ctx-item:first-child {
    border-radius: 6px 6px 0 0;
}

.grid-ctx-item:last-child {
    border-radius: 0 0 6px 6px;
}

.grid-ctx-item svg {
    flex-shrink: 0;
    color: #64748b;
}

.grid-ctx-item:hover svg {
    color: #1976d2;
}

.grid-copy-toast {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: #1e293b;
    color: #ffffff;
    padding: 10px 28px;
    border-radius: 8px;
    font-size: 14px;
    font-family: 'Segoe UI', 'Poppins', sans-serif;
    font-weight: 500;
    z-index: 99999;
    opacity: 0;
    transition: opacity 0.3s, transform 0.3s;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.grid-copy-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ======================= */
/* GRID COLUMN SELECTOR    */
/* Dialogo para copiar multiples columnas */
/* ======================= */
.grid-col-dialog-overlay {
    position: fixed;
    inset: 0;
    z-index: 99998;
    background: rgba(0, 0, 0, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s;
}

.grid-col-dialog-overlay.show {
    opacity: 1;
}

.grid-col-dialog {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
    min-width: 320px;
    max-width: 600px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    font-family: 'Segoe UI', 'Poppins', sans-serif;
    transform: scale(0.95);
    transition: transform 0.2s;
}

.grid-col-dialog-overlay.show .grid-col-dialog {
    transform: scale(1);
}

.grid-col-dialog-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    background: linear-gradient(135deg, var(--brand-grad-start, #1e293b), var(--brand-grad-end, #0f172a));
    color: var(--brand-text, #ffffff);
    border-radius: 12px 12px 0 0;
    font-size: 15px;
    font-weight: 600;
}

.grid-col-dialog-close {
    background: none;
    border: none;
    color: var(--brand-text, #ffffff);
    font-size: 22px;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
    opacity: 0.7;
    transition: opacity 0.15s;
}

.grid-col-dialog-close:hover {
    opacity: 1;
}

.grid-col-dialog-body {
    display: grid;
    gap: 6px 16px;
    padding: 16px 20px;
    overflow-y: auto;
    max-height: 50vh;
}

.grid-col-check {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: #1e293b;
    transition: background 0.15s;
    user-select: none;
}

.grid-col-check:hover {
    background: #f1f5f9;
}

.grid-col-check input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #1976d2;
    cursor: pointer;
    flex-shrink: 0;
}

.grid-col-dialog-footer {
    display: flex;
    gap: 8px;
    padding: 12px 20px;
    border-top: 1px solid #e2e8f0;
    justify-content: flex-end;
}

.grid-col-btn {
    padding: 7px 18px;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
}

.grid-col-btn:active {
    transform: scale(0.97);
}

.grid-col-btn-copy {
    background: #1976d2;
    color: #ffffff;
}

.grid-col-btn-copy:hover {
    background: #1565c0;
}

.grid-col-btn-cancel {
    background: #e2e8f0;
    color: #475569;
}

.grid-col-btn-cancel:hover {
    background: #cbd5e1;
}

.grid-col-btn-all {
    background: #e8f5e9;
    color: #2e7d32;
    margin-right: auto;
}

.grid-col-btn-all:hover {
    background: #c8e6c9;
}

.grid-col-btn-none {
    background: #fff3e0;
    color: #e65100;
}

.grid-col-btn-none:hover {
    background: #ffe0b2;
}

/* Ocultar columna Poliza cuando el menu lateral esta abierto en pantallas menores a 1900px */
.sidebar-checkbox:checked ~ .main-content .col-poliza-toggle {
    display: none !important;
}
@media (min-width: 1900px) {
    .sidebar-checkbox:checked ~ .main-content .col-poliza-toggle {
        display: table-cell !important;
    }
}


/* =====================================================================================
   Paginador de TODOS los grids (.grid-bordered) — estandar unico (2026-08-06)
   -------------------------------------------------------------------------------------
   Selector de renglones por pagina: ancho pegado al contenido y SIN puntos suspensivos,
   para que se lea completo el 100 / 200 / 500 / 1000; flecha del color de texto de marca
   (el pie del grid va en el color de tema elegido, ver mas abajo) y recorrida 0.5cm a la
   izquierda, porque con muchos renglones el conteo de la derecha crece y la flecha se le
   encimaba.

   El prefijo `body` sube la especificidad a proposito: muchas paginas todavia traen una
   copia de estas reglas en su <style> local (que va despues en la cascada) y asi este
   bloque manda en todas por igual. Si se cambia el paginador, se cambia AQUI.
   ===================================================================================== */
body .grid-bordered .mud-table-pagination-select .mud-input-root {
    min-width: 45px !important;
    max-width: none !important;
    width: auto !important;
    text-overflow: clip !important;
    overflow: visible !important;
}

body .grid-bordered .mud-table-pagination-select .mud-input-slot {
    text-overflow: clip !important;
    overflow: visible !important;
}

body .grid-bordered .mud-table-pagination .mud-select .mud-svg-icon,
body .grid-bordered .mud-table-pagination .mud-input-adornment-end svg {
    fill: var(--brand-text, #ffffff) !important;
    color: var(--brand-text, #ffffff) !important;
    transform: translateX(-0.5cm);
}

/* =====================================================================================
   Texto de encabezados y pies de TODOS los grids (.grid-bordered) — personalizacion de
   color por usuario (2026-08-31): BLANCO sobre un color de tema OSCURO, NEGRO sobre uno
   CLARO (ver Common.Admin/Models/TemaColorPreset.cs). El fondo de estas franjas ya sigue
   el color de marca (var(--brand-grad-start/end)); lo que faltaba era que el TEXTO
   tambien seleccionara automaticamente el color que resalta.
   -------------------------------------------------------------------------------------
   Mismo problema que el paginador de arriba: ~192 pantallas traen su PROPIA copia de
   estas reglas en un <style> local (patron documentado en B_CorsaErp/CLAUDE.md, seccion
   7 "DataGrid CSS"), cada una con "color: #ffffff !important" fijo. El prefijo `body`
   le gana en especificidad a esas copias locales (mismo truco de arriba), asi que estas
   reglas mandan en TODOS los grids sin tener que tocar los ~192 archivos.
   ===================================================================================== */
body .grid-bordered thead th.mud-table-cell {
    color: var(--brand-text, #ffffff) !important;
}

body .grid-bordered .mud-table-pagination,
body .grid-bordered tfoot,
body .grid-bordered tfoot tr,
body .grid-bordered tfoot td,
body .grid-bordered .mud-table-pagination-toolbar {
    color: var(--brand-text, #ffffff) !important;
}

body .grid-bordered .mud-table-pagination-caption,
body .grid-bordered .mud-input-root {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.85) !important;
}

body .grid-bordered .mud-table-pagination .mud-icon-button,
body .grid-bordered tfoot .mud-icon-button {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.85) !important;
}

body .grid-bordered .mud-table-pagination .mud-icon-button:disabled {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.35) !important;
}

body .grid-bordered .mud-select-icon {
    color: rgba(var(--brand-text-rgb, 255, 255, 255), 0.7) !important;
}

/* =====================================================================================
   Texto de los encabezados de TARJETA (MudCardHeader con el gradiente de marca) —
   personalizacion de color por usuario (2026-08-31), mismo criterio que arriba.
   -------------------------------------------------------------------------------------
   Cada MudCardHeader trae su texto/icono en un Style="color: white;" INLINE, por
   convencion del repo (ver B_CorsaErp/CLAUDE.md, patron de Create/Edit). Un !important
   en la hoja de estilos SI le gana a un inline SIN !important (en la cascada, la
   importancia pesa mas que la especificidad), asi que esta regla alcanza a los ~600
   encabezados de tarjeta existentes sin tener que tocar cada archivo.
   ===================================================================================== */
.mud-card-header-content .mud-typography,
.mud-card-header-content .mud-icon-root {
    color: var(--brand-text, #ffffff) !important;
}

/* =====================================================================================
   Texto de los BOTONES con el gradiente de marca (Nueva, Guardar con fondo de color, etc.)
   — personalizacion de color por usuario (2026-08-31), mismo criterio que arriba.
   -------------------------------------------------------------------------------------
   Estos botones traen fondo Y texto en el MISMO Style="" inline (ej.
   Style="background: linear-gradient(135deg, var(--brand-grad-start, ...), ...); color:
   white;"), no en una clase aparte. Como no hay una clase dedicada para "boton de marca",
   se selecciona por el propio atributo style (selector de atributo CSS, valido para
   cualquier texto dentro de la comilla): cualquier elemento cuyo style inline contenga el
   gradiente de marca recibe el color de texto que le corresponde. Sigue funcionando el
   truco de siempre: un !important en la hoja de estilos SI le gana a un inline sin
   !important.
   ===================================================================================== */
[style*="var(--brand-grad-start"] {
    color: var(--brand-text, #ffffff) !important;
}

[style*="var(--brand-grad-start"] .mud-icon-root {
    color: var(--brand-text, #ffffff) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   Foco por tabulador en los botones de TODOS los modales (revisado 2026-08-27)

   El realce que trae MudBlazor en un MudButton es casi imperceptible — mas
   todavia en los Cancelar con Variant.Text — asi que recorriendo un modal con
   Tab no se sabe en cual boton estas parado, y da la impresion de que el Tab
   "no llega" a Guardar / Cancelar y hay que darles clic.

   Va aqui y NO en el <style> de cada modal: son ~90 modales en el repo.
   Se usa :focus-visible (no :focus) para que el aro salga solo al navegar con
   teclado y no quede pegado despues de un clic con el mouse.
   ══════════════════════════════════════════════════════════════════════════ */
body .mud-dialog .mud-button-root:focus-visible {
    outline: 3px solid #f59e0b !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px rgba(245, 158, 11, 0.45) !important;
    font-weight: 700 !important;
    text-decoration: underline !important;
}