/* ===== VERVE POS WEB RC6.7 · LOYVERSE-CLEAN ===== */
:root{
  --v-green:#46b553;--v-green-soft:#eaf7ec;--v-rail:72px;--v-panel:210px;
  --v-shadow:0 2px 12px rgba(18,25,35,.10);
}
html[data-theme="light"]{--page:#f5f6f7;--surface:#fff;--surface-2:#fafafa;--text:#2f3337;--muted:#747b83;--border:#e2e5e8;color-scheme:light}
html[data-theme="dark"]{--page:#0e1013;--surface:#171a1f;--surface-2:#1d2127;--text:#f2f3f5;--muted:#9ca3ad;--border:#2d333b;color-scheme:dark}
body{background:var(--page)!important;color:var(--text)!important}
main>header{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.verveHeaderActions{margin-left:auto;display:flex;align-items:center;gap:10px}
.verveIconButton{width:42px;height:42px;border-radius:10px;border:1px solid var(--border);background:var(--surface);font-size:21px;display:grid;place-items:center;cursor:pointer}
.verveIconButton:hover{transform:translateY(-1px);box-shadow:var(--v-shadow)}
#identityBar{background:var(--surface);border-bottom:1px solid var(--border);padding:8px 18px!important;display:flex;align-items:center;gap:8px}
#identityBar span{margin-right:auto;font-size:13px;color:var(--muted)}
#identityBar button{padding:8px 12px!important;border-radius:8px!important}

aside{width:282px!important;padding:0!important;background:var(--surface)!important;border-right:1px solid var(--border)!important}
.brand{height:105px!important;padding:12px!important;border-bottom:1px solid var(--border);display:flex!important;align-items:center!important;justify-content:center!important}
.brandLogo{width:96px!important;height:76px!important;object-fit:contain!important}
.brand span{display:none!important}
#nav{display:grid!important;grid-template-columns:72px 1fr;min-height:calc(100vh - 160px);gap:0!important;padding:0!important}
.verveNavRail{border-right:1px solid var(--border);background:var(--surface-2);padding-top:8px}
.verveGroupButton{width:72px!important;min-height:68px!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--muted)!important;display:flex!important;flex-direction:column!important;gap:5px!important;align-items:center!important;justify-content:center!important;font-size:10px!important;padding:5px!important}
.verveGroupButton:hover,.verveGroupButton.active{background:var(--v-green-soft)!important;color:var(--v-green)!important}
html[data-theme="dark"] .verveGroupButton:hover,html[data-theme="dark"] .verveGroupButton.active{background:#17321d!important}
.verveNavIcon{font-size:22px;line-height:1}
.verveNavPanel{padding:12px 0}
.vervePanelTitle{font-size:12px;text-transform:uppercase;letter-spacing:.10em;color:var(--muted);padding:8px 16px}
.verveNavPanel button{display:block!important;width:100%!important;text-align:left!important;border:0!important;border-radius:0!important;background:transparent!important;padding:11px 16px!important;color:var(--text)!important;font-size:14px!important}
.verveNavPanel button:hover{background:var(--surface-2)!important}
.verveNavPanel button.active{color:var(--v-green)!important;background:transparent!important;font-weight:700!important;box-shadow:none!important}
.foot{font-size:10px!important;padding:14px 12px!important;color:var(--muted)!important}

main{margin-left:282px!important;max-width:none!important;padding:0 28px 40px!important}
main>header small{color:var(--v-green)!important;letter-spacing:.14em}
main>header h1{font-size:27px!important;margin:4px 0!important}
.saleNotice{display:none!important}
.supportWhatsapp{right:22px!important;bottom:22px!important}

.verveReportToolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:8px 0 16px}
.verveDateRange{display:flex;align-items:stretch;background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:hidden;box-shadow:var(--v-shadow)}
.verveDateRange>button{border:0;border-radius:0;background:transparent;padding:0 14px;font-size:22px}
.verveDateRange label{display:flex;align-items:center;gap:7px;padding:7px 10px;border-left:1px solid var(--border)}
.verveDateRange label span{font-size:10px;color:var(--muted);text-transform:uppercase}
.verveDateRange input{border:0!important;background:transparent!important;padding:3px!important}
.verveFilterPill{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:11px 14px;color:var(--muted)}
.verveMetricStrip{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));background:var(--surface);border:1px solid var(--border);border-radius:8px 8px 0 0;overflow:hidden;box-shadow:var(--v-shadow)}
.verveMetric{border:0!important;border-right:1px solid var(--border)!important;border-radius:0!important;background:var(--surface)!important;text-align:left!important;padding:17px 18px!important;color:var(--text)!important}
.verveMetric:last-child{border-right:0!important}
.verveMetric:hover{background:var(--surface-2)!important}
.verveMetric span{display:block;color:var(--muted);font-size:13px;margin-bottom:7px}
.verveMetric b{display:block;font-size:23px;font-weight:500}
.verveMetric small{display:block;color:var(--muted);margin-top:4px}
.verveChartCard,.verveExportCard,.verveDashboardDetail{background:var(--surface);border:1px solid var(--border);margin-top:16px;border-radius:8px;box-shadow:var(--v-shadow)}
.verveCardHead,.verveDetailHead{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border)}
.verveCardHead h2,.verveDetailHead h3{margin:0;font-size:16px}
.verveCardHead span,.verveDetailHead small{color:var(--muted);font-size:12px}
.verveDetailHead b{font-size:21px}
.verveBars{height:285px;display:flex;align-items:flex-end;gap:7px;padding:24px 22px 15px;overflow-x:auto}
.verveBarCol{height:100%;min-width:28px;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.verveBarValue{font-size:9px;color:var(--muted);height:19px;white-space:nowrap}
.verveBarTrack{height:210px;width:70%;display:flex;align-items:flex-end;border-bottom:1px solid var(--border)}
.verveBarTrack i{display:block;width:100%;background:var(--v-green);border-radius:3px 3px 0 0;min-height:3px}
.verveBarCol small{font-size:9px;color:var(--muted);margin-top:6px}
.verveEmptyChart{margin:auto;color:var(--muted)}
.verveTableWrap{overflow:auto}
.verveTable{width:100%;border-collapse:collapse;font-size:13px}
.verveTable th,.verveTable td{padding:12px 18px;border-bottom:1px solid var(--border);text-align:left}
.verveTable th{color:var(--muted);font-weight:500;background:var(--surface-2)}
.verveTable .num{text-align:right}
.verveImportBar{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:13px 15px;margin-bottom:14px}
.verveImportBar div{display:flex;flex-direction:column;gap:3px}
.verveImportBar small{color:var(--muted)}
.verveImportStats{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;background:var(--surface-2);padding:12px;border-radius:8px;margin:12px 0}
.verveImportStats b{font-size:18px}
.notice[role="alert"],#pinError{color:#d85a6a}
dialog{border:1px solid var(--border)!important;border-radius:14px!important;box-shadow:0 20px 70px rgba(0,0,0,.32)!important;max-width:min(680px,92vw)!important}

@media(max-width:1000px){
  aside{width:82px!important}
  .brand{height:82px!important}.brandLogo{width:66px!important;height:56px!important}
  #nav{display:block!important;min-height:0}.verveNavRail{border-right:0}.verveNavPanel{position:fixed;left:82px;top:82px;width:220px;max-height:calc(100vh - 96px);overflow:auto;background:var(--surface);border:1px solid var(--border);box-shadow:var(--v-shadow);z-index:30}
  .verveGroupButton{width:82px!important}
  .foot{display:none}
  main{margin-left:82px!important;padding:0 18px 30px!important}
  .verveMetricStrip{grid-template-columns:repeat(2,1fr)}
  .verveMetric:nth-child(2n){border-right:0!important}
}
@media(max-width:620px){
  main{padding:0 10px 24px!important}
  main>header{align-items:flex-start;padding-top:10px}
  .verveHeaderActions{flex-wrap:wrap;justify-content:flex-end}
  #location{max-width:135px}
  .verveMetricStrip{grid-template-columns:1fr 1fr}
  .verveMetric b{font-size:18px}
  .verveReportToolbar{gap:7px}
  .verveDateRange{width:100%}.verveDateRange label{flex:1}.verveDateRange input{width:112px}
}