/* GPMF FKIP UNSA — Panel Admin */
:root{
  --ink:#0C2A78; --ink-2:#143BA0; --teal:#1B4AD1; --teal-700:#10309A;
  --gold:#D42017; --gold-soft:#FF8A79; --gold-deep:#A5150C;
  --sky:#6FCFEE; --sky-soft:#BEE9F8;
  --paper:#FBFDFF; --slate:#1B2A4A; --muted:#5A6B8C; --line:#E1E8F2;
  --sidebar:#0C2A78; --bg:#EEF3FA;
  --font-display:"Fraunces",Georgia,serif;
  --font-body:"Plus Jakarta Sans",system-ui,sans-serif;
}
body.admin{ font-family:var(--font-body); background:var(--bg); color:var(--slate); }

/* ---- Login ---- */
.login-wrap{
  min-height:100vh; display:grid; place-items:center; padding:1.5rem;
  background:
    radial-gradient(900px 400px at 80% -10%, rgba(18,112,126,.5), transparent 60%),
    linear-gradient(165deg,#0C2A78,#143BA0 60%,#0A2470);
}
.login-card{
  width:100%; max-width:410px; background:#fff; border-radius:20px;
  box-shadow:0 24px 60px rgba(5,25,30,.4); overflow:hidden;
}
.login-card .head{
  padding:1.6rem 1.75rem 1.2rem; border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#fff,#f2f7fd);
}
.login-badge{
  width:52px;height:52px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(160deg,var(--ink),var(--teal-700));
  color:var(--gold-soft);font-family:var(--font-display);font-weight:600;font-size:1.15rem;
}
.login-card .body{ padding:1.5rem 1.75rem 1.9rem; }

/* ---- Layout ---- */
.admin-shell{ display:flex; min-height:100vh; }
.sidebar{
  width:264px; flex:0 0 264px; background:var(--sidebar); color:#cfe0e3;
  position:fixed; inset:0 auto 0 0; height:100vh; overflow-y:auto; z-index:1040;
  transition:transform .25s ease;
}
.sidebar .brand{ padding:1.25rem 1.25rem; border-bottom:1px solid rgba(255,255,255,.08); }
.sidebar .brand .badge-sq{
  width:40px;height:40px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(160deg,var(--teal),var(--teal-700));color:var(--gold-soft);
  font-family:var(--font-display);font-weight:600;
}
.sidebar .nav-section{ font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:#93A9D8; padding:1.1rem 1.35rem .4rem; }
.sidebar a.snav{
  display:flex; align-items:center; gap:.75rem; padding:.62rem 1.35rem;
  color:#C3D2EE; text-decoration:none; font-size:.94rem; font-weight:500;
  border-left:3px solid transparent;
}
.sidebar a.snav i{ font-size:1.05rem; width:20px; text-align:center; }
.sidebar a.snav:hover{ background:rgba(255,255,255,.05); color:#fff; }
.sidebar a.snav.active{ background:rgba(255,255,255,.10); color:#fff; border-left-color:var(--gold); }

.main{ margin-left:264px; flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar{
  background:#fff; border-bottom:1px solid var(--line); padding:.7rem 1.25rem;
  position:sticky; top:0; z-index:1030; display:flex; align-items:center; justify-content:space-between;
}
.topbar h1{ font-size:1.15rem; margin:0; font-family:var(--font-display); color:var(--ink); font-weight:600; }
.content{ padding:1.5rem; flex:1; }

.backdrop{ display:none; position:fixed; inset:0; background:rgba(10,43,52,.5); z-index:1035; }
@media (max-width: 991.98px){
  .sidebar{ transform:translateX(-100%); }
  .sidebar.open{ transform:translateX(0); }
  .main{ margin-left:0; }
  .backdrop.show{ display:block; }
}

/* ---- Kartu statistik ---- */
.stat-card{
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:1.2rem 1.25rem;
  box-shadow:0 1px 2px rgba(10,43,52,.04); height:100%;
}
.stat-card .ic{ width:46px;height:46px;border-radius:12px;display:grid;place-items:center;color:#fff;font-size:1.25rem; }
.stat-card .num{ font-family:var(--font-display); font-size:1.9rem; font-weight:600; color:var(--ink); line-height:1; }
.stat-card .lbl{ color:var(--muted); font-size:.85rem; }

/* ---- Kartu umum ---- */
.card-soft{ background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 1px 2px rgba(10,43,52,.04); }
.card-soft .card-head{ padding:1rem 1.25rem; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.card-soft .card-head h2{ font-size:1.05rem; margin:0; font-family:var(--font-display); color:var(--ink); font-weight:600; }
.card-soft .card-body-p{ padding:1.25rem; }

/* ---- Tabel ---- */
.table thead th{ font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); border-bottom:2px solid var(--line); font-weight:700; }
.table td{ vertical-align:middle; }
.table td .lnk-title{ font-weight:600; color:var(--ink); }
.table td .lnk-url{ font-size:.8rem; color:var(--muted); word-break:break-all; }

/* ---- Badge ---- */
.chip{ font-size:.72rem; font-weight:700; padding:.18rem .55rem; border-radius:999px; display:inline-block; }
.chip.on{ background:#E6F0FF; color:#10309A; }
.chip.off{ background:#FDE3E0; color:#A5150C; }
.chip.ganjil{ background:#E6F0FF; color:#10309A; }
.chip.genap{ background:#EAF7FD; color:#0F6E8C; }
.chip.neutral{ background:#EEF3FA; color:#5A6B8C; }

/* ---- Tombol tema ---- */
.btn-ink{ background:var(--ink); border-color:var(--ink); color:#fff; }
.btn-ink:hover{ background:var(--ink-2); border-color:var(--ink-2); color:#fff; }
.btn-gold{ background:linear-gradient(160deg,var(--gold-soft),var(--gold)); border:1px solid var(--gold-deep); color:#fff; font-weight:600; }
.btn-gold:hover{ filter:brightness(1.06); color:#fff; }
.btn-teal{ background:var(--teal); border-color:var(--teal); color:#fff; }
.btn-teal:hover{ background:var(--teal-700); border-color:var(--teal-700); color:#fff; }

.form-label{ font-weight:600; font-size:.88rem; color:var(--slate); }
.form-control:focus,.form-select:focus{ border-color:var(--teal); box-shadow:0 0 0 .2rem rgba(18,112,126,.15); }

:focus-visible{ outline:3px solid var(--gold-soft); outline-offset:2px; }

.help-text{ font-size:.8rem; color:var(--muted); }
.page-title-sub{ color:var(--muted); font-size:.9rem; }

/* ---- Logo institusi ---- */
.login-logo{
  width:72px; height:72px; object-fit:contain;
  background:#fff; border-radius:16px; padding:6px;
  box-shadow:0 6px 20px rgba(10,43,52,.18);
}
.sidebar .brand .sidebar-logo{
  width:42px; height:42px; object-fit:contain;
  background:#fff; border-radius:11px; padding:3px; flex:0 0 auto;
}