/* ============================================================================
   PANDAI KODE — custom skin untuk Gitea (v28.x, rootless container)
   Identitas visual mengikuti halaman masuk pandai.beltim.go.id.
   Palet & tipografi diambil langsung dari computed style pandai.beltim.go.id:
     --navy #0b2a5b  --navy-dark #081f45  --royal #1f7bff  --cyan #21b8e6
     --teal #2fd4c6  --bg #f6f8fc  --fg #12264a  --muted #5b667a
     --border #e5eaf2  --input #dbe3ef  --accent #e8f3ff
     font "Plus Jakarta Sans Variable", ui-sans-serif, system-ui
   Cakupan (scope): HANYA halaman masuk (.page-content.user.signin) dan
   beranda (.page-content.home). Halaman Gitea lain TIDAK diubah tampilannya.
   Tanpa JavaScript. Aman terhadap CSP (style-src 'self' 'unsafe-inline').
   Ditandai: PANDAI KODE branding (managed)
   ========================================================================== */

:root {
  --pk-navy:#0b2a5b; --pk-navy-dark:#081f45; --pk-royal:#1f7bff;
  --pk-cyan:#21b8e6; --pk-teal:#2fd4c6; --pk-bg:#f6f8fc;
  --pk-card:#ffffff; --pk-fg:#12264a; --pk-muted:#5b667a;
  --pk-border:#e5eaf2; --pk-input:#dbe3ef; --pk-accent:#e8f3ff;
  --pk-success:#16a34a; --pk-radius:14px;
  --pk-font:"Plus Jakarta Sans","Plus Jakarta Sans Variable",ui-sans-serif,system-ui,
            -apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ---------------------------------------------------------------------------
   1. HALAMAN MASUK  (yang dilihat pengguna anonim: REQUIRE_SIGNIN_VIEW=true
      mengalihkan "/" -> "/user/login")
   --------------------------------------------------------------------------- */
body:has(.page-content.user.signin) { background: var(--pk-bg); }
/* Navbar Gitea disembunyikan pada halaman masuk saja; navigasi bukan bagian
   dari pengalaman anonim terbatas. Tidak menyentuh halaman lain. */
body:has(.page-content.user.signin) #navbar { display: none; }

.page-content.user.signin {
  font-family: var(--pk-font);
  color: var(--pk-fg);
  background:
    radial-gradient(1100px 560px at 100% -12%, #eaf3ff 0%, rgba(234,243,255,0) 58%),
    var(--pk-bg);
  min-height: calc(100vh - 1px);
  padding: 48px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pk-auth {
  width: 100%; max-width: 1040px; margin: 0 auto;
  display: grid; grid-template-columns: 1.05fr 0.95fr;
  background: var(--pk-card);
  border: 1px solid var(--pk-border);
  border-radius: 22px; overflow: hidden;
  box-shadow: 0 24px 60px -30px rgba(11,42,91,.35);
}
.pk-auth__aside {
  background: linear-gradient(150deg, var(--pk-navy) 0%, var(--pk-navy-dark) 100%);
  color: #fff; padding: 48px 44px;
  display: flex; flex-direction: column; justify-content: center; gap: 12px;
}
.pk-auth__form {
  padding: 44px 44px; display: flex; flex-direction: column; justify-content: center;
}
.pk-brandmark { width: 56px; height: 56px; margin-bottom: 4px; display: block; }
.pk-eyebrow {
  font-size: 12px; letter-spacing: .22em; text-transform: uppercase;
  font-weight: 700; color: var(--pk-cyan); margin: 0;
}
.pk-eyebrow--form { color: var(--pk-royal); margin: 0 0 6px; }
.pk-wordmark {
  font-size: 40px; line-height: 1.05; font-weight: 800;
  letter-spacing: -.01em; margin: 0; color: #fff;
}
.pk-auth__aside .pk-tagline {
  color: #cfe0ff; font-size: 16px; line-height: 1.55;
  margin: 6px 0 10px; max-width: 34ch;
}
.pk-badges {
  list-style: none; display: flex; flex-wrap: wrap; gap: 8px;
  padding: 0; margin: 8px 0 0;
}
.pk-badges li {
  font-size: 12.5px; font-weight: 600; padding: 7px 12px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08);
  color: #eaf3ff;
}
.pk-badges li::before {
  content: "\25CF"; color: var(--pk-teal); font-size: 9px;
  margin-right: 7px; vertical-align: middle;
}
.pk-formtitle {
  font-size: 26px; font-weight: 800; color: var(--pk-navy);
  margin: 0 0 6px; letter-spacing: -.01em;
}
.pk-formdesc {
  font-size: 14.5px; color: var(--pk-muted); margin: 0 0 18px;
  line-height: 1.6; max-width: 46ch;
}
.pk-footnote {
  font-size: 12.5px; color: var(--pk-muted); line-height: 1.6; margin: 18px 0 0;
}
.pk-help {
  font-size: 12.5px; color: var(--pk-muted); line-height: 1.6; margin: 8px 0 0;
}

/* Kartu form bawaan (dari user/auth/signin_inner) diselaraskan.
   Struktur & field form TIDAK diubah agar alur login tetap utuh. */
.page-content.user.signin .ui.top.attached.header {
  background: transparent; border: none; box-shadow: none;
  color: var(--pk-navy); font-weight: 700; padding: 0 0 4px;
  text-transform: none; font-size: 16px;
}
.page-content.user.signin .ui.attached.segment {
  border: 1px solid var(--pk-border); border-radius: var(--pk-radius);
  box-shadow: none; background: var(--pk-bg); padding: 20px;
}
.page-content.user.signin .ui.form input[type=text],
.page-content.user.signin .ui.form input[type=password],
.page-content.user.signin .ui.form input[type=email] {
  font-family: var(--pk-font); background: #fff;
  border: 1px solid var(--pk-input); border-radius: 10px;
  padding: 12px 14px; color: var(--pk-fg);
}
.page-content.user.signin .ui.form input:focus {
  border-color: var(--pk-royal); box-shadow: 0 0 0 3px rgba(31,123,255,.18);
}
.page-content.user.signin .ui.form label { color: var(--pk-fg); font-weight: 600; }
.page-content.user.signin .ui.primary.button {
  background: var(--pk-navy); border-radius: 10px; font-family: var(--pk-font);
  font-weight: 700; letter-spacing: .01em; padding: 12px 16px;
}
.page-content.user.signin .ui.primary.button:hover,
.page-content.user.signin .ui.primary.button:focus { background: var(--pk-royal); }

/* ---------------------------------------------------------------------------
   2. BERANDA (pengguna sudah masuk)
   --------------------------------------------------------------------------- */
.page-content.home {
  font-family: var(--pk-font); color: var(--pk-fg);
  background:
    radial-gradient(1000px 500px at 50% -12%, #eaf3ff 0%, rgba(234,243,255,0) 62%),
    var(--pk-bg);
}
.pk-home { max-width: 840px; margin: 0 auto; text-align: center; padding: 56px 24px 8px; }
.pk-home .pk-eyebrow { color: var(--pk-royal); }
.pk-home .pk-wordmark { color: var(--pk-navy); font-size: 46px; }
.pk-home .pk-tagline { color: var(--pk-navy); font-size: 19px; font-weight: 600; margin: 10px 0 0; }
.pk-lead { color: var(--pk-muted); font-size: 16px; line-height: 1.7; max-width: 62ch; margin: 16px auto 0; }
.pk-badges--home { justify-content: center; margin-top: 20px; }
.pk-badges--home li { border-color: var(--pk-border); background: var(--pk-accent); color: var(--pk-navy); }
.pk-badges--home li::before { color: var(--pk-royal); }
.pk-features {
  max-width: 1040px; margin: 16px auto 64px; padding: 0 24px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.pk-feature {
  background: #fff; border: 1px solid var(--pk-border); border-radius: var(--pk-radius);
  padding: 22px; box-shadow: 0 10px 30px -24px rgba(11,42,91,.3);
}
.pk-feature h2 { font-size: 17px; font-weight: 800; color: var(--pk-navy); margin: 0 0 6px; }
.pk-feature p { font-size: 14px; color: var(--pk-muted); line-height: 1.65; margin: 0; }

/* ---------------------------------------------------------------------------
   3. Responsif
   --------------------------------------------------------------------------- */
@media (max-width: 880px) {
  .pk-auth { grid-template-columns: 1fr; }
  .pk-auth__aside { padding: 34px 28px; }
  .pk-auth__form { padding: 30px 24px; }
  .pk-features { grid-template-columns: 1fr; }
  .pk-home .pk-wordmark { font-size: 36px; }
}

/* ---------------------------------------------------------------------------
   4. Fallback font mandiri (opsional, CSP-safe).
   Jika ingin Plus Jakarta Sans tanpa memanggil Google Fonts, letakkan file
   variabel di:  <CustomPath>/public/assets/fonts/PlusJakartaSans-Variable.woff2
   lalu hapus komentar di bawah. font-src 'self' sudah mengizinkan berkas ini.
   --------------------------------------------------------------------------- */
/*
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("/assets/fonts/PlusJakartaSans-Variable.woff2") format("woff2-variations");
  font-weight: 200 800; font-style: normal; font-display: swap;
}
*/
