/* WSDC unified charcoal theme. Loaded after the database-selected legacy theme. */
:root {
  --background: 0 0% 9%;
  --foreground: 0 0% 96%;
  --card: 0 0% 15%;
  --card-foreground: 0 0% 96%;
  --popover: 0 0% 15%;
  --popover-foreground: 0 0% 96%;
  --primary: 207 100% 55%;
  --primary-foreground: 0 0% 100%;
  --secondary: 0 0% 13%;
  --secondary-foreground: 0 0% 96%;
  --muted: 0 0% 16%;
  --muted-foreground: 0 0% 65%;
  --accent: 207 100% 55%;
  --accent-foreground: 0 0% 100%;
  --border: 0 0% 23%;
  --input: 0 0% 19%;
  --ring: 207 100% 55%;
}
html, body, button, input, select, textarea { font-family:"Plus Jakarta Sans",Inter,system-ui,sans-serif !important; }
html, body { background:#171717 !important; color:#f5f5f5 !important; }
body > header,
body > header > div,
body > header nav,
body > header .container { background:#202020 !important; border-color:#383838 !important; color:#f5f5f5 !important; }
body > header a, body > header button, body > header svg { color:#f5f5f5 !important; }
/* Homepage navigation no longer needs the duplicated transaction-check menu. */
body > header nav a[href*="id-id/invoices"] { display:none !important; }
body > header input { background:#30343a !important; color:#f5f5f5 !important; border-color:#4a4a4a !important; }
main, section { border-color:#3a3a3a; }
.bg-background,.bg-secondary,.bg-muted,.bg-popover,.bg-card { background-color:#252525 !important; }
.bg-white { background-color:#171717 !important; }
.bg-input { background-color:#303030 !important; }
.text-foreground,.text-secondary-foreground,.text-card-foreground,.text-popover-foreground { color:#f5f5f5 !important; }
.text-black,.text-hitam-300,.text-hitam-400 { color:#e5e7eb !important; }
.text-muted-foreground { color:#a3a3a3 !important; }
.border,.border-border,.border-border\/20,.border-border\/50 { border-color:#3a3a3a !important; }
.shadow,.shadow-sm,.shadow-md,.shadow-lg,.shadow-xl { box-shadow:0 12px 32px rgba(0,0,0,.22) !important; }
input,select,textarea { background:#303030 !important; color:#f5f5f5 !important; border-color:#4a4a4a !important; }
input::placeholder,textarea::placeholder { color:#8f8f8f !important; }
table thead,tr,td,th { border-color:#3a3a3a !important; }
table tr:nth-child(even) { background:#202020; }
.rounded-xl.bg-muted,.rounded-2xl.bg-muted,.rounded-lg.bg-muted { background:#252525 !important; border:1px solid #3a3a3a; }
button.bg-primary,a.bg-primary,.bg-button-gradient-theme { background:#1687ff !important; color:#fff !important; }
button:hover,a:hover { border-color:#1687ff; }
footer { background:#111 !important; color:#f5f5f5 !important; }
/* Nominal cards: product names and stock stay readable; prices retain their blue class. */
.produk-btn .flex.flex-col.justify-start.gap-1.p-3 > span:first-child,
.produk-btn > span > span > div:first-of-type > span:first-child { color:#fff !important; }
.produk-btn span.mt-1.flex.items-center.text-\[10px\].font-medium.text-muted-foreground { color:#fff !important; }
.produk-btn a.text-cyan-400 { color:#35bfff !important; text-decoration:underline; text-underline-offset:2px; }
.produk-btn a.text-cyan-400:hover { color:#8cdbff !important; }
/* Preserve the original white plate behind the instant-delivery SVG logo. */
.produk-btn .wsdc-instant-logo { background:#fff !important; border:0 !important; box-shadow:none !important; }
@media (max-width:768px) {
  body > header .container { min-height:64px; }
  body > header input { background:#303030 !important; }
}

/* Compact WhatsApp launcher. Links are managed from Admin > Pengaturan Website. */
aside.wsdc-wa-float {
  position:fixed !important; z-index:9999 !important; top:auto !important; left:auto !important;
  right:20px !important; bottom:22px !important; width:62px !important; min-width:62px !important;
  display:flex !important; flex-direction:column !important; align-items:flex-end !important;
  gap:0 !important; margin:0 !important; padding:0 !important;
}
aside.wsdc-wa-float.wsdc-wa-float--raised { bottom:104px !important; }
.wsdc-wa-menu {
  position:absolute; right:0; bottom:56px; width:176px; padding:6px;
  border:1px solid rgba(255,255,255,.12); border-radius:12px; background:#34343e;
  box-shadow:0 15px 35px rgba(0,0,0,.42); opacity:0; visibility:hidden;
  transform:translateY(8px) scale(.97); transform-origin:bottom right; pointer-events:none;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.wsdc-wa-float:hover .wsdc-wa-menu,
.wsdc-wa-float:focus-within .wsdc-wa-menu,
.wsdc-wa-float.is-open .wsdc-wa-menu {
  opacity:1; visibility:visible; transform:translateY(0) scale(1); pointer-events:auto;
}
aside.wsdc-wa-float .wsdc-wa-menu a {
  display:flex !important; width:100% !important; min-height:38px; align-items:center !important;
  justify-content:space-between !important; gap:10px; padding:7px 8px !important;
  border:0 !important; border-radius:8px !important; background:transparent !important;
  color:#fff !important; text-decoration:none !important; font-size:13px !important;
  font-weight:700 !important; line-height:1.15 !important; box-shadow:none !important;
}
aside.wsdc-wa-float .wsdc-wa-menu a:hover { background:rgba(255,255,255,.08) !important; }
aside.wsdc-wa-float .wsdc-wa-icon {
  display:grid !important; flex:0 0 23px; place-items:center !important; width:23px !important;
  height:23px !important; border-radius:50% !important; background:#25d366 !important;
}
aside.wsdc-wa-float .wsdc-wa-icon svg { width:17px; height:17px; fill:#fff; }
.wsdc-wa-trigger {
  position:relative; z-index:2; display:grid; place-items:center; width:58px; height:58px;
  padding:5px; border:1px solid rgba(255,255,255,.35); border-radius:12px;
  background:#fff; box-shadow:0 10px 28px rgba(0,0,0,.32); cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease;
}
.wsdc-wa-trigger:hover { transform:translateY(-2px); box-shadow:0 14px 34px rgba(0,0,0,.4); }
.wsdc-wa-trigger svg { width:48px; height:48px; overflow:visible; }
.wsdc-wa-trigger .wsdc-bot-head { fill:#fff; stroke:#3a7580; stroke-width:3; }
.wsdc-wa-trigger .wsdc-bot-band { fill:#65cbd1; stroke:#3a7580; stroke-width:3; stroke-linejoin:round; }
.wsdc-wa-trigger circle { fill:#e86767; }
.wsdc-wa-trigger .wsdc-bot-smile { fill:none; stroke:#3a7580; stroke-width:3; stroke-linecap:round; }
@media (max-width:640px) {
  aside.wsdc-wa-float { right:12px !important; bottom:18px !important; width:56px !important; min-width:56px !important; }
  aside.wsdc-wa-float.wsdc-wa-float--raised { bottom:94px !important; }
  .wsdc-wa-trigger { width:54px; height:54px; }
  .wsdc-wa-menu { bottom:52px; width:170px; }
}