:root{
  --m-card:#0f1a2e;
  --m-border:rgba(148,163,184,.18);
  --m-text:#e5e7eb;
  --m-muted:rgba(229,231,235,.75);
  --m-accent:#22c55e;
  --m-accent2:#38bdf8;
}

body.merchant{
  background:linear-gradient(180deg,#060b14 0%, #070d18 50%, #050810 100%);
  color:var(--m-text);
  min-height:100vh;
  font-family: Arial, sans-serif;
}

.m-wrap{max-width:1100px;margin:0 auto;padding:20px;}

.m-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;
  background:rgba(15,23,42,.8);
  border:1px solid var(--m-border);
  border-radius:16px;
  margin-bottom:16px;
  backdrop-filter: blur(6px);
}

.m-top .brand{display:flex;align-items:center;gap:10px;font-weight:700;}
.m-top .brand img{width:28px;height:28px;border-radius:8px;}

.m-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.m-nav a{
  color:var(--m-text);
  text-decoration:none;
  padding:10px 12px;
  border:1px solid var(--m-border);
  border-radius:12px;
  background:rgba(15,26,46,.65);
}
.m-nav a.active{border-color:rgba(34,197,94,.55);box-shadow:0 0 0 1px rgba(34,197,94,.25) inset;}
.m-nav a:hover{border-color:rgba(56,189,248,.55);}

.m-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px;}
.m-card{
  grid-column: span 12;
  background:rgba(15,26,46,.75);
  border:1px solid var(--m-border);
  border-radius:16px;
  padding:16px;
}
@media(min-width:900px){
  .col-4{grid-column:span 4;}
  .col-6{grid-column:span 6;}
  .col-8{grid-column:span 8;}
}

.m-kpi{font-size:22px;font-weight:800;margin-top:8px;}
.m-muted{color:var(--m-muted);}

.m-btn{
  display:inline-block;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--m-border);
  text-decoration:none;
  color:var(--m-text);
  background:rgba(15,26,46,.9);
}
.m-btn.primary{border-color:rgba(34,197,94,.55);}
.m-btn.danger{border-color:rgba(239,68,68,.55);}

table.m-table{width:100%;border-collapse:collapse;margin-top:10px;}
.m-table th,.m-table td{padding:10px;border-bottom:1px solid var(--m-border);text-align:left;}
.m-table th{color:var(--m-muted);font-weight:700;}

/* Timeline (Topup & workflow) */
.m-timeline{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.m-step{font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid var(--m-border);background:rgba(2,6,23,.25);}
.m-step.ok{border-color:rgba(34,197,94,.55);}
.m-step.bad{border-color:rgba(239,68,68,.55);}
.m-step.muted{opacity:.65;}

.m-form input,.m-form select,.m-form textarea{
  width:100%;padding:10px 12px;border-radius:12px;
  border:1px solid var(--m-border);
  background:rgba(2,6,23,.35);
  color:var(--m-text);
}
.m-form label{display:block;margin-top:10px;margin-bottom:6px;color:var(--m-muted);}

.m-alert{padding:10px 12px;border-radius:12px;border:1px solid var(--m-border);margin:12px 0;}
.m-alert.ok{border-color:rgba(34,197,94,.55);}
.m-alert.err{border-color:rgba(239,68,68,.55);}
