/* ===== Frontend Theme (Light/Dark) ===== */
:root{
  --acc:#3b82f6;
  --txt:#0f172a;
  --muted:#64748b;
  --bg:#f7f9fc;
  --panel:#ffffff;
  --line:rgba(15,23,42,.08);
  --chip:#eef2ff;
}

html.theme-dark{
  --acc:#60a5fa;
  --txt:#e5e7eb;
  --muted:#9ca3af;
  --bg:#0b0f16;
  --panel:#121826;
  --line:rgba(148,163,184,.12);
  --chip:#1f2937;
}

body{
  background: var(--bg);
  color: var(--txt);
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

/* Navbar */
.front-nav{
  background: linear-gradient(90deg,var(--panel),var(--panel));
  border-bottom: 1px solid var(--line);
}
.brand {
  font-weight:700; letter-spacing:.3px;
}
.theme-toggle{
  border:1px solid var(--line);
  background:transparent;
  color:var(--txt);
}
.theme-toggle:hover{ background: var(--chip); }

/* Cards & containers */
.card{
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 6px 24px rgba(0,0,0,.06);
}
.section-title{
  font-weight:700; letter-spacing:.2px;
}

/* Inputs */
.form-control{
  background: transparent;
  color: var(--txt);
  border:1px solid var(--line);
}
.form-control::placeholder { color: var(--muted); opacity:.8; }
.form-control:focus{
  box-shadow:none;
  border-color: var(--acc);
}

/* Buttons */
.btn-primary{
  background: var(--acc); border-color: var(--acc);
}
.btn-outline{
  border:1px solid var(--line);
  color: var(--txt);
}
.btn-outline:hover{ background: var(--chip); }

/* List group jadwal */
.list-group-item{
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 12px !important;
  margin-bottom: .65rem;
  padding: 1rem 1.25rem;
}
.badge-chip{
  background: var(--chip);
  color: var(--txt);
  border:1px solid var(--line);
  padding:.25rem .5rem;
  border-radius:999px;
  font-size:.75rem;
}

.price{
  font-weight:800;
  font-size:1.15rem;
}
.bank-line + hr:last-of-type { display:none; }

.hr-soft{ border-color: var(--line); }

/* Hero */
.hero{
  background: radial-gradient(1200px 400px at 10% -10%, rgba(59,130,246,.25), transparent 60%),
              radial-gradient(900px 300px at 90% -10%, rgba(139,92,246,.2), transparent 60%);
  border:1px solid var(--line);
  border-radius: 18px;
}

/* Small helper */
.text-muted{ color: var(--muted) !important; }