/* =====================================================================
   Tema SPK Santri Teladan — identitas MTs Al-Azhar Kota Lubuklinggau
   Hijau madrasah + aksen emas, di atas Bootstrap 5.
   ===================================================================== */

:root {
  --hijau:      #1B5E43;
  --hijau-tua:  #123F2D;
  --hijau-muda: #EAF3EE;
  --emas:       #C9A227;
  --emas-muda:  #FBF3DC;
  --latar:      #F4F7F5;
  --tinta:      #1F2A24;
}

body {
  background: var(--latar);
  color: var(--tinta);
}

/* ---- Warna utama Bootstrap → hijau madrasah -------------------------- */
.btn-primary {
  --bs-btn-bg: var(--hijau);
  --bs-btn-border-color: var(--hijau);
  --bs-btn-hover-bg: var(--hijau-tua);
  --bs-btn-hover-border-color: var(--hijau-tua);
  --bs-btn-active-bg: var(--hijau-tua);
  --bs-btn-active-border-color: var(--hijau-tua);
  --bs-btn-disabled-bg: var(--hijau);
  --bs-btn-disabled-border-color: var(--hijau);
}
.btn-outline-primary {
  --bs-btn-color: var(--hijau);
  --bs-btn-border-color: var(--hijau);
  --bs-btn-hover-bg: var(--hijau);
  --bs-btn-hover-border-color: var(--hijau);
  --bs-btn-active-bg: var(--hijau-tua);
  --bs-btn-active-border-color: var(--hijau-tua);
}
.text-hijau  { color: var(--hijau) !important; }
.bg-hijau    { background-color: var(--hijau) !important; }
.text-emas   { color: var(--emas) !important; }
a            { color: var(--hijau); }
.form-control:focus, .form-select:focus {
  border-color: var(--hijau);
  box-shadow: 0 0 0 .2rem rgba(27, 94, 67, .15);
}

/* ---- Kerangka halaman ------------------------------------------------- */
.sidebar {
  --bs-offcanvas-width: 264px;
  width: 264px;
  flex-shrink: 0;
  background: linear-gradient(180deg, var(--hijau) 0%, var(--hijau-tua) 100%);
  color: #fff;
}
@media (min-width: 992px) {
  .sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; }
}
.sidebar-brand {
  padding: 1.1rem 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.brand-nama     { font-weight: 700; letter-spacing: .01em; }
.brand-instansi { color: rgba(255, 255, 255, .65); font-size: .72rem; }

.sidebar-heading {
  padding: 1rem 1.25rem .35rem;
  font-size: .68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255, 255, 255, .45);
}
.sidebar .nav-link {
  color: rgba(255, 255, 255, .78);
  padding: .55rem 1.25rem;
  border-left: 3px solid transparent;
  font-size: .92rem;
}
.sidebar .nav-link:hover  { color: #fff; background: rgba(255, 255, 255, .06); }
.sidebar .nav-link.active {
  color: #fff;
  background: rgba(255, 255, 255, .1);
  border-left-color: var(--emas);
  font-weight: 600;
}

.main-area { min-width: 0; }
.topbar {
  height: 62px;
  background: #fff;
  border-bottom: 1px solid #E3E9E5;
}
.topbar .avatar {
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: var(--hijau-muda);
  color: var(--hijau);
  font-size: 1.1rem;
}
.content { padding: 1.5rem; }
@media (min-width: 992px) { .content { padding: 1.75rem 2rem; } }
.app-footer { border-top: 1px solid #E3E9E5; background: #fff; }

/* ---- Kartu & tabel ----------------------------------------------------- */
.card {
  border: none;
  border-radius: .75rem;
  box-shadow: 0 1px 3px rgba(18, 63, 45, .08);
}
.card-header {
  background: #fff;
  border-bottom: 1px solid #EDF1EE;
  border-radius: .75rem .75rem 0 0 !important;
  font-weight: 600;
}
.table thead th {
  background: var(--hijau-muda);
  color: var(--hijau-tua);
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}
.table td { vertical-align: middle; }

/* Kartu statistik dashboard */
.stat-ikon {
  width: 48px; height: 48px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: .75rem;
  font-size: 1.4rem;
  background: var(--hijau-muda);
  color: var(--hijau);
}
.stat-ikon.emas { background: var(--emas-muda); color: var(--emas); }

/* Sorotan peringkat 1 — Santri Teladan */
.baris-teladan td { background: var(--emas-muda) !important; font-weight: 600; }
.badge-teladan {
  background: var(--emas);
  color: #fff;
}

/* ---- Matriks perbandingan berpasangan (modul bobot) -------------------- */
.tabel-matriks input.form-control { width: 100px; margin-inline: auto; text-align: center; }
.tabel-matriks td, .tabel-matriks th { text-align: center; vertical-align: middle; }
.tabel-matriks .sel-diagonal { background: var(--hijau-muda); font-weight: 600; }
.tabel-matriks .sel-kebalikan { color: #6c757d; font-style: italic; }

/* ---- Halaman login ------------------------------------------------------ */
.login-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 1rem;
  background:
    radial-gradient(1000px 500px at 85% -10%, rgba(201, 162, 39, .25), transparent 60%),
    radial-gradient(800px 500px at -10% 110%, rgba(255, 255, 255, .08), transparent 55%),
    linear-gradient(160deg, var(--hijau) 0%, var(--hijau-tua) 100%);
}
.login-card { width: 100%; max-width: 420px; border-radius: 1rem; }
.login-logo { width: 76px; height: 76px; }

/* ---- Lain-lain ----------------------------------------------------------- */
.spinner-border-sm { vertical-align: -.125em; }
.dataTables_wrapper .dt-search input { min-width: 200px; }