/* ============================================================
   GAHAK — Dashboard system (Vendor + Admin)
   Reuses tokens/buttons from styles.css. This file only adds
   the dashboard-specific shell: sidebar, stat cards, tables.
============================================================ */

body.dash-body{background:var(--paper);}

/* ── Auth screens (login) ────────────────────────────────────── */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--ink);padding:2rem;}
.auth-card{background:#fff;border-radius:16px;padding:2.75rem;max-width:400px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.35);}
.auth-logo{font-family:var(--display);font-size:1.5rem;font-weight:700;margin-bottom:.3rem;}
.auth-logo span{color:var(--marigold-dk);}
.auth-sub{font-size:.82rem;color:var(--slate);margin-bottom:1.75rem;}
.auth-demo{
  background:#FFF8EC;border:1px dashed var(--marigold);border-radius:var(--r);
  padding:.85rem 1rem;font-size:.76rem;color:var(--ink);line-height:1.6;margin-bottom:1.5rem;
}
.auth-demo b{font-family:var(--mono);}
.auth-error{
  background:#FDEDED;border:1px solid var(--coral);color:#B23A3A;
  font-size:.8rem;border-radius:var(--r);padding:.7rem 1rem;margin-bottom:1rem;display:none;
}
.auth-error.show{display:block;}
.auth-back{display:block;text-align:center;margin-top:1.5rem;font-size:.8rem;color:var(--slate);}

/* ── Dashboard shell ──────────────────────────────────────────── */
.dash-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh;}
.dash-sidebar{
  background:var(--ink);color:rgba(255,255,255,.7);
  padding:1.5rem 1.25rem;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
}
.dash-logo{font-family:var(--display);font-size:1.35rem;font-weight:700;color:#fff;margin-bottom:.2rem;}
.dash-logo span{color:var(--marigold);}
.dash-role{font-size:.72rem;font-family:var(--mono);color:var(--marigold);text-transform:uppercase;letter-spacing:.06em;margin-bottom:2rem;}
.dash-nav{display:flex;flex-direction:column;gap:.2rem;flex:1;}
.dash-nav button{
  display:flex;align-items:center;gap:.7rem;background:none;border:none;color:rgba(255,255,255,.65);
  text-align:left;padding:.7rem .8rem;border-radius:var(--r);font-size:.85rem;font-weight:500;transition:background .15s,color .15s;
}
.dash-nav button:hover{background:rgba(255,255,255,.06);color:#fff;}
.dash-nav button.active{background:var(--marigold);color:var(--ink);font-weight:700;}
.dash-nav button.locked{opacity:.35;cursor:not-allowed;}
.dash-nav-icon{width:18px;text-align:center;}
.dash-user{border-top:1px solid rgba(255,255,255,.1);padding-top:1rem;margin-top:1rem;font-size:.8rem;}
.dash-user b{color:#fff;display:block;font-size:.85rem;}
.dash-user a{color:var(--coral);font-size:.78rem;}

.dash-main{padding:2.25rem 2.75rem;max-width:1200px;}
.dash-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:1.75rem;}
.dash-head h1{font-family:var(--display);font-size:1.55rem;font-weight:700;}
.dash-head p{color:var(--slate);font-size:.85rem;margin-top:.25rem;}

/* ── Stat cards ───────────────────────────────────────────────── */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-bottom:2rem;}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:var(--r2);padding:1.4rem;}
.stat-card .lbl{font-size:.75rem;color:var(--slate);font-family:var(--mono);text-transform:uppercase;letter-spacing:.04em;}
.stat-card .val{font-family:var(--display);font-size:1.7rem;font-weight:700;margin-top:.4rem;}
.stat-card .delta{font-size:.75rem;margin-top:.3rem;}
.stat-card .delta.up{color:#2E8B57;}
.stat-card .delta.warn{color:var(--coral);}

/* ── Panels & tables ──────────────────────────────────────────── */
.dash-panel{display:none;}
.dash-panel.active{display:block;}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r2);padding:1.5rem;margin-bottom:1.5rem;}
.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;}
.card-head h3{font-family:var(--display);font-size:1.1rem;}
table.dtable{width:100%;border-collapse:collapse;font-size:.85rem;}
.dtable th{text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--mist);font-family:var(--mono);font-weight:500;padding:.6rem .7rem;border-bottom:1px solid var(--line);}
.dtable td{padding:.75rem .7rem;border-bottom:1px solid var(--line-lt);vertical-align:middle;}
.dtable tr:last-child td{border-bottom:none;}
.dtable img.thumb{width:38px;height:38px;border-radius:6px;object-fit:cover;}

.badge{display:inline-block;font-size:.72rem;font-weight:600;padding:.25rem .6rem;border-radius:50px;}
.badge.ok{background:#E4F4EA;color:#2E8B57;}
.badge.warn{background:#FFF2DE;color:var(--marigold-dk);}
.badge.bad{background:#FDEDED;color:#C0392B;}
.badge.info{background:#EAF1FB;color:#2C5FAE;}

.row-actions{display:flex;gap:.5rem;}
.row-actions button{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:.35rem .7rem;font-size:.75rem;font-weight:600;color:var(--ink);
}
.row-actions button.danger{color:#C0392B;border-color:#F3C7C0;}
.row-actions button.primary{background:var(--ink);color:#fff;border-color:var(--ink);}
.row-actions select{border:1px solid var(--line);border-radius:var(--r);font-size:.78rem;padding:.35rem .5rem;}

.btn-add{background:var(--marigold);color:var(--ink);border:none;border-radius:var(--r);padding:.6rem 1.1rem;font-weight:700;font-size:.82rem;}

/* ── Modal ────────────────────────────────────────────────────── */
.modal-overlay{
  display:none;position:fixed;inset:0;background:rgba(11,10,30,.5);z-index:500;
  align-items:center;justify-content:center;padding:1.5rem;
}
.modal-overlay.show{display:flex;}
.modal-box{background:#fff;border-radius:var(--r2);padding:2rem;max-width:460px;width:100%;max-height:88vh;overflow-y:auto;}
.modal-box h3{font-family:var(--display);font-size:1.2rem;margin-bottom:1.25rem;}
.modal-close-row{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1.5rem;}

.access-denied{text-align:center;padding:4rem 1rem;color:var(--slate);}
.access-denied .ic{font-size:2.4rem;margin-bottom:1rem;}

.perm-check{display:flex;align-items:center;gap:.6rem;font-size:.85rem;margin-bottom:.7rem;}

@media(max-width:1000px){
  .dash-shell{grid-template-columns:1fr;}
  .dash-sidebar{position:static;height:auto;}
  .stat-grid{grid-template-columns:1fr 1fr;}
  .dash-main{padding:1.5rem;}
}