:root { --santuario: rgb(2, 89, 81); --santuario-dark: rgb(1, 65, 59); --crema: #f7f4ec; }
html, body { min-height: 100%; }
body { background: #f5f7f6; color: #24302e; display: flex; flex-direction: column; }
.santuario-navbar { background: linear-gradient(135deg, var(--santuario), var(--santuario-dark)); }
.login-page { min-height: 92vh; background: radial-gradient(circle at top, #e3f0ed 0, var(--crema) 48%, #eef2f1 100%); }
.login-card { width: 100%; max-width: 430px; border-radius: 1.25rem; }
.brand-mark { width: 68px; height: 68px; border-radius: 50%; display: grid; place-items: center; background: var(--santuario); color: white; font-weight: 700; font-size: 1.35rem; }
.login-logo { width: 92px; height: 92px; object-fit: contain; }
.navbar-logo { width: 38px; height: 38px; object-fit: contain; background: white; border-radius: 50%; padding: 2px; }
.btn-santuario { background: var(--santuario); border-color: var(--santuario); color: white; }
.btn-santuario:hover, .btn-santuario:focus { background: var(--santuario-dark); border-color: var(--santuario-dark); color: white; }
.btn-outline-santuario { color: var(--santuario); border-color: var(--santuario); }
.btn-outline-santuario:hover { background: var(--santuario); border-color: var(--santuario); color: white; }
.form-control:focus { border-color: rgba(2,89,81,.55); box-shadow: 0 0 0 .25rem rgba(2,89,81,.15); }
.summary-card { min-height: 145px; border-radius: 1rem; padding: 1.5rem; color: white; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 0 .5rem 1rem rgba(20,50,45,.10); }
.summary-card span { opacity: .88; font-size: .95rem; }
.summary-card strong { font-size: 1.8rem; }
.summary-card.entrada { background: linear-gradient(135deg, #147d6f, #07594f); }
.summary-card.salida { background: linear-gradient(135deg, #b45b52, #823b34); }
.summary-card.saldo { background: linear-gradient(135deg, #3f6170, #29434e); }
.metric-card { background: white; border-radius: 1rem; padding: 1.25rem; box-shadow: 0 .35rem 1rem rgba(20,50,45,.08); display: flex; flex-direction: column; gap: .35rem; }
.metric-card span { color: #6c757d; font-size: .9rem; }
.metric-card strong { font-size: 1.45rem; }
.table thead th { background: #edf3f1; color: #36514c; font-size: .82rem; text-transform: uppercase; letter-spacing: .025em; border-bottom: 0; }
@media (max-width: 991.98px) { .navbar-nav { flex-direction: row; gap: .5rem; } .navbar-brand span { display: none; } }
.t-account { overflow: hidden; }
.t-account-title { background: var(--santuario); color: white; text-align: center; padding: 1rem; font-size: 1.2rem; font-weight: 700; }
.t-side:first-child { border-right: 3px solid var(--santuario); }
.t-heading { text-align: center; padding: .7rem; background: #edf3f1; color: #36514c; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.t-balance { padding: 1rem 1.25rem; border-top: 3px solid var(--santuario); text-align: right; font-size: 1.2rem; background: #f8faf9; }
.t-movements-scroll { height: 32rem; max-height: 65vh; overflow-y: auto; scrollbar-gutter: stable; }
.t-movements-scroll thead th { position: sticky; top: 0; z-index: 2; }
.t-movements-scroll tfoot th { position: sticky; bottom: 0; z-index: 2; background: #f8faf9; border-top: 2px solid #dce5e2; }
@media (max-width: 767.98px) { .t-side:first-child { border-right: 0; border-bottom: 3px solid var(--santuario); } }
.sticky-save { position: sticky; bottom: 1rem; z-index: 20; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border: 1px solid #dce5e2; border-radius: 1rem; padding: 1rem 1.25rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.movement-row { border-left: 4px solid var(--santuario) !important; }
@media (max-width: 575.98px) { .sticky-save { flex-direction: column; align-items: stretch; text-align: center; } }