/* ===============================================================
   MandalaMine ERP — Pro UI/UX skin (DARK)
   Pasangan gelap dari 065 (terang). Aktif saat body.mm-prod (tema gelap).
   Tujuan: tampilan gelap se-premium & sekonsisten mode terang —
   topbar kaca, kartu membulat, tombol gold, tabel rapi — tapi di permukaan gelap.
   Additive & reversible: hapus include 071 dari erp_v3.html.
   =============================================================== */
:root{
  --mmd-bg:#0a1626;
  --mmd-surface:rgba(20,32,56,.72);
  --mmd-surface-2:#101a31;
  --mmd-line:rgba(150,180,225,.14);
  --mmd-line-strong:rgba(150,180,225,.24);
  --mmd-ink:#eaf1fb;
  --mmd-muted:#9aa9c9;
  --mmd-gold:#C99A2E;
  --mmd-gold-2:#E2BE69;
  --mmd-navy-line:#22345a;
  --mmd-shadow:0 18px 50px rgba(0,0,0,.42);
  --mmd-shadow-soft:0 10px 28px rgba(0,0,0,.30);
  --mmd-radius:22px;
  --mmd-radius-sm:14px;
}
body.mm-prod{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;
  color:var(--mmd-ink)!important;
  background:
    radial-gradient(circle at 4% -2%,rgba(201,154,46,.12),transparent 26%),
    radial-gradient(circle at 100% 6%,rgba(31,95,153,.16),transparent 32%),
    linear-gradient(180deg,#0b1828 0%,#091422 55%,#070f1c 100%)!important;
  overflow-x:hidden;
}
body.mm-prod #app{padding-left:0;background:transparent!important}
body.mm-prod h1,body.mm-prod h2,body.mm-prod h3{letter-spacing:-.035em;color:var(--mmd-ink)}

/* ===== Topbar ===== */
body.mm-prod .tb{
  position:sticky!important;top:0;z-index:900;
  background:rgba(11,24,40,.78)!important;
  backdrop-filter:blur(22px);
  border-bottom:1px solid var(--mmd-line)!important;
  padding:14px 28px!important;gap:18px!important;
  box-shadow:0 1px 0 rgba(255,255,255,.03);
}
body.mm-prod .tb .lg{min-width:265px}
body.mm-prod .lg-box{
  width:42px!important;height:42px!important;border-radius:14px!important;background:#0f2444!important;
  background-image:url('../../static/mandalamine_erp_mark.svg')!important;background-size:34px 34px!important;
  background-repeat:no-repeat!important;background-position:center!important;
  box-shadow:0 8px 24px rgba(0,0,0,.35)!important;color:transparent!important;border:1px solid var(--mmd-line)!important;
}
body.mm-prod .lg-t{color:var(--mmd-ink)!important;font-size:15px!important;font-weight:850!important;letter-spacing:-.03em!important}
body.mm-prod .lg-s{color:var(--mmd-muted)!important;font-size:11px!important}
body.mm-prod .gsrch{flex:1;max-width:560px}

/* ===== Inputs ===== */
body.mm-prod .gs-input,
body.mm-prod input,
body.mm-prod select,
body.mm-prod textarea{
  border-radius:14px!important;
  border:1px solid var(--mmd-line)!important;
  background:#0e1c33!important;
  color:var(--mmd-ink)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}
body.mm-prod .gs-input:focus,
body.mm-prod input:focus,
body.mm-prod select:focus,
body.mm-prod textarea:focus{outline:none!important;border-color:rgba(201,154,46,.65)!important;box-shadow:0 0 0 4px rgba(201,154,46,.16)!important}
body.mm-prod ::placeholder{color:#6f80a2!important}

/* ===== Buttons (toolbar) ===== */
body.mm-prod .ua{gap:9px!important}
body.mm-prod .bd,
body.mm-prod .bt-sm{
  background:#13223d!important;color:#dbe6f7!important;border:1px solid var(--mmd-line)!important;border-radius:13px!important;
  box-shadow:0 8px 18px rgba(0,0,0,.25)!important;font-weight:680!important;
}
body.mm-prod .bt-sm:hover,body.mm-prod .bd:hover{border-color:rgba(201,154,46,.45)!important;transform:translateY(-1px)}

/* ===== Context bar ===== */
body.mm-prod .ctxbar{
  margin:20px 30px 0!important;border:1px solid var(--mmd-line)!important;border-radius:18px!important;
  background:rgba(20,32,56,.66)!important;box-shadow:var(--mmd-shadow-soft)!important;color:var(--mmd-ink)!important;
}
body.mm-prod .ctxbar-lbl{color:var(--mmd-gold-2)!important;font-weight:850!important}
body.mm-prod .ctxbar-hint{color:var(--mmd-muted)!important}
body.mm-prod .sel,body.mm-prod .ctxbar-reset{background:#0e1c33!important;color:var(--mmd-ink)!important;border:1px solid var(--mmd-line)!important;border-radius:12px!important}

/* ===== Section shell (samakan layout dgn mode terang) ===== */
body.mm-prod .sc{display:none;padding:24px 30px 48px;max-width:1560px;margin:0 auto;color:var(--mmd-ink)}
body.mm-prod .sc.active{display:block}

/* ===== Cards / panels ===== */
body.mm-prod .wc,
body.mm-prod .cd,
body.mm-prod .kc,
body.mm-prod .card,
body.mm-prod .panel,
body.mm-prod .cockpit-box,
body.mm-prod .chart-card,
body.mm-prod .stat-card,
body.mm-prod .contractor-card,
body.mm-prod .dashboard-header{
  background:var(--mmd-surface)!important;
  border:1px solid var(--mmd-line)!important;
  color:var(--mmd-ink)!important;
  border-radius:var(--mmd-radius)!important;
  box-shadow:var(--mmd-shadow-soft)!important;
  backdrop-filter:blur(8px);
}
body.mm-prod .cd-t,body.mm-prod .cd h3,body.mm-prod .kc .kv,body.mm-prod .kv,body.mm-prod .stat-card strong{color:var(--mmd-ink)!important}
body.mm-prod .cd-sub,body.mm-prod .kl,body.mm-prod .ku,body.mm-prod .muted{color:var(--mmd-muted)!important}

/* ===== Buttons (general) ===== */
body.mm-prod .btn,body.mm-prod button:not(.nt):not(.ng){
  border-radius:14px!important;border:0!important;font-weight:790!important;letter-spacing:-.01em;
}
body.mm-prod .btp,body.mm-prod button[type="submit"]{
  background:linear-gradient(135deg,var(--mmd-gold-2),var(--mmd-gold))!important;color:#161006!important;
  box-shadow:0 12px 28px rgba(201,154,46,.26)!important;
}
body.mm-prod .btd,body.mm-prod .btg,.mm-prod .mm-pro-ghost{background:#13223d!important;color:#dbe6f7!important;border:1px solid var(--mmd-line)!important;box-shadow:0 8px 18px rgba(0,0,0,.25)!important}

/* ===== Tables ===== */
body.mm-prod .tbl,body.mm-prod table{color:var(--mmd-ink)!important;background:var(--mmd-surface-2)!important;border-radius:16px;overflow:hidden}
body.mm-prod th{color:#9fb0d0!important;background:#0f1d36!important;border-bottom:1px solid var(--mmd-line)!important}
body.mm-prod td{border-bottom:1px solid rgba(150,180,225,.08)!important;color:#d4deef!important}
body.mm-prod .badge-pill,body.mm-prod .status-pill{border-radius:999px!important;font-weight:780!important}

/* ===== Login overlay (split premium, versi gelap) ===== */
body.mm-prod #lg-overlay{
  background:
    radial-gradient(circle at 0% 0%,rgba(201,154,46,.22),transparent 34%),
    radial-gradient(circle at 100% 100%,rgba(31,95,153,.30),transparent 40%),
    linear-gradient(135deg,#071D37 0%,#04101f 100%)!important;
}
body.mm-prod #lg-overlay>div{
  width:min(980px,92vw)!important;max-width:92vw!important;min-height:560px!important;
  display:grid!important;grid-template-columns:1.08fr .92fr!important;gap:0!important;align-items:center!important;
  padding:0!important;background:#0c1a30!important;border:1px solid rgba(150,180,225,.18)!important;border-radius:28px!important;
  overflow:hidden!important;box-shadow:0 28px 110px rgba(0,0,0,.55)!important;position:relative!important;
}
body.mm-prod #lg-overlay>div::before{
  content:"One Integrated Platform.\A Endless Potential.\A\A Mining \2022 QA/QC \2022 Laboratory \2022 Finance";
  white-space:pre-line;grid-column:1;grid-row:1/5;align-self:stretch;display:flex;align-items:flex-end;
  padding:46px;color:#eaf1fb;font-size:17px;line-height:1.75;font-weight:650;letter-spacing:-.01em;
  text-shadow:0 2px 14px rgba(0,0,0,.45);
  background:
    url('../../static/mandalamine_erp_mark.svg') 50% 74px / 232px auto no-repeat,
    radial-gradient(circle at 50% 150px,rgba(201,154,46,.34),rgba(201,154,46,.07) 30%,transparent 46%),
    linear-gradient(180deg,rgba(8,33,63,.12),rgba(4,16,31,.96)) center/cover,
    url("data:image/svg+xml,%3Csvg width='700' height='520' viewBox='0 0 700 520' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23C99A2E' stroke-opacity='.30'%3E%3Cpath d='M20 410L150 320l95 50 95-110 150 140 110-85 120 90'/%3E%3Cpath d='M20 450L150 360l95 50 95-110 150 140 110-85 120 90'/%3E%3Ccircle cx='470' cy='174' r='55'/%3E%3Cpath d='M85 392h140l70 42H147z'/%3E%3Cpath d='M170 392l36-60h84l47 60'/%3E%3C/g%3E%3C/svg%3E") center/cover,
    linear-gradient(160deg,#08213F 0%,#0E2A4F 58%,#061B34 100%) center/cover;
}
/* garis emas tipis pemisah panel kiri & form */
body.mm-prod #lg-overlay>div::after{
  content:"";position:absolute;top:14%;bottom:14%;left:54.16%;width:1px;
  background:linear-gradient(180deg,transparent,rgba(201,154,46,.45),transparent);pointer-events:none;
}
body.mm-prod #lg-overlay>div>*{grid-column:2;margin-left:34px!important;margin-right:34px!important;position:relative;z-index:1}
/* logo besar sudah di panel kiri → sembunyikan emblem kecil + maskot bulat di kanan */
body.mm-prod #lg-overlay [style*="width:54px"]{display:none!important}
body.mm-prod #lg-overlay #lg-bx{display:none!important}
body.mm-prod #lg-email,body.mm-prod #lg-pass{background:#0e1c33!important;border:1px solid var(--mmd-line)!important;color:var(--mmd-ink)!important;border-radius:14px!important;padding:13px 14px!important}
body.mm-prod #lg-overlay button[type="submit"]{background:linear-gradient(135deg,var(--mmd-gold-2),var(--mmd-gold))!important;color:#161006!important;border-radius:14px!important;box-shadow:0 12px 30px rgba(201,154,46,.26)!important}

@media(max-width:920px){
  body.mm-prod .tb{flex-wrap:wrap;padding:14px!important}
  body.mm-prod #lg-overlay>div{grid-template-columns:1fr!important;min-height:auto!important}
  body.mm-prod #lg-overlay>div::before{display:none!important}
  body.mm-prod #lg-overlay>div>*{grid-column:1;margin-left:24px!important;margin-right:24px!important}
  /* di HP panel kiri hilang → tampilkan emblem perisai di atas form */
  body.mm-prod #lg-overlay [style*="width:54px"]{display:inline-flex!important;width:104px!important;height:104px!important;background:url('../../static/mandalamine_erp_mark.svg') center/92px no-repeat!important;color:transparent!important;border:0!important;filter:drop-shadow(0 8px 22px rgba(201,154,46,.30))}
}