/* ============================================================================
   Excellent Group — Self-Service Password (kagi) — tema elegan/profesional.
   Dimuat via $custom_css (paling akhir → override default LTB & Bootstrap).
   ========================================================================== */
:root{
  --eg-navy:#0f2c5c;
  --eg-navy-2:#1a4488;
  --eg-blue:#1b63c9;
  --eg-gold:#c4a14e;
  --eg-ink:#1f2937;
  --eg-muted:#6b7280;
  --eg-line:#e6e9f0;
}

*{ box-sizing:border-box; }

body{
  min-height:100vh;
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color:var(--eg-ink);
  background:
    linear-gradient(180deg, rgba(8,15,26,.60), rgba(8,15,26,.84)),
    url("bg.webp") center / cover no-repeat fixed,
    #0b1220;
  display:flex; align-items:center; justify-content:center;
  padding:36px 16px;
}

/* header.tpl & menu.tpl membungkus dengan .container — pusatkan & ramping */
body > .container{ max-width:468px; width:100%; padding:0; }
.card .container, .card .container-fluid{ max-width:none; padding:0; margin:0; }

/* ---------- Kartu ---------- */
.card{
  border:0 !important;
  border-radius:18px !important;
  background:#fff !important;
  box-shadow:0 28px 70px rgba(3,10,28,.50), 0 2px 8px rgba(3,10,28,.20) !important;
  overflow:hidden;
}
.card-body{ padding:30px 30px 26px !important; }

/* ---------- Brand / navbar (menu.tpl) ---------- */
.navbar{
  background:transparent !important;
  box-shadow:none !important;
  padding:0 0 16px !important;
  margin-bottom:20px;
  border-bottom:1px solid var(--eg-line);
}
.navbar-brand{
  display:flex; align-items:center; gap:11px;
  font-weight:700; font-size:1.04rem; line-height:1.2;
  color:var(--eg-navy) !important; letter-spacing:.2px;
  padding:0 !important; margin:0 !important; white-space:normal;
}
.navbar-brand .menu-logo{ height:38px; width:38px; flex:0 0 auto; }
.navbar-toggler{ display:none !important; }
.navbar-nav{ gap:6px; margin-top:14px; }
.navbar-nav .nav-link{
  color:var(--eg-muted) !important;
  font-weight:600; font-size:.9rem;
  border-radius:9px; padding:7px 14px !important;
  transition:background .15s ease, color .15s ease;
}
.navbar-nav .nav-link:hover{ background:#f1f4f9; color:var(--eg-navy) !important; }
.navbar-nav .nav-link.active{ background:var(--eg-navy) !important; color:#fff !important; }

/* logo terpusat (mode tanpa menu) */
.logo{ max-height:66px; margin:6px auto 14px !important; }
.title.alert{ background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 0 4px !important; }
.title.alert h1{ color:var(--eg-navy); font-size:1.35rem; font-weight:700; margin:0; }

/* ---------- Kotak form (alert-info) → datar/bersih ---------- */
.alert{ border-radius:12px; }
/* Kotak pembungkus form (.alert-info) dibikin datar; pesan hasil
   (.result.alert-info) di-recolor lagi di bawah (specificity lebih tinggi). */
.alert-info, form{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:var(--eg-ink) !important;
  padding:0 !important;
  margin-bottom:0 !important;
}

/* label & input */
.col-form-label{ font-weight:600; color:#374151; }
.form-control{
  border:1px solid var(--eg-line);
  border-radius:10px;
  padding:.62rem .8rem; font-size:.95rem;
  box-shadow:none;
}
.form-control::placeholder{ color:#9aa3b2; }
.form-control:focus{
  border-color:var(--eg-blue);
  box-shadow:0 0 0 3px rgba(27,99,201,.16);
}
.input-group-text{
  background:#f5f8fd; border:1px solid var(--eg-line); border-right:0;
  color:var(--eg-muted); border-radius:10px 0 0 10px;
}
.input-group .form-control{ border-left:0; }
.password-toggle-icon{ border-radius:0 10px 10px 0 !important; border-left:0; cursor:pointer; background:#f5f8fd; }

/* ---------- Tombol ---------- */
.btn-success, .btn-primary{
  background:linear-gradient(180deg,var(--eg-navy-2),var(--eg-navy)) !important;
  border:0 !important; border-radius:10px !important;
  font-weight:600 !important; padding:.62rem 1.5rem !important;
  box-shadow:0 6px 16px rgba(15,44,92,.30) !important;
  transition:transform .12s ease, box-shadow .12s ease;
}
.btn-success:hover, .btn-primary:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(15,44,92,.40) !important; }
.btn-success:active{ transform:translateY(0); }

/* ---------- Bantuan / hasil / kebijakan ---------- */
.result.alert, .ppolicy.alert{ border-radius:12px; font-size:.92rem; }
.alert-warning{ background:#fbfaf3 !important; border:1px solid #ece3c7 !important; color:#5a4d24 !important; }
.result.alert-success{ background:#edfaf2 !important; border:1px solid #bce6ce !important; color:#1b6b3e !important; }
.result.alert-danger{ background:#fdeeee !important; border:1px solid #f3c4c4 !important; color:#9b2c2c !important; }
.result.alert-info{ background:#eef4fd !important; border:1px solid #c7dcf5 !important; color:#1b4f9c !important; }
.ppolicy ul{ margin-bottom:0; }
.ppolicy li{ margin:.22rem 0; }
.text-success{ color:#1c8a4d !important; }
.text-danger{ color:#c0392b !important; }
#entropybar{ height:8px; border-radius:6px; margin-top:6px; }

/* ---------- Footer ---------- */
#footer{
  text-align:center; margin-top:18px;
  color:rgba(255,255,255,.78); font-size:.8rem;
  text-shadow:0 1px 3px rgba(0,0,0,.55);
}

@media (max-width:520px){
  .card-body{ padding:22px 18px !important; }
  .col-form-label{ text-align:left !important; }
}
