/* ==========================================================================
   GRIYA SAS RESIDENCE - Theme Overlay (final, appended last)
   Tujuan: mengubah TAMPILAN LUAR (warna, judul, login, sidebar brand, loader)
   TANPA menyentuh tampilan notif, pemberitahuan, card edit/hapus, dan
   struktur input existing.
   Palet baru: Emerald Deep + Amber Gold Luxe (berbeda dari tema IMP lama).
   ========================================================================== */

:root {
  --gsr-emerald-950:#032b25;
  --gsr-emerald-900:#053f36;
  --gsr-emerald-800:#0a5f52;
  --gsr-emerald-700:#0f7f6c;
  --gsr-emerald-500:#10b981;
  --gsr-emerald-300:#6ee7b7;
  --gsr-emerald-100:#d1fae5;

  --gsr-gold-700:#a26a12;
  --gsr-gold-500:#d4a24b;
  --gsr-gold-400:#e6bf6a;
  --gsr-gold-200:#f7e2b0;

  --gsr-ink-950:#0b1420;
  --gsr-ink-900:#101b2b;
  --gsr-ink-700:#243244;
  --gsr-ink-500:#4b5a70;
  --gsr-ink-300:#94a2b6;
  --gsr-mist:#f5f7fb;
  --gsr-mist-2:#eef2f7;
}

/* ---------- LOADER ---------- */
.glass-loader-overlay { background: radial-gradient(circle at 20% 20%, rgba(16,185,129,.18), transparent 40%), radial-gradient(circle at 80% 80%, rgba(212,162,75,.14), transparent 45%), linear-gradient(135deg,#04241f 0%,#0b1420 55%,#02110d 100%) !important; }
.loader-card-box.loader-v43-card { background: linear-gradient(180deg,#0b2b25,#052018) !important; border:1px solid rgba(110,231,183,.22) !important; box-shadow:0 30px 70px rgba(2,15,10,.55), inset 0 1px 0 rgba(255,255,255,.05) !important; }
.loader-v43-mark i { color:var(--gsr-gold-400) !important; }
.loader-v43-title.gsr-loader-title, .loader-v43-title { color:#eaf7f1 !important; letter-spacing:.6px !important; font-weight:800 !important; font-family:'Space Grotesk',sans-serif !important; }
.loader-v43-bar { background: rgba(255,255,255,.08) !important; }
.loader-v43-bar b { background: linear-gradient(90deg,var(--gsr-emerald-500),var(--gsr-gold-400)) !important; }

/* ---------- LOGIN GATEWAY (redesain penuh) ---------- */
#paneLoginGateway.login-clean-v2,
#paneLoginGateway.login-universe {
  background:
    radial-gradient(circle at 12% 18%, rgba(16,185,129,.28), transparent 32%),
    radial-gradient(circle at 88% 78%, rgba(212,162,75,.22), transparent 32%),
    radial-gradient(circle at 50% 50%, rgba(110,231,183,.08), transparent 55%),
    linear-gradient(135deg,#02100c 0%,#052018 45%,#0b1420 100%) !important;
}
#paneLoginGateway .v57-login-orb.orb-a { background: radial-gradient(circle, rgba(16,185,129,.55), transparent 65%) !important; }
#paneLoginGateway .v57-login-orb.orb-b { background: radial-gradient(circle, rgba(212,162,75,.45), transparent 65%) !important; }
#paneLoginGateway .v57-login-scan { background: linear-gradient(115deg, transparent 0%, rgba(110,231,183,.20) 45%, transparent 60%) !important; }

#paneLoginGateway .login-card-vault.login-clean-card {
  width:100% !important;
  max-width:440px !important;
  padding:34px 32px 30px !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(212,162,75,.22), transparent 42%),
    radial-gradient(circle at 12% 92%, rgba(16,185,129,.28), transparent 46%),
    radial-gradient(circle at 50% 50%, rgba(110,231,183,.10), transparent 60%),
    linear-gradient(160deg,#0b3a30 0%,#0a2a24 45%,#08141f 100%) !important;
  border:1px solid rgba(212,162,75,.32) !important;
  box-shadow:
    0 30px 80px rgba(2,20,15,.55),
    0 2px 0 rgba(212,162,75,.35) inset,
    0 -2px 0 rgba(16,185,129,.28) inset,
    0 0 0 1px rgba(255,255,255,.04) inset !important;
  color:#eafaf2 !important;
  position:relative;
  overflow:hidden;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
#paneLoginGateway .login-card-vault.login-clean-card::before {
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(115deg, transparent 0%, rgba(255,255,255,.06) 45%, transparent 65%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 44px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 44px);
  pointer-events:none;
  mix-blend-mode: screen;
}
#paneLoginGateway .login-card-vault.login-clean-card::after {
  content:"";
  position:absolute; left:-1px; right:-1px; top:-1px; height:2px;
  background: linear-gradient(90deg, transparent, rgba(212,162,75,.75), rgba(16,185,129,.6), transparent);
  pointer-events:none;
}

#paneLoginGateway .login-v36-badge, #paneLoginGateway .gsr-badge {
  display:inline-flex !important; align-items:center; gap:6px;
  font-size:.72rem !important; font-weight:800 !important; letter-spacing:.5px !important;
  padding:6px 12px !important; border-radius:999px !important;
  background: linear-gradient(135deg, rgba(16,185,129,.20), rgba(212,162,75,.18)) !important;
  color:#f7e2b0 !important;
  border:1px solid rgba(212,162,75,.35) !important;
  box-shadow:0 6px 14px rgba(2,20,15,.35), inset 0 1px 0 rgba(255,255,255,.08) !important;
  margin-bottom:14px !important;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}
#paneLoginGateway .gsr-badge i { color:var(--gsr-gold-400) !important; }

#paneLoginGateway .login-clean-logo.gsr-logo, #paneLoginGateway .login-clean-logo {
  position:relative !important;
  width:82px !important; height:82px !important;
  margin:0 auto 16px !important;
  border-radius:24px !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,.35), transparent 45%),
    conic-gradient(from 220deg at 50% 50%, #d4a24b, #10b981, #0f7f6c, #d4a24b) !important;
  color:#ffffff !important;
  font-size:1.9rem !important;
  box-shadow:
    0 22px 40px rgba(6,60,46,.45),
    0 0 0 1px rgba(255,255,255,.15) inset,
    0 0 24px rgba(212,162,75,.35) !important;
  border:1px solid rgba(255,255,255,.35) !important;
  overflow:hidden !important;
}
#paneLoginGateway .gsr-logo .gsr-logo-ring {
  position:absolute; inset:6px;
  border-radius:18px;
  border:1px dashed rgba(255,255,255,.55);
  box-shadow: inset 0 0 12px rgba(0,0,0,.18);
  pointer-events:none;
}
#paneLoginGateway .gsr-logo .gsr-logo-mono {
  position:relative; z-index:2;
  font-family:'Space Grotesk', sans-serif;
  font-weight:900;
  font-size:1.65rem;
  letter-spacing:-1px;
  color:#ffffff;
  text-shadow:
    0 2px 6px rgba(0,0,0,.35),
    0 0 1px rgba(255,255,255,.6);
  background: linear-gradient(180deg,#ffffff 0%,#ffe9b8 65%,#f4c766 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
#paneLoginGateway .gsr-logo .gsr-logo-icon {
  position:absolute;
  right:6px; bottom:4px;
  z-index:3;
  font-size:.7rem !important;
  width:20px; height:20px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  background: linear-gradient(135deg,#032b25,#0a5f52);
  color:#f7e2b0 !important;
  border:1px solid rgba(247,226,176,.55);
  box-shadow:0 4px 10px rgba(0,0,0,.35);
}

#paneLoginGateway .login-clean-title.gsr-title, #paneLoginGateway .login-clean-title {
  font-family:'Space Grotesk',sans-serif !important;
  font-size:1.9rem !important;
  font-weight:900 !important;
  letter-spacing:-.8px !important;
  line-height:1.05 !important;
  background: linear-gradient(120deg,#ffffff 0%,#ffe9b8 55%,#f4c766 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  color:transparent !important; -webkit-text-fill-color:transparent !important;
  text-shadow:0 2px 12px rgba(212,162,75,.25) !important;
}

#paneLoginGateway .login-clean-subtitle.gsr-subtitle, #paneLoginGateway .login-clean-subtitle {
  color:rgba(234,250,242,.72) !important;
  font-size:.82rem !important; font-weight:600 !important;
  letter-spacing:.2px !important; margin-top:8px !important;
}

#paneLoginGateway .login-clean-label {
  color:#f7e2b0 !important;
  font-weight:800 !important; font-size:.72rem !important;
  letter-spacing:.9px !important; text-transform:uppercase !important;
  margin-bottom:6px !important;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}

#paneLoginGateway .login-clean-input-wrap {
  position:relative;
  background: rgba(255,255,255,.06) !important;
  border:1px solid rgba(212,162,75,.30) !important;
  border-radius:14px !important;
  padding:2px 12px 2px 40px !important;
  box-shadow:0 6px 16px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.08) !important;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
#paneLoginGateway .login-clean-input-wrap:focus-within {
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(212,162,75,.65) !important;
  box-shadow:0 8px 22px rgba(0,0,0,.30), 0 0 0 3px rgba(16,185,129,.25) !important;
}
#paneLoginGateway .login-clean-input-wrap > i {
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  color:#f7e2b0 !important;
  font-size:.95rem;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}
#paneLoginGateway .login-cyber-input.login-clean-input {
  color:#ffffff !important;
  background:transparent !important;
  border:none !important; box-shadow:none !important;
  padding:12px 4px !important;
  text-align:left !important;
  font-weight:700 !important; letter-spacing:.2px !important;
  height:44px !important;
  caret-color:#f7e2b0 !important;
}
#paneLoginGateway .login-cyber-input.login-clean-input::placeholder {
  color:rgba(234,250,242,.45) !important; font-weight:500 !important;
}

#paneLoginGateway .btn-cyber-ignite.login-clean-btn {
  background: linear-gradient(135deg, #d4a24b 0%, #10b981 55%, #0a5f52 100%) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:14px !important;
  min-height:52px !important;
  font-size:.92rem !important;
  font-weight:900 !important;
  letter-spacing:.7px !important;
  color:#ffffff !important;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
  box-shadow:0 20px 38px rgba(6,60,46,.42), 0 2px 0 rgba(255,255,255,.15) inset, 0 -2px 0 rgba(0,0,0,.18) inset !important;
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease !important;
  margin-top:6px !important;
}
#paneLoginGateway .btn-cyber-ignite.login-clean-btn:hover {
  transform:translateY(-2px) !important;
  box-shadow:0 22px 40px rgba(6,60,46,.38), inset 0 1px 0 rgba(255,255,255,.28) !important;
  filter:saturate(1.05);
}
#paneLoginGateway .btn-cyber-ignite.login-clean-btn:active { transform:translateY(0) scale(.99) !important; }

/* ---------- SIDEBAR BRAND ---------- */
#sidebarMainContainer {
  background: linear-gradient(180deg,#04241f 0%,#052018 55%,#0b1420 100%) !important;
  border-right:1px solid rgba(16,185,129,.15) !important;
}
#sidebarMainContainer .imp-sidebar-brand-final {
  background: linear-gradient(135deg, rgba(16,185,129,.14), rgba(212,162,75,.10)) !important;
  border-bottom:1px solid rgba(212,162,75,.18) !important;
}
#sidebarMainContainer .imp-sidebar-logo-final,
#sidebarMainContainer .imp-sidebar-logo-final.gsr-sidebar-logo {
  background: linear-gradient(135deg,var(--gsr-emerald-500),var(--gsr-gold-500)) !important;
  color:#ffffff !important;
  box-shadow:0 10px 22px rgba(6,60,46,.45), inset 0 1px 0 rgba(255,255,255,.3) !important;
  border:1px solid rgba(255,255,255,.25) !important;
}
#sidebarMainContainer .imp-sidebar-title-final,
#sidebarMainContainer .imp-sidebar-title-final.gsr-sidebar-title {
  font-family:'Space Grotesk',sans-serif !important;
  font-weight:900 !important;
  letter-spacing:.2px !important;
  background: linear-gradient(120deg,#ffffff 0%,#ffe9b8 60%,#ffd48a 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  color:transparent !important; -webkit-text-fill-color:transparent !important;
  text-shadow:none !important;
}
#sidebarMainContainer .imp-sidebar-line-final {
  border-color: rgba(212,162,75,.18) !important;
  opacity:.9 !important;
}

/* Sidebar nav active/hover pakai emerald + gold aksen */
#sidebarMainContainer .nav-link {
  color:#dbeae2 !important;
  border-radius:10px !important;
  transition: background .18s ease, color .18s ease !important;
}
#sidebarMainContainer .nav-link:hover {
  background: rgba(16,185,129,.10) !important;
  color:#ffffff !important;
}
#sidebarMainContainer .nav-link.active,
#sidebarMainContainer .imp-dash-link.active {
  background: linear-gradient(135deg, rgba(16,185,129,.22), rgba(212,162,75,.18)) !important;
  color:#ffffff !important;
  box-shadow:inset 0 0 0 1px rgba(212,162,75,.28) !important;
}
#sidebarMainContainer .imp-menu-parent {
  color:#e6f0ea !important;
  font-weight:800 !important;
}
#sidebarMainContainer .imp-menu-parent:hover {
  background: rgba(16,185,129,.10) !important;
}
#sidebarMainContainer .imp-menu-caret { color:var(--gsr-gold-400) !important; }

/* ---------- HEADER WORKSPACE ---------- */
.premium-workspace-header {
  background: linear-gradient(180deg,#ffffff 0%,#f4f8f6 100%) !important;
  border-bottom:1px solid rgba(16,185,129,.12) !important;
  box-shadow:0 1px 0 rgba(212,162,75,.08) !important;
}
.premium-workspace-header .badge.bg-primary,
.premium-workspace-header .badge.bg-primary.text-primary {
  background: rgba(16,185,129,.10) !important;
  color: var(--gsr-emerald-800) !important;
}
.premium-workspace-header .badge .fa-cloud-check { color:var(--gsr-emerald-500) !important; }
.premium-workspace-header .btn.btn-dark {
  background: linear-gradient(135deg,var(--gsr-emerald-800),var(--gsr-emerald-500)) !important;
  border:none !important;
  box-shadow:0 10px 20px rgba(6,60,46,.22), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.premium-workspace-header .btn.btn-dark:hover { filter:brightness(1.05); }
.premium-workspace-header .btn-header-logout {
  color:#ffffff !important;
  background: linear-gradient(135deg,#b3541a,var(--gsr-gold-500)) !important;
  border:none !important;
  border-radius:10px !important;
  padding:6px 14px !important;
  font-weight:800 !important; font-size:.8rem !important;
  box-shadow:0 10px 20px rgba(163,90,17,.28) !important;
}
.premium-workspace-header .btn-header-logout:hover { filter:brightness(1.05); }

/* Profile chip di header */
.imp-profile-card-v8 {
  background: linear-gradient(135deg,#ffffff,#f0f7f4) !important;
  border:1px solid rgba(16,185,129,.20) !important;
  box-shadow:0 6px 14px rgba(6,60,46,.06) !important;
}
.imp-profile-avatar-v8 {
  background: linear-gradient(135deg,var(--gsr-emerald-800),var(--gsr-gold-500)) !important;
  color:#ffffff !important;
}
.imp-profile-name-v8 { color:var(--gsr-emerald-900) !important; font-weight:800 !important; }
.imp-profile-meta-v8 { color:var(--gsr-ink-500) !important; }
.imp-profile-meta-v8 .fa-circle { color:var(--gsr-emerald-500) !important; }

/* ---------- TOMBOL PRIMER / EXPORT (aksen luar) ---------- */
.btn-primary {
  background: linear-gradient(135deg,var(--gsr-emerald-800),var(--gsr-emerald-500)) !important;
  border-color: rgba(6,60,46,.35) !important;
  box-shadow:0 8px 18px rgba(6,60,46,.18) !important;
}
.btn-primary:hover { filter:brightness(1.06); }
.btn-export-excel-gradient {
  background: linear-gradient(135deg,#0f7f6c,#10b981) !important;
  color:#ffffff !important; border:none !important; border-radius:10px !important;
  padding:6px 12px !important; font-weight:800 !important; font-size:.8rem !important;
  box-shadow:0 8px 18px rgba(6,60,46,.22) !important;
}
.btn-export-pdf-gradient {
  background: linear-gradient(135deg,#a26a12,var(--gsr-gold-500)) !important;
  color:#ffffff !important; border:none !important; border-radius:10px !important;
  padding:6px 12px !important; font-weight:800 !important; font-size:.8rem !important;
  box-shadow:0 8px 18px rgba(163,90,17,.22) !important;
}

/* Judul konten utama */
.action-tab h4.fw-bold.text-dark {
  background: linear-gradient(120deg,var(--gsr-emerald-900),var(--gsr-emerald-700) 60%,var(--gsr-gold-500)) !important;
  -webkit-background-clip:text !important; background-clip:text !important;
  color:transparent !important; -webkit-text-fill-color:transparent !important;
}
.action-tab h4.fw-bold.text-dark i { -webkit-text-fill-color:initial !important; color:var(--gsr-emerald-500) !important; }

/* Search box seragam warna baru */
.search-magnifier-box:focus {
  border-color:var(--gsr-emerald-500) !important;
  box-shadow:0 0 0 3px rgba(16,185,129,.18) !important;
}

/* Body background halus */
body, .app-workspace-fluid {
  background: linear-gradient(180deg,#f7faf8 0%,#eef4f1 100%) !important;
}

/* ---------- SISA STOK: NAMA MATERIAL TIDAK TERLALU BOLD ---------- */
#tableStokMain tbody td:nth-child(2),
#bStokBody td:nth-child(2) {
  font-weight: 600 !important;
  color:#1f2937 !important;
  letter-spacing:0 !important;
}

/* Preserve tampilan notif / pemberitahuan / card edit-hapus:
   TIDAK ada override di sini untuk .imp-notify, .imp-toast,
   .swal2-*, .modal-content, .btn-edit, .btn-delete, dsb.
   (Dibiarkan sesuai style IMP Residence aslinya sesuai permintaan.) */

/* Responsif kecil: judul login sedikit lebih ramping di mobile */
@media (max-width: 480px){
  #paneLoginGateway .login-card-vault.login-clean-card { padding:26px 22px 22px !important; border-radius:22px !important; }
  #paneLoginGateway .login-clean-title.gsr-title { font-size:1.6rem !important; }
  #paneLoginGateway .login-clean-logo.gsr-logo { width:64px !important; height:64px !important; font-size:1.45rem !important; }
}