/* Branding ITNova. Colores/tipografia definidos en Archivos-Compartidos\branding web app.txt. Se apoya en el modo oscuro nativo de Bootstrap 5.3 (atributo data-bs-theme en , alternado por theme-toggle.js) y solo agrega la capa de marca encima. */ :root { --brand-primary: #1E2D6E; --brand-accent: #E85A1B; --brand-surface: #E8EBF5; --brand-surface-alt: #F0F2FA; --brand-border: #CCCCCC; --brand-on-primary: #ffffff; } [data-bs-theme="dark"] { --brand-accent: #FF8A50; --brand-surface: #1c2333; --brand-surface-alt: #232a3d; --brand-border: #3a4155; } body { font-family: Arial, Helvetica, sans-serif; } /* Header: linea azul (navbar en color de marca en ambos modos) con acento naranja como separador, segun especificacion. */ .navbar { background-color: var(--brand-primary) !important; border-bottom: 3px solid var(--brand-accent); } .navbar .navbar-brand, .navbar .nav-link { color: var(--brand-on-primary) !important; } /* Jerarquia de titulos */ h1 { color: var(--brand-primary); font-weight: 700; border-bottom: 3px solid var(--brand-accent); padding-bottom: 0.5rem; margin-bottom: 1.5rem; } [data-bs-theme="dark"] h1 { color: #8DA3E8; } h2 { color: var(--brand-accent); font-weight: 600; margin-top: 2rem; } /* Recuadros destacados (alertas/flash): fondo suave, nunca blanco puro, borde izquierdo grueso naranja. */ .alert { background-color: var(--brand-surface) !important; border: none; border-left: 5px solid var(--brand-accent); } /* Tablas: encabezado azul con texto blanco, filas alternando los dos tonos suaves de marca. */ .table thead th { background-color: var(--brand-primary); color: var(--brand-on-primary); } .table tbody tr:nth-child(odd) > * { background-color: var(--brand-surface); } .table tbody tr:nth-child(even) > * { background-color: var(--brand-surface-alt); } /* Espaciado generoso, evita interfaces sobrecargadas */ .container { padding-bottom: 3rem; } .theme-toggle { background: transparent; border: 1px solid var(--brand-on-primary); color: var(--brand-on-primary); border-radius: 4px; padding: 0.25rem 0.6rem; font-size: 0.875rem; cursor: pointer; } .theme-toggle:hover { background-color: rgba(255, 255, 255, 0.15); } /* Impresion: al imprimir (ej. etiquetas QR) no queremos el navbar, el toggle de tema ni ningun elemento marcado .no-imprimir en el papel. */ @media print { .navbar, .theme-toggle, .no-imprimir { display: none !important; } }