/* Sistema de Asistencia — ajustes de marca sobre Tabler (https://tabler.io).
   Tabler aporta componentes, espaciado, tablas y modo oscuro; aquí solo
   va la identidad: tipografía, logo y detalles propios. */

:root, [data-bs-theme] {
  --tblr-font-sans-serif: 'Public Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --tblr-sidebar-width: 15.5rem;
}
:root[data-bs-sidebar=folded], [data-bs-sidebar=folded] [data-bs-theme] { --tblr-sidebar-width: 4.5rem; }
.num, .table td.num { font-variant-numeric: tabular-nums; }
.cedula { font-variant-numeric: tabular-nums; letter-spacing: .01em; white-space: nowrap; }

/* ── Marca en la barra lateral ─────────────────────────────────────────── */
.brand-block { display: flex; align-items: center; gap: .75rem; padding: .25rem 0; text-decoration: none; }
.navbar-vertical .brand-block { width: 100%; padding: 1rem 1rem .5rem; justify-content: flex-start !important; }
.brand-logo { width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #fff; object-fit: cover; flex-shrink: 0; }
.brand-text { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.brand-name { font-weight: 700; font-size: 1rem; color: #fff; }
.brand-org { font-size: .75rem; font-weight: 400; color: rgba(255,255,255,.6); }
@media (max-width: 991.98px) { .navbar-vertical .brand-block { width: auto; padding: 0; } .brand-org { display: none; } }

.breadcrumb { margin: 0; }

/* ── Menú contraído: solo iconos ───────────────────────────────────────── */
.nav-cta { gap: .5rem; white-space: nowrap; overflow: hidden; }
@media (min-width: 992px) {
  [data-bs-sidebar=folded] .navbar-vertical .brand-block { justify-content: center !important; padding: 1rem 0 .5rem; }
  [data-bs-sidebar=folded] .navbar-vertical .brand-text { display: none; }
  [data-bs-sidebar=folded] .navbar-vertical .nav-item.px-3 { padding-left: .5rem !important; padding-right: .5rem !important; }
  [data-bs-sidebar=folded] .navbar-vertical .nav-cta { padding-left: 0; padding-right: 0; }
  [data-bs-sidebar=folded] .navbar-vertical .nav-cta .icon { margin: 0; }
  [data-bs-sidebar=folded] .navbar-vertical .nav-cta-text { display: none; }
  [data-bs-sidebar=folded] .navbar-vertical .nav-link { justify-content: center; }
  [data-bs-sidebar=folded] .navbar-vertical .nav-link-icon, [data-bs-sidebar=folded] .navbar-vertical .nav-link-icon .ti { font-size: 1.35rem; width: auto; height: auto; margin: 0; }
  [data-bs-sidebar=folded] .navbar-vertical .brand-logo { width: 2.25rem; height: 2.25rem; }
}
@media (max-width: 991.98px) { :root[data-bs-sidebar=folded], [data-bs-sidebar=folded] [data-bs-theme] { --tblr-sidebar-width: 15.5rem; } .menu-fold { display: none; } }

/* ── Avisos flotantes ──────────────────────────────────────────────────── */
.toast-stack { position: fixed; right: 1rem; bottom: 1rem; z-index: 1090; display: flex; flex-direction: column; gap: .5rem; width: min(400px, calc(100vw - 2rem)); }
.toast-stack .alert { margin: 0; box-shadow: 0 16px 24px rgba(0,0,0,.12); background: var(--tblr-bg-surface); animation: toastIn .18s ease-out; }
.toast-stack .alert.out { opacity: 0; transition: opacity .15s; }
@keyframes toastIn { from { opacity: 0; transform: translateY(6px); } }

/* ── Detalles de componentes ───────────────────────────────────────────── */
.icon-lg { font-size: 2.5rem; line-height: 1; display: inline-block; }
.card-table tr.row-new { animation: rowNew 2.4s ease-out; }
@keyframes rowNew { from { background: var(--tblr-green-lt); } }
.hbar-row { display: grid; grid-template-columns: 7.5rem 1fr 2.5rem; gap: .75rem; align-items: center; padding: .35rem 0; }
.hbar-row .progress { height: .5rem; }
.hbar-row .lbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chart-bars { display: flex; align-items: flex-end; gap: .75rem; height: 9rem; border-bottom: 1px solid var(--tblr-border-color); }
.chart-bars a { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: .25rem; text-decoration: none; min-width: 0; }
.chart-bars .bar { width: 100%; max-width: 3rem; background: var(--tblr-primary); border-radius: 3px 3px 0 0; min-height: 2px; }
.chart-bars a:hover .bar { opacity: .85; }
.chart-bars .val { font-size: .75rem; font-weight: 600; color: var(--tblr-body-color); }
.chart-labels { display: flex; gap: .75rem; margin-top: .4rem; }
.chart-labels span { flex: 1; text-align: center; font-size: .7rem; color: var(--tblr-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.meeting-date { width: 3rem; text-align: center; border: 1px solid var(--tblr-border-color); border-radius: var(--tblr-border-radius); overflow: hidden; flex-shrink: 0; background: var(--tblr-bg-surface); }
.meeting-date .m { font-size: .65rem; font-weight: 700; background: var(--tblr-primary); color: #fff; padding: 1px 0; text-transform: uppercase; }
.meeting-date .d { font-size: 1.15rem; font-weight: 700; line-height: 1.6; }

/* ── Inicio de sesión ──────────────────────────────────────────────────── */
.login-logo { width: 5rem; height: 5rem; border-radius: 50%; object-fit: cover; background: #fff; box-shadow: 0 0 0 1px var(--tblr-border-color); }

/* ── Impresión ─────────────────────────────────────────────────────────── */
.print-header { display: none; }
@media print {
  .page-wrapper { margin: 0 !important; }
  .print-header { display: flex; }
  .card { box-shadow: none !important; border: 0 !important; }
  .card-table td, .card-table th { padding: .3rem .5rem !important; }
}
