/* =====================================================
   AMBALAJ CMS THEME (LIGHT/DARK) - CLEAN & STABLE
   ===================================================== */

:root{
  --primary:#2563eb;
  --primary-hover:#1d4ed8;
  --accent:#f59e0b;
  --radius:18px;
  --shadow-soft:0 10px 30px rgba(2,6,23,.08);
}

/* ---------- DARK (default) ---------- */
[data-theme="dark"]{
  --bg:#0b1220;
  --surface:#111827;
  --surface-2:#1f2937;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --border:rgba(255,255,255,.08);
}

/* ---------- LIGHT ---------- */
[data-theme="light"]{
  --bg:#f6f7fb;
  --surface:#ffffff;
  --surface-2:#f1f5f9;
  --text:#0f172a;
  --muted:#475569;
  --border:rgba(15,23,42,.12);
}

body{
  background:var(--bg) !important;
  color:var(--text) !important;
}

/* ================= TOPBAR ================= */
.topbar{
  position:relative;
  z-index:2000;
  border-bottom:1px solid var(--border);
  background:var(--surface);
}
.topbar a, .topbar span, .topbar i, .topbar svg{
  color:var(--text) !important;
  opacity:1 !important;
}

/* subtle premium band in light theme */
[data-theme="light"] .topbar::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:3px;
  background:linear-gradient(90deg,#2563eb,#60a5fa,#f59e0b);
}

/* ================= NAVBAR ================= */
.navbar{
  position:sticky;
  top:0;
  z-index:2500;
  background:var(--surface) !important;
  border-bottom:1px solid var(--border);
  overflow:visible !important;
  transition:padding .25s ease, box-shadow .25s ease, background .25s ease;
  padding-top:.65rem;
  padding-bottom:.65rem;
}

.navbar.is-scrolled{
  padding-top:.35rem;
  padding-bottom:.35rem;
  box-shadow:0 10px 30px rgba(2,6,23,.10);
}

/* blur on scroll */
[data-theme="light"] .navbar.is-scrolled{
  background:rgba(255,255,255,.72) !important;
  backdrop-filter:blur(10px);
}
[data-theme="dark"] .navbar.is-scrolled{
  background:rgba(17,24,39,.65) !important;
  backdrop-filter:blur(10px);
}

/* nav links readable in both themes */
.navbar .nav-link{
  color:var(--text) !important;
  font-weight:500;
  position:relative;
  padding:.75rem .9rem;
  opacity:1 !important;
  transition:color .2s ease;
}
.navbar .nav-link:hover{ color:var(--primary) !important; }
.navbar .nav-link.active{ color:var(--primary-hover) !important; font-weight:600; }

/* underline animation */
.navbar .nav-link::after{
  content:"";
  position:absolute;
  left:.9rem; right:.9rem;
  bottom:.35rem;
  height:2px;
  border-radius:999px;
  background:var(--primary);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
  opacity:.95;
}
.navbar .nav-link:hover::after{ transform:scaleX(1); }
.navbar .nav-link.active::after{ transform:scaleX(1); }

/* ================= HERO ================= */
.hero, .hero-section{
  border-radius:var(--radius);
}
[data-theme="light"] .hero, [data-theme="light"] .hero-section{
  background:radial-gradient(1200px 600px at 20% 20%,#ffffff 0%,#f1f5ff 40%,#f6f7fb 100%) !important;
}
[data-theme="dark"] .hero, [data-theme="dark"] .hero-section{
  background:radial-gradient(1200px 600px at 20% 20%,#1f2937 0%,#0b1220 60%) !important;
}

/* hero inner card - always theme surface */
.hero .card, .hero .hero-card, .hero .content-box{
  background:var(--surface) !important;
  color:var(--text) !important;
  opacity:1 !important;
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:0 20px 40px rgba(0,0,0,.12);
}

/* ================= CARDS ================= */
.card, .feature-card, .info-card{
  background:var(--surface) !important;
  border:1px solid var(--border) !important;
  border-radius:var(--radius) !important;
  box-shadow:var(--shadow-soft) !important;
  color:var(--text) !important;
  opacity:1 !important;
}
.card p, .feature-card p, .info-card p{ color:var(--muted) !important; }

/* ================= BUTTONS ================= */
.btn-primary{
  background:var(--primary) !important;
  border-color:var(--primary) !important;
}
.btn-primary:hover{
  background:var(--primary-hover) !important;
  border-color:var(--primary-hover) !important;
}
.btn-warning, .btn-accent{
  background:var(--accent) !important;
  border-color:var(--accent) !important;
  color:#111827 !important;
}

/* ================= FORMS ================= */
input, textarea, select, .form-control{
  background:var(--surface) !important;
  color:var(--text) !important;
  border:1px solid var(--border) !important;
}
input::placeholder, textarea::placeholder{ color:var(--muted) !important; }

/* ================= DROPDOWN (GENERAL) ================= */
.dropdown-menu{
  z-index:99999 !important;
}