/* ═════════════════════════════════════════
   BUILDCORE — Unified Design System
   Sales accent: amber/gold
   AR accent:    teal/cyan
   Shared:       light bg, clean professional
═════════════════════════════════════════ */
:root {
  --bg:      #f4f6f9;
  --bg2:     #ffffff;
  --bg3:     #eef1f5;
  --panel:   #ffffff;
  --brd:     #dde2ea;
  --brd2:    #c8d0db;
  --brd3:    #b0bccb;

  /* Sales — amber */
  --gold:    #d4880a;
  --gold2:   #e89c18;
  --gold3:   #f5b830;

  /* AR — teal */
  --teal:    #008c76;
  --teal2:   #00a88e;
  --teal3:   #40c8b0;

  /* Shared */
  --red:     #d42030;
  --red2:    #e83040;
  --amber:   #d07010;
  --amber2:  #e88820;
  --blue:    #1a60d0;
  --blue2:   #2878f0;
  --violet:  #7050d0;
  --violet2: #8868e8;
  --green:   #00a860;

  /* Home Hardware — red */
  --hh:      #c02000;
  --hh2:     #d83010;
  --hh3:     #e85030;
  /* Purchasing — blue */
  --po:      #1458a0;
  --po2:     #1a6bbf;
  --po3:     #2080d8;
  --green2:  #00a860;

  --text:    #2c3e52;
  --text2:   #4a6080;
  --text3:   #8098b0;
  --white:   #1a2a3a;

  --head:    'Barlow Condensed', sans-serif;
  --body:    'Barlow', sans-serif;
  --mono:    'Fira Code', monospace;
  --r:       6px;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
button,.nav-btn,.sub-btn,.btn{touch-action:manipulation;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--text);font-family:var(--body);font-size:14px;line-height:1.65;min-height:100vh;}

/* ── TOPBAR ── */
#topbar{
  position:fixed;top:0;left:0;right:0;z-index:500;
  background:rgba(255,255,255,0.97);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--brd2);
  border-bottom:1px solid var(--brd);
  height:50px;display:flex;align-items:center;padding:0 28px;
  padding-left:max(28px, env(safe-area-inset-left));
  padding-right:max(28px, env(safe-area-inset-right));
}
.tb-brand{
  font-family:var(--head);font-size:21px;font-weight:800;
  color:var(--white);letter-spacing:3px;margin-right:36px;white-space:nowrap;
}
.tb-brand em{color:var(--po2);font-style:normal;}
.nav-btn{
  font-family:var(--mono);font-size:12px;color:var(--text2);
  background:none;border:none;cursor:pointer;
  padding:0 18px;height:50px;letter-spacing:.8px;
  border-bottom:2px solid transparent;
  transition:color .15s,border-color .15s;white-space:nowrap;
}
.nav-btn:hover{color:var(--white);}
.nav-btn.active-sales{color:var(--gold);border-bottom-color:var(--gold);}
.nav-btn.active-ar{color:var(--teal);border-bottom-color:var(--teal);}
.nav-btn.active-shared{color:var(--po2);border-bottom-color:var(--po2);}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:12px;}
#alert-badge{
  font-family:var(--mono);font-size:10px;font-weight:600;
  background:rgba(232,48,64,.12);color:var(--red2);
  border:1px solid rgba(232,48,64,.25);
  padding:3px 10px;border-radius:3px;cursor:pointer;display:none;letter-spacing:.5px;
}

/* ── SUB-NAV ── */
#subnav{
  position:fixed;top:50px;left:0;right:0;z-index:499;
  background:rgba(9,16,26,0.97);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--brd);
  height:38px;display:none;align-items:center;padding:0 28px;
}
#subnav.visible{display:flex;}
.sub-btn{
  font-family:var(--mono);font-size:11px;color:var(--text3);
  background:none;border:none;cursor:pointer;
  padding:0 16px;height:38px;letter-spacing:.5px;
  border-bottom:2px solid transparent;
  transition:color .15s,border-color .15s;white-space:nowrap;
}
.sub-btn:hover{color:var(--text);}
.admin-only { display: none !important; }
body.is-admin .admin-only { display: inline !important; }
body.is-admin .sub-btn.admin-only { display: inline-flex !important; }
.owner-only { display: none !important; }
.sub-btn.sub-active-sales{color:var(--gold2);border-bottom-color:var(--gold);}
.nav-btn.active-inv{color:var(--violet2);border-bottom-color:var(--violet);}
.nav-btn.active-hh{color:var(--hh3);border-bottom-color:var(--hh2);}
.sub-btn.sub-active-inv{color:var(--violet2);border-bottom-color:var(--violet);}
.sub-btn.sub-active-hh{color:var(--hh3);border-bottom-color:var(--hh2);}
.nav-btn.active-po{color:var(--po3);border-bottom-color:var(--po2);}
.sub-btn.sub-active-po{color:var(--po3);border-bottom-color:var(--po2);}
.kpi.po::before{background:var(--po2);}
.upload-zone.po-zone:hover,.upload-zone.po-zone.drag-over{border-color:var(--po2);background:rgba(26,107,181,.05);}
/* PO Print styles */
@media print{
  body>*:not(#po-print-modal){display:none!important;}
  #po-print-modal{display:block!important;position:static!important;background:#fff!important;margin:0!important;padding:0!important;}
  .po-print-hide{display:none!important;}
  .po-print-page{page-break-after:always;break-after:page;}
  .po-print-page:last-child{page-break-after:avoid;break-after:avoid;}
}
.kpi.violet::before{background:var(--violet);}
.kpi.hh::before{background:var(--hh2);}
.upload-zone.hh-zone:hover,.upload-zone.hh-zone.drag-over{border-color:var(--hh2);background:rgba(212,43,10,.05);}
.hh-tag{display:inline-block;font-family:var(--mono);font-size:9px;font-weight:600;padding:2px 7px;border-radius:3px;background:rgba(212,43,10,.15);color:var(--hh3);border:1px solid rgba(212,43,10,.3);letter-spacing:.5px;}

/* ── TABS — padding adjusts when subnav is present ── */
.tab{display:none;padding:66px 24px 48px;max-width:1440px;margin:0 auto;}
.tab.active{display:block;}
body.has-subnav .tab{padding-top:104px;}

/* ── SECTION HEADERS ── */
.sec-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px;}
.sec-title{font-family:var(--head);font-size:24px;font-weight:800;color:var(--white);letter-spacing:.5px;}
.sec-sub{font-family:var(--mono);font-size:11px;color:var(--text3);margin-top:3px;}

/* ── CARDS ── */
.card{background:var(--panel);border:1px solid var(--brd);border-radius:var(--r);overflow:hidden;}
.card-head{padding:10px 16px;border-bottom:1px solid var(--brd);display:flex;align-items:center;justify-content:space-between;}
.ch-title{font-family:var(--head);font-size:13px;font-weight:700;color:var(--white);letter-spacing:.8px;text-transform:uppercase;}
.ch-meta{font-family:var(--mono);font-size:10px;color:var(--text3);}
.card-body{padding:16px;}

/* ── KPI GRIDS ── */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:12px;margin-bottom:20px;}
.kpi{background:var(--panel);border:1px solid var(--brd);border-radius:var(--r);padding:14px 16px;position:relative;overflow:hidden;transition:border-color .2s;}
.kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;}
.kpi.gold::before{background:var(--gold);}
.kpi.teal::before{background:var(--teal);}
.kpi.red::before{background:var(--red);}
.kpi.amber::before{background:var(--amber);}
.kpi.blue::before{background:var(--blue2);}
.kpi.green::before{background:var(--green);}
.kpi-label{font-family:var(--mono);font-size:9px;color:var(--text3);letter-spacing:2px;text-transform:uppercase;margin-bottom:6px;}
.kpi-value{font-family:var(--head);font-size:30px;font-weight:800;color:var(--white);line-height:1;margin-bottom:4px;}
.kpi-value.gold{color:var(--gold2);}
.kpi-value.teal{color:var(--teal2);}
.kpi-value.red{color:var(--red2);}
.kpi-value.amber{color:var(--amber2);}
.kpi-sub{font-family:var(--mono);font-size:10px;color:var(--text2);}
.kpi-delta{font-family:var(--mono);font-size:11px;font-weight:600;margin-top:4px;}
.kpi-delta.up{color:var(--red2);}  /* up = bad for AR, good for sales context handled in JS */
.kpi-delta.dn{color:var(--green2);}
.kpi-delta.pos{color:var(--green2);}  /* positive = good */
.kpi-delta.neg{color:var(--red2);}    /* negative = bad */
.kpi-delta.nu{color:var(--text3);}

/* ── CHART CONTAINERS ── */
.chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;}
.chart-grid-3{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-bottom:20px;}
.chart-wrap{height:220px;position:relative;}
.chart-wrap canvas{max-height:220px;}

/* ── AGING BAR ── */
.aging-track{height:28px;border-radius:4px;overflow:hidden;display:flex;gap:2px;background:var(--brd);margin-bottom:10px;}
.aging-seg{height:100%;display:flex;align-items:center;justify-content:center;min-width:0;transition:width .5s ease;}
.aging-seg span{font-family:var(--mono);font-size:10px;font-weight:600;color:rgba(255,255,255,.9);white-space:nowrap;padding:0 4px;}
.aging-legend{display:flex;flex-wrap:wrap;gap:14px;}
.al-i{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;color:var(--text2);}
.al-dot{width:10px;height:10px;border-radius:2px;flex-shrink:0;}

/* ── BADGES ── */
.badge{display:inline-block;font-family:var(--mono);font-size:10px;font-weight:600;padding:2px 8px;border-radius:3px;letter-spacing:.3px;white-space:nowrap;}
.b-gold{background:rgba(232,160,32,.12);color:var(--gold2);border:1px solid rgba(232,160,32,.25);}
.b-teal{background:rgba(0,192,160,.1);color:var(--teal2);border:1px solid rgba(0,192,160,.2);}
.b-red{background:rgba(232,48,64,.1);color:var(--red2);border:1px solid rgba(232,48,64,.2);}
.b-amber{background:rgba(240,144,32,.1);color:var(--amber2);border:1px solid rgba(240,144,32,.2);}
.b-blue{background:rgba(40,120,240,.1);color:var(--blue2);border:1px solid rgba(40,120,240,.2);}
.b-ok{background:rgba(0,200,120,.1);color:var(--green2);border:1px solid rgba(0,200,120,.2);}
.b-gray{background:rgba(42,72,104,.3);color:var(--text3);border:1px solid var(--brd);}
.b-lock{background:rgba(40,120,240,.1);color:var(--blue2);border:1px solid rgba(40,120,240,.2);}

/* ── PROGRESS BAR ── */
.prog-track{height:6px;background:var(--brd);border-radius:3px;overflow:hidden;}
.prog-fill{height:100%;border-radius:3px;transition:width .5s;}

/* ── TABLE ── */
.tbl-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:13px;}
th{font-family:var(--mono);font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text3);text-align:left;padding:8px 12px;border-bottom:2px solid var(--brd2);background:rgba(220,228,238,.6);white-space:nowrap;}
th.r{text-align:right;}
td{padding:7px 12px;border-bottom:1px solid var(--brd);vertical-align:middle;}
td.r{text-align:right;}
tr:hover td{background:rgba(200,212,228,.3);}
td.mono{font-family:var(--mono);font-size:11px;}
td.num{font-family:var(--head);font-size:14px;font-weight:700;color:var(--white);text-align:right;}
td.num.gold{color:var(--gold2);}
td.num.teal{color:var(--teal2);}
td.num.red{color:var(--red2);}
td.num.amber{color:var(--amber2);}
td.muted{color:var(--text3);font-family:var(--mono);font-size:11px;}
.row-latest td{background:rgba(232,160,32,.03);}
.row-locked td{background:rgba(40,120,240,.03);}
.row-risk td{background:rgba(232,48,64,.04);}
.row-warn td{background:rgba(240,144,32,.03);}
.row-credit td{background:rgba(40,120,240,.03);}

/* ── UPLOAD ZONES ── */
.upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;}
.upload-card{background:var(--panel);border:1px solid var(--brd);border-radius:var(--r);padding:20px;}
.uc-title{font-family:var(--head);font-size:18px;font-weight:700;color:var(--white);letter-spacing:.5px;margin-bottom:4px;}
.uc-sub{font-family:var(--mono);font-size:11px;color:var(--text3);margin-bottom:16px;}
.upload-zone{border:2px dashed var(--brd2);border-radius:var(--r);padding:28px;text-align:center;cursor:pointer;transition:all .2s;}
.upload-zone:hover,.upload-zone.drag-over{border-color:var(--gold);background:rgba(232,160,32,.04);}
.upload-zone.ar-zone:hover,.upload-zone.ar-zone.drag-over{border-color:var(--teal);background:rgba(0,192,160,.04);}
.uz-icon{font-size:28px;margin-bottom:10px;}
.uz-title{font-family:var(--head);font-size:17px;font-weight:700;color:var(--white);margin-bottom:4px;}
.uz-sub{font-family:var(--mono);font-size:11px;color:var(--text3);}
.uz-btn{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:11px;font-weight:600;background:var(--gold);color:var(--bg);padding:7px 18px;border-radius:4px;cursor:pointer;border:none;letter-spacing:.5px;transition:background .15s;}
.uz-btn:hover{background:var(--gold2);}
.uz-btn.teal{background:var(--teal);color:var(--bg);}
.uz-btn.teal:hover{background:var(--teal2);}
.uz-btn.blue{background:var(--blue2);color:var(--white);}
.uz-btn.blue:hover{background:#60b0ff;}
input[type=file]{display:none;}

/* ── PROCESS LOG ── */
.proc-log{font-family:var(--mono);font-size:11px;color:var(--text2);background:var(--bg3);border:1px solid var(--brd);border-radius:6px;padding:10px 14px;max-height:120px;overflow-y:auto;margin-top:8px;line-height:1.8;}
.proc-log.visible{display:block;}
.log-ok{color:var(--green2);}
.log-warn{color:var(--amber2);}
.log-err{color:var(--red2);}
.log-info{color:var(--text3);}

/* ── MONTH CALENDAR ── */
.month-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;}
.month-cell{background:var(--bg3);border:1px solid var(--brd);border-radius:5px;padding:10px 8px;text-align:center;}
.month-cell.locked{border-color:var(--blue2);background:rgba(40,120,240,.06);}
.month-cell.current{border-color:var(--gold);background:rgba(232,160,32,.06);}
.month-cell.empty{opacity:.35;}
.mc-name{font-family:var(--head);font-size:13px;font-weight:700;color:var(--white);letter-spacing:.5px;}
.mc-val{font-family:var(--head);font-size:14px;font-weight:700;color:var(--gold2);margin-top:3px;}
.mc-status{margin-top:4px;}

/* ── MODAL ── */
#modal-overlay{position:fixed;inset:0;z-index:800;background:rgba(60,80,100,.5);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;}
#modal-overlay.open{display:flex;}
#modal{background:var(--bg2);border:1px solid var(--brd2);border-radius:var(--r);padding:28px;min-width:400px;max-width:560px;width:90%;}
.modal-title{font-family:var(--head);font-size:22px;font-weight:800;color:var(--white);letter-spacing:.5px;margin-bottom:8px;}
.modal-body{font-size:14px;color:var(--text2);margin-bottom:20px;line-height:1.75;}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;}

/* ── ASK BUILDCORE — Q&A panel ── */
/* Override the global .owner-only display:none rule so the FAB shows for owners */
body.is-owner #ai-fab.owner-only{display:inline-flex !important;}
body.is-owner #ai-panel.owner-only{display:none;}
body.is-owner #ai-panel.owner-only.open{display:flex !important;}
#ai-fab{
  position:fixed;bottom:24px;right:24px;z-index:850;
  background:linear-gradient(135deg,var(--po2) 0%,var(--violet) 100%);color:#fff;border:none;
  border-radius:24px;padding:12px 20px;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.5px;
  box-shadow:0 6px 16px rgba(26,107,181,.35);cursor:pointer;transition:all .15s;
}
#ai-fab:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(26,107,181,.45);}
#ai-panel{
  position:fixed;bottom:24px;right:24px;z-index:851;
  width:420px;max-width:calc(100vw - 48px);height:600px;max-height:calc(100vh - 48px);
  background:var(--panel);border:1px solid var(--brd2);border-radius:12px;
  box-shadow:0 16px 48px rgba(0,0,0,.18);
  display:none;flex-direction:column;overflow:hidden;
}
#ai-panel.open{display:flex;}
#ai-header{
  padding:14px 18px;background:linear-gradient(135deg,var(--po) 0%,var(--violet) 100%);
  color:#fff;display:flex;justify-content:space-between;align-items:center;
}
#ai-title{font-family:var(--head);font-size:15px;font-weight:800;letter-spacing:.5px;}
#ai-sub{font-family:var(--mono);font-size:10px;opacity:.85;margin-top:2px;}
.ai-icon-btn{background:rgba(255,255,255,.18);border:none;color:#fff;cursor:pointer;font-size:16px;line-height:1;padding:4px 10px;border-radius:5px;}
.ai-icon-btn:hover{background:rgba(255,255,255,.28);}
#ai-messages{flex:1;overflow-y:auto;padding:14px 16px;background:var(--bg);font-size:13px;line-height:1.5;}
.ai-msg{margin-bottom:10px;display:flex;}
.ai-msg-user{justify-content:flex-end;}
.ai-msg-assistant,.ai-msg-system{justify-content:flex-start;}
.ai-msg-bubble{max-width:88%;padding:9px 14px;border-radius:14px;font-size:13px;line-height:1.5;}
.ai-msg-user .ai-msg-bubble{background:var(--po2);color:#fff;border-bottom-right-radius:3px;}
.ai-msg-assistant .ai-msg-bubble{background:var(--bg3);color:var(--text);border-bottom-left-radius:3px;}
.ai-msg-system .ai-msg-bubble{background:rgba(160,112,240,.08);color:var(--text2);border:1px solid rgba(160,112,240,.25);}
.ai-dots{display:inline-flex;gap:4px;}
.ai-dots span{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--text3);animation:aiDot 1.2s infinite ease-in-out;}
.ai-dots span:nth-child(2){animation-delay:.15s;}
.ai-dots span:nth-child(3){animation-delay:.3s;}
@keyframes aiDot{0%,80%,100%{transform:scale(.6);opacity:.4;}40%{transform:scale(1);opacity:1;}}
#ai-input-row{padding:10px 12px;border-top:1px solid var(--brd);background:var(--panel);display:flex;gap:8px;align-items:flex-end;}
#ai-input{flex:1;resize:none;border:1px solid var(--brd);border-radius:6px;padding:8px 10px;font-family:var(--body);font-size:13px;color:var(--text);background:var(--bg2);outline:none;}
#ai-input:focus{border-color:var(--po2);}
#ai-send-btn{background:var(--po2);color:#fff;border:none;border-radius:6px;padding:9px 16px;font-family:var(--mono);font-size:11px;font-weight:700;cursor:pointer;letter-spacing:.5px;}
#ai-send-btn:hover{background:var(--po3);}

/* Payroll FY disclosure carets */
details > summary::-webkit-details-marker{display:none;}
details[open] > summary .payroll-fy-caret{transform:rotate(90deg);color:var(--po2);}
.payroll-fy-caret{transition:transform .15s;}

/* ── BUTTONS ── */
.btn{font-family:var(--mono);font-size:11px;font-weight:600;padding:7px 16px;border-radius:4px;cursor:pointer;border:1px solid transparent;letter-spacing:.5px;transition:all .15s;}
.btn-gold{background:var(--gold);color:var(--bg);border-color:var(--gold);}
.btn-gold:hover{background:var(--gold2);}
.btn-teal{background:var(--teal);color:var(--bg);border-color:var(--teal);}
.btn-teal:hover{background:var(--teal2);}
.btn-blue{background:var(--blue2);color:var(--white);}
.btn-blue:hover{background:#60b0ff;}
.btn-sec{background:transparent;color:var(--text2);border-color:var(--brd2);}
.btn-sec:hover{color:var(--text);border-color:var(--brd3);}
.btn-danger{background:var(--red);color:var(--white);}
.btn-danger:hover{background:var(--red2);}

/* ── ALERT ITEMS ── */
.alert-item{display:grid;grid-template-columns:6px 88px 1fr auto;gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--brd);}
.alert-item:last-child{border-bottom:none;}
.al-bar{border-radius:2px;height:100%;min-height:48px;}
.al-bar.high{background:var(--red);}
.al-bar.med{background:var(--amber);}
.al-bar.low{background:var(--gold);}
.al-sev{font-family:var(--mono);font-size:10px;font-weight:600;}
.al-sev.high{color:var(--red2);}
.al-sev.med{color:var(--amber2);}
.al-sev.low{color:var(--gold2);}
.al-module{font-family:var(--mono);font-size:9px;letter-spacing:1px;margin-top:3px;}
.al-text strong{color:var(--white);}
.al-act{font-family:var(--mono);font-size:11px;color:var(--text2);margin-top:4px;}
.al-time{font-family:var(--mono);font-size:10px;color:var(--text3);white-space:nowrap;}

/* ── FILTER ROW ── */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px;}
.search-bar{font-family:var(--mono);font-size:12px;background:var(--bg3);border:1px solid var(--brd2);color:var(--text);padding:8px 14px;border-radius:4px;width:260px;outline:none;}
.search-bar:focus{border-color:var(--teal);}
.fsel{font-family:var(--mono);font-size:11px;background:var(--bg3);border:1px solid var(--brd2);color:var(--text);padding:7px 10px;border-radius:4px;outline:none;}
.fsel:focus{border-color:var(--gold);}

/* ── BULK IMPORT ── */
.bulk-card{background:var(--panel);border:1px solid var(--brd);border-radius:var(--r);padding:20px;margin-top:16px;}
.bulk-row{display:grid;grid-template-columns:82px 92px 1fr auto;gap:8px;align-items:end;margin-bottom:6px;}
.bulk-row input,.bulk-row select{background:var(--bg3);border:1px solid var(--brd2);color:var(--text);font-family:var(--mono);font-size:11px;padding:6px 10px;border-radius:4px;outline:none;}
.bulk-row input:focus,.bulk-row select:focus{border-color:var(--gold);}
.bulk-add-btn{font-family:var(--mono);font-size:11px;color:var(--gold);background:none;border:1px dashed var(--brd2);border-radius:4px;padding:6px 12px;cursor:pointer;margin-top:6px;transition:all .15s;}
.bulk-add-btn:hover{border-color:var(--gold);}
label{font-family:var(--mono);font-size:11px;color:var(--text2);display:block;margin-bottom:4px;}

/* ── HOME DASHBOARD SPLIT ── */
.home-split{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;}
.module-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.module-label{font-family:var(--head);font-size:18px;font-weight:800;letter-spacing:1px;}
.module-label.sales{color:var(--gold);}
.module-label.ar{color:var(--teal2);}
.module-divider{height:2px;width:32px;border-radius:1px;}
.module-divider.sales{background:var(--gold);}
.module-divider.ar{background:var(--teal);}

/* ── MISC ── */
.flex-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.mt12{margin-top:12px;}
.mt20{margin-top:20px;}
.empty-state{text-align:center;padding:40px 24px;}
.es-icon{font-size:32px;margin-bottom:10px;}
.es-title{font-family:var(--head);font-size:17px;font-weight:700;color:var(--white);margin-bottom:4px;}
.es-sub{font-family:var(--mono);font-size:11px;color:var(--text3);}
.fiscal-note{font-family:var(--mono);font-size:11px;color:var(--text3);border-left:3px solid var(--brd2);padding:6px 12px;margin-bottom:16px;}
.no-pmt-pill{display:inline-block;font-family:var(--mono);font-size:10px;padding:1px 6px;border-radius:3px;background:rgba(232,48,64,.1);color:var(--red2);border:1px solid rgba(232,48,64,.2);}

/* ── TOAST ── */
#toast{position:fixed;bottom:24px;right:24px;z-index:1000;background:var(--panel);border:1px solid var(--brd2);border-radius:var(--r);padding:12px 18px;font-family:var(--mono);font-size:12px;color:var(--text);max-width:380px;box-shadow:0 4px 20px rgba(100,130,160,.2);display:none;animation:slideUp .2s ease;}
#toast.show{display:block;}
#toast.success{border-color:rgba(0,200,120,.4);color:var(--green2);}
#toast.error{border-color:rgba(232,48,64,.4);color:var(--red2);}
#toast.warning{border-color:rgba(240,144,32,.4);color:var(--amber2);}
@keyframes slideUp{from{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}

@media(max-width:960px){
  .chart-grid,.home-split,.upload-grid{grid-template-columns:1fr;}
  .month-grid{grid-template-columns:repeat(4,1fr);}
  .kpi-grid{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:600px){
  /* ── Nav ── */
  #topnav { padding:0 12px; height:auto; flex-wrap:wrap; gap:0; }
  #nav-main { display:flex; flex-wrap:nowrap; overflow-x:auto; gap:2px; padding:4px 0; width:100%; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  #nav-main::-webkit-scrollbar { display:none; }
  .nav-btn { font-size:10px; padding:6px 10px; white-space:nowrap; flex-shrink:0; }
  #nav-user { font-size:10px; gap:6px; padding:4px 0; }
  #nav-user-name { display:none; }
  #nav-logout { font-size:10px; padding:4px 8px; }

  /* ── Subnav ── */
  #subnav { padding:0 12px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  #subnav::-webkit-scrollbar { display:none; }
  #subnav span { flex-wrap:nowrap; }
  .sub-btn { font-size:10px; padding:6px 8px; white-space:nowrap; flex-shrink:0; }

  /* ── Tab content ── */
  .tab { padding:52px 12px 32px; }
  body.has-subnav .tab { padding-top:90px; }

  /* ── Grids ── */
  .kpi-grid { grid-template-columns:1fr 1fr; gap:8px; }
  .month-grid { grid-template-columns:repeat(2,1fr); }
  .chart-grid,.chart-grid-3,.home-split,.upload-grid { grid-template-columns:1fr; }
  .sec-head { flex-direction:column; gap:8px; }
  .sec-head .flex-row { flex-wrap:wrap; gap:6px; }

  /* ── KPI cards ── */
  .kpi { padding:10px 12px; }
  .kpi-value { font-size:22px !important; }

  /* ── Tables — horizontal scroll ── */
  .tbl-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .data-tbl { min-width:480px; }

  /* ── PO list rows ── */
  #po-list-body > div > div:first-child {
    grid-template-columns:90px 50px 1fr 100px 70px 0 0 !important;
  }

  /* ── Cards ── */
  .card-head { flex-wrap:wrap; gap:6px; }
  .card-body { padding:12px; }

  /* ── Modal ── */
  #modal { min-width:unset; width:95%; padding:20px 16px; max-height:85vh; overflow-y:auto; }

  /* ── Upload zones ── */
  .upload-card { padding:12px; }
  .upload-zone { padding:20px 12px; }

  /* ── Inputs / selects ── */
  .fsel { font-size:11px; padding:6px 8px; }
  .search-bar { font-size:12px; }

  /* ── KPI label ── */
  .kpi-label { font-size:8px; letter-spacing:1px; }

  /* ── Sections ── */
  .sec-title { font-size:16px; }
  .sec-sub { font-size:11px; }

  /* ── Toast ── */
  #toast { right:12px; left:12px; max-width:unset; font-size:11px; }

  /* ── Reset button in nav ── */
  #nav-user button[onclick*="resetAllData"] { display:none; }
}
/* ── Login screen ── */
#login-screen{position:fixed;inset:0;background:var(--bg);z-index:99999;display:flex;align-items:center;justify-content:center;padding:24px;}
#login-screen.hidden{display:none;}
.login-card{width:100%;max-width:400px;background:var(--bg2);border:1px solid var(--brd);border-radius:10px;overflow:hidden;box-shadow:0 8px 40px rgba(100,130,160,.2);}
.login-header{background:linear-gradient(135deg,#0a1628 0%,#0f2240 100%);padding:32px 32px 24px;border-bottom:1px solid var(--brd);}
.login-logo{font-family:var(--head);font-size:22px;font-weight:900;color:var(--white);letter-spacing:1px;margin-bottom:4px;}
.login-logo span{color:var(--po3);}
.login-store{font-family:var(--mono);font-size:10px;color:var(--text3);letter-spacing:.5px;}
.login-body{padding:28px 32px 32px;}
.login-field{margin-bottom:18px;}
.login-label{display:block;font-family:var(--mono);font-size:10px;color:var(--text3);letter-spacing:.5px;margin-bottom:6px;}
.login-input{width:100%;background:var(--bg);border:1px solid var(--brd);border-radius:5px;padding:10px 14px;font-family:var(--mono);font-size:13px;color:var(--white);outline:none;box-sizing:border-box;transition:border-color .15s;}
.login-input:focus{border-color:var(--po2);}
.login-btn{width:100%;background:var(--po2);color:#fff;border:none;border-radius:5px;padding:12px;font-family:var(--head);font-size:13px;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:background .15s;margin-top:4px;}
.login-btn:hover{background:var(--po);}
.login-btn:disabled{opacity:.5;cursor:not-allowed;}
.login-error{background:rgba(232,48,64,.12);border:1px solid rgba(232,48,64,.3);border-radius:4px;padding:10px 14px;font-family:var(--mono);font-size:11px;color:var(--red2);margin-bottom:16px;display:none;}
.login-error.show{display:block;}
.login-footer{font-family:var(--mono);font-size:10px;color:var(--text3);text-align:center;margin-top:20px;}
/* Nav user badge */
#nav-user{font-family:var(--mono);font-size:10px;color:var(--text3);display:flex;align-items:center;gap:10px;margin-left:auto;}
#nav-user-name{color:var(--text);}
#nav-logout{background:none;border:1px solid var(--brd);border-radius:3px;color:var(--text3);font-family:var(--mono);font-size:9px;padding:3px 8px;cursor:pointer;letter-spacing:.3px;}
#nav-logout:hover{border-color:var(--red2);color:var(--red2);}

/* ── Owner-only visibility ─────────────────────────── */
.bank-sec-btn{font-family:var(--mono);font-size:10px;letter-spacing:.5px;color:var(--text3);background:none;border:none;border-bottom:2px solid transparent;padding:8px 18px;cursor:pointer;transition:color .15s,border-color .15s;}
.bank-sec-btn:hover{color:var(--text);}
.bank-sec-btn.active{color:var(--po2);border-bottom-color:var(--po2);}
/* Contractor portal — hide all staff nav */
body.is-contractor #topbar .nav-btn:not(.ctr-allowed) { display:none !important; }
body.is-contractor #topbar .tb-brand { pointer-events:none; }
body.is-contractor .tab:not(#tab-contractor-dash) { display:none !important; }
body.is-contractor #tab-contractor-dash { display:block !important; }
body.is-contractor #subnav { display:none !important; }
body.is-contractor #topbar { justify-content:flex-start; gap:0; }
.club-bar{height:18px;background:var(--bg3);border-radius:4px;overflow:hidden;margin:6px 0;}
.club-fill{height:100%;background:linear-gradient(90deg,var(--gold2),var(--gold));border-radius:4px;transition:width .4s;}

body.is-owner .nav-btn.owner-only { display: inline !important; }
body.is-owner .tb-right span.owner-only { display: inline-flex !important; }


body.is-purchasing-only .nav-btn:not([onclick*="'purchasing'"]) { display: none !important; }
body.is-purchasing-only #subnav-sales,
body.is-purchasing-only #subnav-acct,
body.is-purchasing-only #subnav-inv,
body.is-purchasing-only #subnav-hh { display: none !important; }
body.is-purchasing-only #subnav-po .sub-btn[onclick*="upload"],
body.is-purchasing-only #subnav-po .sub-btn[onclick*="po-ratings"] { display: none !important; }


body.is-sales-only .nav-btn:not([onclick*="'sales'"]) { display: none !important; }
body.is-sales-only #subnav-po,
body.is-sales-only #subnav-hh { display: none !important; }
body.is-sales-only #subnav-sales .sub-btn[onclick*="upload"],
body.is-sales-only #subnav-sales .sub-btn[onclick*="history"],
body.is-sales-only #subnav-sales .sub-btn[onclick*="sales-dash"],
body.is-sales-only #subnav-sales .sub-btn[onclick*="sales-windows"] { display: none !important; }

.eq-label { display:block; font-family:var(--mono); font-size:10px; color:var(--text3); letter-spacing:.5px; margin-bottom:4px; }
.eq-input  { width:100%; background:var(--bg3); border:1px solid var(--brd); border-radius:4px; padding:8px 10px; font-family:var(--mono); font-size:12px; color:var(--white); box-sizing:border-box; }
.eq-input:focus { outline:none; border-color:var(--teal2); }
.eq-input[readonly] { cursor:default; }
select.eq-input option { background:var(--bg3); color:var(--white); }