@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); @import url('open-iconic/font/css/open-iconic-bootstrap.min.css'); @import url('Iconos_bootstrap5.css'); @import url('styles_dialog.css'); @import url('styles_toast.css'); @import url('style_propio.css'); @import url('style_grid_sync.css'); @import url('style_grid_table.css'); @import url('style_grid_div.css'); @import url('style_tabs.css'); :root { background: rgba(255, 255, 255, 1.0); background: linear-gradient(0deg, rgba(255, 255, 255, 1.0), rgba(198, 198, 198, 1.0)); --top-nav: linear-gradient(359deg,rgba(255, 0, 0, 1) 0%, rgba(253, 29, 29, 1) 100%); --top-nav-text: white; --left-nav: linear-gradient(0deg, #FFFFFF, #F5F5F5); --left-nav-depend: linear-gradient(0deg, #FFFFFF, #F5F5F5); --left-nav-text: black; --left-nav-carpet: linear-gradient(359deg,rgba(255, 0, 0, 1) 0%, rgba(253, 29, 29, 1) 100%); --left-nav-carpet-text: white; --left-nav-carpet-hover: linear-gradient(0deg, rgba(230,234,237,1) 0%, rgba(207,211,214,1) 100%); --left-nav-carpet-hover-text: black; --head-back: linear-gradient(180deg, rgba(205,218,255,1) 100%, rgba(182,200,250,1) 0%); --head-text: rgb(0 0 0); --text-size: 0.85rem; --text-title: 1.125rem; --titulo: linear-gradient(0deg, rgba(38,87,122,1) 0%, rgba(32,76,108,1) 100%); --titulo-text: white; --barra: linear-gradient(0deg, #211F31, #04101e); --barra-text: white; --barrabackground: darkblue; --grid-head: rgb(29,104,181); --grid-head-text: white; --pos-primary-color: #3498db; --pos-secondary-color: #2980b9; --pos-accent-color: #e74c3c; --pos-success-color: #2ecc71; --pos-warning-color: #f39c12; --pos-background-color: #f5f7fa; --pos-card-color: #ffffff; --pos-text-color: #333333; --pos-text-light: #7f8c8d; --pos-border-color: #e0e0e0; --pos-shadow: 0 2px 5px rgba(0,0,0,0.1); --pos-radius: 4px; } /* ===== Fuente global ===== */ html { font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif; } body { font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: var(--text-size); } /* ===== Modos de tamano de fuente ===== */ /* Aplicar clase en : font-small, font-normal (default), font-large */ /* rem siempre relativo al default del browser (16px) */ body.font-small { --text-size: 0.7rem; --text-title: 1rem; font-size: var(--text-size); } body.font-normal, body:not(.font-small):not(.font-large) { --text-size: 0.8rem; --text-title: 1.125rem; font-size: var(--text-size); } body.font-large { --text-size: 0.975rem; --text-title: 1.25rem; font-size: var(--text-size); } /* ===== Syncfusion: override fuente global ===== */ /* :where() tiene especificidad 0, asi las reglas de iconos (0,1,0) ganan */ .e-control, .e-control *:where(:not(.e-icons):not(.menu-icon):not([class*="bi-"]):not(.oi):not([class*="oi-"])), .e-input-group, .e-input-group *:where(:not(.e-icons):not(.menu-icon):not([class*="bi-"]):not(.oi):not([class*="oi-"])), .e-dialog, .e-dialog *:where(:not(.e-icons):not(.menu-icon):not([class*="bi-"]):not(.oi):not([class*="oi-"])), .e-popup, .e-popup *:where(:not(.e-icons):not(.menu-icon):not([class*="bi-"]):not(.oi):not([class*="oi-"])), .e-card, .e-card *:where(:not(.e-icons):not(.menu-icon):not([class*="bi-"]):not(.oi):not([class*="oi-"])) { font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important; font-size: var(--text-size); } /* ===== Proteger fuentes de iconos ===== */ .e-icons, .e-icons::before, .e-icons::after { font-family: "e-icons" !important; font-size: unset; } .menu-icon { font-family: "e-icons" !important; } [class*="bi-"]::before, [class^="bi-"]::before, .bi::before { font-family: "bootstrap-icons" !important; } .oi, .oi::before, [class*="oi-"]::before { font-family: "Icons" !important; } h1:focus { outline: none; } a, .btn-link { color: #0071c1; } .btn-primary { color: #fff; background-color: #1b6ec2; border-color: #1861ac; } .content { padding-top: 1.1rem; } .valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; } .invalid { outline: 1px solid red; } .validation-message { color: red; } /* ===== Error no controlado: popup 90% ===== */ #blazor-error-ui { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 100000; } #blazor-error-ui .error-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); display: flex; align-items: center; justify-content: center; } #blazor-error-ui .error-panel { width: 90vw; height: 90vh; background: #fff; border-radius: 12px; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.35); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3rem; text-align: center; overflow: auto; } #blazor-error-ui .error-icon { width: 80px; height: 80px; border-radius: 50%; background: #dc3545; color: #fff; font-size: 48px; font-weight: bold; display: flex; align-items: center; justify-content: center; margin-bottom: 1.5rem; } #blazor-error-ui h2 { color: #dc3545; font-size: 1.8rem; margin: 0 0 1rem; } #blazor-error-ui p { color: #444; font-size: 1.1rem; max-width: 600px; margin: 0.5rem 0; line-height: 1.6; } #blazor-error-ui .error-hint { color: #888; font-size: 0.95rem; margin-top: 1.5rem; } #blazor-error-ui .reload { display: inline-block; margin-top: 2rem; padding: 12px 36px; background: #dc3545; color: #fff; border-radius: 6px; font-size: 1.1rem; font-weight: 600; text-decoration: none; transition: background 0.2s; } #blazor-error-ui .reload:hover { background: #b02a37; } #blazor-error-ui .dismiss { display: inline-block; margin-top: 1rem; padding: 8px 24px; color: #888; font-size: 0.9rem; cursor: pointer; text-decoration: underline; } #blazor-error-ui .dismiss:hover { color: #444; } /* ===== Error boundary (dentro de componentes) ===== */ .blazor-error-boundary { background: #dc3545; padding: 1.5rem 2rem; color: white; border-radius: 8px; margin: 1rem; font-size: 1rem; } .blazor-error-boundary::after { content: "Ha ocurrido un error no controlado. Por favor, recargue la aplicacion." } .e-bigger { font-size:small; }