:root { --ufps-rojo: #aa1916; --ufps-rojo-oscuro: #8a1412; }
body { background: #f5f6f8; }
.bg-ufps { background: var(--ufps-rojo); }
.btn-ufps { background: var(--ufps-rojo); color: #fff; border-color: var(--ufps-rojo); }
.btn-ufps:hover, .btn-ufps:focus { background: var(--ufps-rojo-oscuro); color: #fff; border-color: var(--ufps-rojo-oscuro); }
.card { border: 0; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.card-header { background: #fff; font-weight: 600; }
.kpi .valor { font-size: 2rem; font-weight: 700; line-height: 1; }
.kpi .etiqueta { color: #6c757d; font-size: .85rem; }
.table > :not(caption) > * > * { vertical-align: middle; }
.tabla-compacta td, .tabla-compacta th { padding: .35rem .5rem; font-size: .9rem; }
.encabezado-pagina { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: 1rem; }
.encabezado-pagina h1 { font-size: 1.5rem; margin: 0; }
.login-caja { max-width: 420px; margin: 6vh auto; }
.logo-navbar { height: 38px; width: auto; }
.separador-marca { color: #fff; font-weight: 600; border-left: 1px solid rgba(255,255,255,.5); padding-left: .6rem; }
.logo-ingreso { width: 170px; max-width: 70%; height: auto; }
.linea-tiempo { list-style: none; padding-left: 0; border-left: 2px solid #dee2e6; margin-left: .5rem; }
.linea-tiempo li { position: relative; padding: 0 0 1rem 1.25rem; }
.linea-tiempo li::before { content: ""; position: absolute; left: -7px; top: .35rem; width: 12px; height: 12px; border-radius: 50%; background: #adb5bd; }
.linea-tiempo li.cambio::before { background: var(--ufps-rojo); }
.pasos { display: flex; flex-wrap: wrap; gap: .5rem; }
.pasos .paso { flex: 1 1 120px; text-align: center; padding: .5rem; border-radius: .5rem; background: #e9ecef; color: #6c757d; font-size: .9rem; }
.pasos .paso.hecho { background: #d1e7dd; color: #0f5132; }
.pasos .paso.actual { background: var(--ufps-rojo); color: #fff; font-weight: 600; }
.pasos .paso.rechazado { background: #f8d7da; color: #842029; font-weight: 600; }
.barra { height: .5rem; }
.form-text { font-size: .8rem; }
/* Tour guiado (Driver.js) con los colores institucionales */
.driver-popover.tour-ufps { border-top: 4px solid var(--ufps-rojo); border-radius: .6rem; max-width: 340px; font-family: inherit; }
.driver-popover.tour-ufps .driver-popover-title { color: var(--ufps-rojo); font-size: 1.05rem; }
.driver-popover.tour-ufps .driver-popover-description { color: #333; font-size: .92rem; }
.driver-popover.tour-ufps .driver-popover-next-btn { background: var(--ufps-rojo); color: #fff; text-shadow: none; border: 0; }
.driver-popover.tour-ufps .driver-popover-next-btn:hover { background: var(--ufps-rojo-oscuro); }
.driver-popover.tour-ufps .driver-popover-progress-text { color: #6c757d; }
pre.token { white-space: pre-wrap; word-break: break-all; background: #212529; color: #f8f9fa; padding: 1rem; border-radius: .5rem; }
