/* Identidad institucional U.E. "San Francisco": verde, blanco y franja amarilla */
:root {
  --sf-green: #007d2b; --sf-green-btn: #00873a; --sf-green-dark: #005f22; --sf-yellow: #e9d81f; --sf-bg: #f4f7f5;
  --bs-primary: #007d2b; --bs-primary-rgb: 0, 125, 43;
  --bs-link-color: #007d2b; --bs-link-color-rgb: 0, 125, 43;
  --bs-link-hover-color: #005f22; --bs-link-hover-color-rgb: 0, 95, 34;
}
body.sf-body { background: var(--sf-bg); }

.sf-sticky { position: sticky; top: 0; z-index: 1030; }
.sf-brand { background: var(--sf-green); color: #fff; border-bottom: 4px solid var(--sf-yellow);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .45rem 1rem; }
.sf-brand-link { display: flex; align-items: center; gap: .8rem; color: #fff; text-decoration: none; min-width: 0; flex: 0 1 auto; }
.sf-brand-link > span { min-width: 0; }
.sf-title, .sf-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sf-brand-link:hover { color: #fff; }
.sf-brand-link img { display: block; }
.sf-title { display: block; font-weight: 700; font-size: 1.15rem; line-height: 1.2; }
.sf-sub { display: block; font-size: .75rem; opacity: .95; }
.sf-user { display: flex; align-items: center; gap: .55rem; font-size: .8rem; flex: 0 0 auto; }
.sf-user .sf-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; max-width: 34vw; }
.sf-user .btn { white-space: nowrap; flex-shrink: 0; }
@media (max-width: 575.98px) { .sf-sub { display: none; } .sf-title { font-size: 1rem; } .sf-user .btn { padding: .15rem .45rem; } .sf-brand { padding: .4rem .6rem; } }
.sf-user .sf-salir { color: var(--sf-green-dark); font-weight: 600; }

.sf-nav { background: #fff; border-bottom: 1px solid #dde6e0; padding: 0; }
.sf-nav .nav-link { color: #1f3b2a; font-weight: 500; padding: .7rem 1rem; border-bottom: 3px solid transparent; }
.sf-nav .nav-link:hover { color: var(--sf-green); }
.sf-nav .nav-link.active { color: var(--sf-green); border-bottom-color: var(--sf-green); }
.sf-nav .dropdown-item:active { background: var(--sf-green); }

.btn-primary { --bs-btn-bg: var(--sf-green-btn); --bs-btn-border-color: var(--sf-green-btn);
  --bs-btn-hover-bg: #006e2f; --bs-btn-hover-border-color: #006e2f;
  --bs-btn-active-bg: var(--sf-green-dark); --bs-btn-active-border-color: var(--sf-green-dark);
  --bs-btn-disabled-bg: var(--sf-green-btn); --bs-btn-disabled-border-color: var(--sf-green-btn); }
.btn-outline-primary { --bs-btn-color: var(--sf-green); --bs-btn-border-color: var(--sf-green);
  --bs-btn-hover-bg: var(--sf-green); --bs-btn-hover-border-color: var(--sf-green);
  --bs-btn-active-bg: var(--sf-green-dark); --bs-btn-active-border-color: var(--sf-green-dark); }
.form-control:focus, .form-select:focus { border-color: #4fae6d; box-shadow: 0 0 0 .2rem rgba(0, 125, 43, .18); }
.page-item.active .page-link { background-color: var(--sf-green); border-color: var(--sf-green); }
.page-link { color: var(--sf-green); }

.login-wrap { max-width: 400px; margin: 1.6rem auto 0; text-align: center; }
.login-logo { width: 150px; height: auto; margin-bottom: .6rem; }
.login-title { color: var(--sf-green); font-weight: 700; font-size: 1.45rem; margin: .2rem 0 0; }
.login-sub { color: #5d6f64; font-size: .85rem; margin-bottom: 1rem; }
.login-card { text-align: left; border-radius: .6rem; }

.timeline { list-style: none; padding-left: 0; border-left: 3px solid #007d2b33; margin-left: .5rem; }
.timeline li { position: relative; padding: 0 0 1rem 1.25rem; }
.timeline li::before { content: ""; position: absolute; left: -.55rem; top: .35rem; width: .8rem; height: .8rem; border-radius: 50%; background: var(--sf-green); }
.card-stat .display-6 { font-weight: 600; }
.pre-wrap { white-space: pre-wrap; }

.sf-foot { text-align: center; color: #6b7d72; font-size: .78rem; padding: 1.2rem 0 1.6rem; }
@media print { .sf-sticky, .sf-foot, .no-print { display: none !important; } }

/* Evita desbordes horizontales en pantallas angostas: las tablas se desplazan dentro de su tarjeta */
main .card-body, main [class*="col-"] { overflow-x: auto; }
main > table.table { display: block; overflow-x: auto; }
@media (max-width: 575.98px) { .sf-brand-link img { width: 36px; height: 36px; } .sf-brand-link { gap: .5rem; } .sf-user { gap: .35rem; } }

/* Formulario de asignación a departamentos */
.sf-deps{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.5rem}
.sf-dep{border:1px solid #dfe6e1;border-radius:.4rem;padding:.4rem .6rem;background:#fff}
.sf-dep .form-check-label{font-weight:600;white-space:normal;overflow-wrap:anywhere}
.sf-dep-det{margin-top:.4rem}