/* ============================================================
   LIGHT.CSS - Modern Soft Glass SaaS (Light Mode)
   Pastel Cyan + Mint + Lavender, Teal primary, glass surfaces.
   Semua selector di-scope [data-theme="light"] sehingga
   tema dark existing TIDAK terpengaruh sama sekali.
   Dimuat terakhir setelah theme/components/layout/profile.
   ============================================================ */

/* ---------- Body: pastel gradient ---------- */
[data-theme="light"] body {
  background:
    radial-gradient(circle at 10% 20%, rgba(180,225,225,.75), transparent 35%),
    radial-gradient(circle at 90% 10%, rgba(190,190,235,.55), transparent 35%),
    linear-gradient(135deg, #D9E9EA 0%, #E5F1EF 50%, #D9D9F0 100%);
  background-attachment: fixed;
  color: var(--text-body);
}

/* ---------- Sidebar: frosted glass ---------- */
[data-theme="light"] .sidebar {
  background: rgba(245,252,251,.62);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-right: 1px solid rgba(255,255,255,.75);
}
[data-theme="light"] .sidebar-brand { border-bottom: 1px solid rgba(18,130,143,.10); }
[data-theme="light"] .brand-logo {
  color: var(--on-accent);
  background: linear-gradient(135deg, var(--gold-soft) 0%, var(--gold-dim) 100%);
}
[data-theme="light"] .sidebar-footer { border-top: 1px solid rgba(18,130,143,.10); }

/* Menu aktif: gradient teal + teks putih */
[data-theme="light"] .nav-link-app:hover { background: rgba(18,130,143,.07); color: var(--text-strong); }
[data-theme="light"] .nav-link-app.active {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-soft) 100%);
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(18,130,143,.22);
}
[data-theme="light"] .nav-link-app.active svg { color: #FFFFFF; }
[data-theme="light"] .nav-link-app.active::before { display: none; }

/* ---------- Topbar: soft glass ---------- */
[data-theme="light"] .topbar {
  background: rgba(245,252,251,.65);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.75);
}
[data-theme="light"] .icon-btn,
[data-theme="light"] .user-chip {
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.75);
}
[data-theme="light"] .icon-btn:hover { border-color: var(--gold-dim); box-shadow: 0 4px 14px rgba(18,130,143,.14); }
[data-theme="light"] .avatar { color: var(--on-accent); }
[data-theme="light"] .icon-btn .dot { border: 2px solid rgba(245,252,251,.9); }

/* Search dropdown & panel notifikasi: glass */
[data-theme="light"] .search-box,
[data-theme="light"] .notif-panel {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(18,130,143,.12);
  box-shadow: var(--shadow);
}

/* ---------- Cards: white glass ---------- */
[data-theme="light"] .card-app {
  background: rgba(245,252,251,.72);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,.75);
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .spg-card {
  background: rgba(245,252,251,.72);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,.75);
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .spg-card:hover {
  background: rgba(255,255,255,.85);
  border-color: rgba(18,130,143,.22);
  box-shadow: 0 12px 32px rgba(80,120,125,.16);
}
[data-theme="light"] .spg-card-logo {
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(18,130,143,.10);
}

/* ---------- Form: white glass ---------- */
[data-theme="light"] .form-control,
[data-theme="light"] .form-select {
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(18,130,143,.14);
  color: var(--text-body);
}
[data-theme="light"] .form-control:focus,
[data-theme="light"] .form-select:focus {
  background: rgba(255,255,255,.9);
  border-color: var(--gold);
}
[data-theme="light"] .input-group-text {
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(18,130,143,.14);
}
[data-theme="light"] .form-check-input { background-color: #FFFFFF; }

/* ---------- Table: header soft teal ---------- */
[data-theme="light"] .table-app thead th {
  background: rgba(18,130,143,.07);
  color: #4A6365;
  border-bottom: 1px solid rgba(18,130,143,.15);
}
[data-theme="light"] .table-app tbody tr:hover { background: rgba(255,255,255,.7); }

/* DataTables pagination */
[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: var(--gold) !important;
  color: var(--on-accent) !important;
}
[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button {
  background: rgba(255,255,255,.75) !important;
  border: 1px solid rgba(18,130,143,.14) !important;
}
[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
  background: rgba(255,255,255,.4) !important;
  border-color: rgba(18,130,143,.08) !important;
}

/* ---------- Buttons ---------- */
[data-theme="light"] .btn-gold,
[data-theme="light"] .btn-gold:hover { color: var(--on-accent); }
[data-theme="light"] .btn-soft {
  background: rgba(255,255,255,.6);
  border: 1px solid rgba(18,130,143,.12);
  color: var(--text-body);
}
[data-theme="light"] .btn-soft:hover { background: rgba(255,255,255,.9); color: var(--text-strong); }
[data-theme="light"] .view-toggle { background: rgba(255,255,255,.6); }
[data-theme="light"] .view-toggle button.active { color: var(--on-accent); }
[data-theme="light"] .profile-tabs button { background: rgba(255,255,255,.6); }
/* Aktif: gradient teal penuh + teks putih, seperti menu sidebar aktif light */
[data-theme="light"] .profile-tabs button.active {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-soft) 100%);
  color: #FFFFFF;
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(18,130,143,.22);
}
[data-theme="light"] .profile-tabs button.active::before { display: none; }
[data-theme="light"] .ver-source.active { color: var(--on-accent); }

/* ---------- Badges & Alerts ---------- */
[data-theme="light"] .bg-soft-muted { background: rgba(111,133,135,.14); color: var(--text-muted); }
[data-theme="light"] .alert-app.alert-success { color: #4A7020; border-color: rgba(118,173,47,.4); }
[data-theme="light"] .alert-app.alert-danger  { color: #A84356; border-color: rgba(232,121,142,.45); }
[data-theme="light"] .alert-app.alert-info    { color: #3E64A8; border-color: rgba(108,155,232,.45); }
[data-theme="light"] .alert-app.alert-warning { color: #8A4E07; border-color: rgba(217,119,6,.45); }

/* ---------- Modal: glass white, radius besar, shadow kuat ---------- */
[data-theme="light"] .modal-content {
  background: rgba(245,252,251,.94);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.8);
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 60px rgba(80,120,125,.24);
  color: var(--text-body);
}
/* Tombol close (X) default Bootstrap hitam — cukup matikan filter putih */
[data-theme="light"] .btn-close-white { filter: none; opacity: .6; }
/* Utility .text-white Bootstrap (mis. kontak bantuan) tak terbaca di surface terang */
[data-theme="light"] .text-white { color: var(--text-body) !important; }

/* Tooltip peta kategori gold: di light token = teal, teks putih lebih terbaca */
[data-theme="light"] .leaflet-tooltip.pm-tip-gold { color: #FFFFFF; }
[data-theme="light"] .leaflet-tooltip.pm-tip-gold::before { border-top-color: var(--gold); }

/* ---------- Dropdown: white glass ---------- */
[data-theme="light"] .dropdown-menu {
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(18,130,143,.12);
  box-shadow: var(--shadow);
}
[data-theme="light"] .dropdown-item:hover,
[data-theme="light"] .dropdown-item:focus { background: rgba(18,130,143,.07); }
[data-theme="light"] .dropdown-divider { border-color: rgba(18,130,143,.1); }

/* ---------- Bottom nav (mobile): glass ---------- */
[data-theme="light"] .bottom-nav {
  background: rgba(245,252,251,.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid rgba(255,255,255,.8);
}
[data-theme="light"] .bn-item.bn-prominent .bn-ic { color: var(--on-accent); border-color: rgba(245,252,251,.9); }
[data-theme="light"] .bn-item.bn-prominent .bn-ic svg { color: var(--on-accent); }
[data-theme="light"] .bn-menu {
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(18,130,143,.12);
}

/* ---------- Login disclaimer ---------- */
[data-theme="light"] .login-disclaimer {
  background: rgba(245,252,251,.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.75);
}

/* ---------- SweetAlert2 ---------- */
[data-theme="light"] .swal2-popup {
  background: rgba(255,255,255,.97);
  color: var(--text-body);
}
[data-theme="light"] .swal2-title { color: var(--text-strong); }

/* ============================================================
   AUTH (Login) — Soft Glass variant
   ============================================================ */
[data-theme="light"] .auth-wrap {
  background:
    radial-gradient(circle at 12% 18%, rgba(180,225,225,.8), transparent 38%),
    radial-gradient(circle at 88% 8%, rgba(190,190,235,.6), transparent 36%),
    linear-gradient(135deg, #D9E9EA 0%, #E5F1EF 52%, #D9D9F0 100%);
}
[data-theme="light"] .auth-visual {
  background:
    radial-gradient(900px 500px at 15% 10%, rgba(21,151,162,.20), transparent 60%),
    radial-gradient(700px 500px at 90% 90%, rgba(155,140,232,.18), transparent 55%),
    linear-gradient(160deg, #E5F1EF 0%, #D9E9EA 70%);
  border-right: 1px solid rgba(255,255,255,.75);
}
[data-theme="light"] .auth-orb--1 { background: radial-gradient(circle, rgba(21,151,162,.32), transparent 70%); }
[data-theme="light"] .auth-orb--2 { background: radial-gradient(circle, rgba(108,155,232,.26), transparent 70%); }
[data-theme="light"] .auth-orb--3 { background: radial-gradient(circle, rgba(155,140,232,.28), transparent 70%); }
[data-theme="light"] .auth-grid {
  background-image:
    linear-gradient(rgba(18,130,143,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,130,143,.07) 1px, transparent 1px);
}
[data-theme="light"] .auth-shimmer {
  background: linear-gradient(100deg, #12828F 20%, #7FD4DA 40%, #12828F 60%, #08717D 100%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
/* Kartu login: glass card (dark mode tetap tanpa kartu — identitas existing) */
[data-theme="light"] .auth-card {
  background: rgba(245,252,251,.75);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,.8);
  border-radius: 20px;
  padding: 1.9rem 1.6rem;
  box-shadow: 0 18px 45px rgba(80,120,125,.13);
}
[data-theme="light"] .auth-card h3 { color: var(--text-strong); }

/* ---------- Backdrop modal & sidebar tetap gelap (fokus) ---------- */
/* (tidak di-override — rgba hitam default Bootstrap cocok untuk kedua tema) */

/* ---------- Print: paksa warna cetak (light) ---------- */
@media print {
  [data-theme="light"] body { background: #fff !important; }
}