/* =============================================
   Colegio Santa Cecilia – Sistema de Gestión
   ============================================= */

:root {
  --sc-primary: #1a3a5c;
  --sc-primary-dk: #0f2440;
  --sc-primary-lt: #2a5a8c;
  --sc-accent: #d4a017;
  --sc-sidebar-w: 250px;
  --sc-bg: #f0f2f5;
}

/* ── reset ── */
body { font-family:'Segoe UI',system-ui,-apple-system,sans-serif; background:var(--sc-bg); margin:0; }

/* ── topbar mobile ── */
.topbar-mobile {
  background: linear-gradient(135deg, var(--sc-primary-dk), var(--sc-primary));
  padding: .55rem .75rem;
}

/* ── sidebar ── */
.sc-sidebar {
  background: linear-gradient(180deg, var(--sc-primary-dk) 0%, var(--sc-primary) 100%);
  width: var(--sc-sidebar-w);
  min-height: 100vh;
  position: sticky; top:0;
  flex-shrink: 0;
  display: flex; flex-direction: column;
}

.sidebar-brand {
  display:flex; align-items:center; gap:.6rem;
  padding: .85rem 1rem;
  background: rgba(0,0,0,.15);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.sidebar-brand-sub { font-size:.65rem; color:rgba(255,255,255,.45); }

.sidebar-body { flex:1; overflow-y:auto; padding:.25rem 0; }

.sidebar-footer {
  display:flex; align-items:center; gap:.5rem;
  padding: .6rem 1rem;
  background: rgba(0,0,0,.15);
  border-top: 1px solid rgba(255,255,255,.08);
  font-size:.8rem;
}
.sidebar-role { font-size:.6rem; text-transform:uppercase; letter-spacing:.06em; color:rgba(255,255,255,.4); }

/* ── sidebar nav ── */
.sidebar-nav { display:flex; flex-direction:column; }

.sidebar-heading {
  padding: .6rem 1rem .15rem;
  font-size:.6rem; text-transform:uppercase; letter-spacing:.08em;
  color: rgba(255,255,255,.3); font-weight:700;
}

.sidebar-link {
  display:flex; align-items:center; gap:.55rem;
  padding: .42rem 1rem;
  color: rgba(255,255,255,.65); text-decoration:none;
  font-size:.84rem;
  border-left: 3px solid transparent;
  transition: all .12s ease;
}
.sidebar-link:hover {
  color:#fff; background:rgba(255,255,255,.07);
  border-left-color: var(--sc-accent);
}
.sidebar-link.active {
  color:#fff; background:rgba(255,255,255,.1);
  border-left-color: var(--sc-accent); font-weight:600;
}
.sidebar-link i { width:1.1rem; text-align:center; font-size:.92rem; }

/* offcanvas override */
.offcanvas.sc-sidebar { width:var(--sc-sidebar-w); }

/* ── main ── */
.sc-main { min-height:100vh; max-width:100%; overflow-x:hidden; }

/* ── page header ── */
.page-header {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:.5rem; margin-bottom:1.2rem;
}
.page-header h1 { font-size:1.3rem; font-weight:700; color:var(--sc-primary-dk); margin:0; }

/* ── stat cards ── */
.stat-card { border:none; border-radius:.7rem; transition:transform .12s, box-shadow .12s; }
.stat-card:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.08)!important; }
.stat-icon {
  width:46px; height:46px; border-radius:.45rem;
  display:flex; align-items:center; justify-content:center; font-size:1.25rem;
}
.stat-value { font-size:1.55rem; font-weight:700; line-height:1; }
.stat-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.03em; color:#6c757d; }

.bg-primary-soft { background:rgba(26,58,92,.1);  color:var(--sc-primary); }
.bg-success-soft { background:rgba(25,135,84,.1);  color:#198754; }
.bg-warning-soft { background:rgba(255,193,7,.12); color:#b8860b; }
.bg-danger-soft  { background:rgba(220,53,69,.1);  color:#dc3545; }
.bg-info-soft    { background:rgba(13,202,240,.1);  color:#0aa2c0; }
.bg-accent-soft  { background:rgba(212,160,23,.1);  color:var(--sc-accent); }

/* ── cards ── */
.card { border:none; border-radius:.7rem; box-shadow:0 1px 3px rgba(0,0,0,.05); }
.card-header {
  background:transparent; border-bottom:1px solid rgba(0,0,0,.05);
  font-weight:600; font-size:.9rem;
}

/* ── tables ── */
.table { font-size:.85rem; }
.table thead th {
  background:var(--sc-bg); font-weight:600; font-size:.75rem;
  text-transform:uppercase; letter-spacing:.03em; color:#495057;
  border-bottom:2px solid #dee2e6; white-space:nowrap;
}
.table tbody tr:hover { background:rgba(26,58,92,.02); }

/* ── forms ── */
.form-control:focus, .form-select:focus {
  border-color:var(--sc-primary-lt);
  box-shadow:0 0 0 .2rem rgba(26,58,92,.12);
}

/* ── branded buttons ── */
.btn-sc { background:var(--sc-primary); color:#fff; border:none; }
.btn-sc:hover { background:var(--sc-primary-dk); color:#fff; }

/* ── quick-action tiles ── */
.quick-action {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.3rem; padding:.85rem .5rem; border-radius:.65rem;
  background:#fff; border:1px solid #e9ecef;
  text-decoration:none; color:#495057;
  transition:all .12s ease; min-height:86px;
}
.quick-action:hover {
  border-color:var(--sc-primary); color:var(--sc-primary);
  transform:translateY(-2px); box-shadow:0 4px 12px rgba(26,58,92,.08);
}
.quick-action i { font-size:1.4rem; }
.quick-action span { font-size:.72rem; font-weight:600; text-align:center; }

/* ── alerts ── */
.alert { border-radius:.45rem; }

/* ── print ── */
@media print {
  .sc-sidebar, .topbar-mobile, .no-print { display:none!important; }
  .sc-main { margin:0; padding:0; }
}

/* ── responsive ── */
@media (max-width:991.98px) {
  .sc-main { min-height:calc(100vh - 48px); }
}