/* ------------------------------------------------------------------
   Application chrome: topbar, dashboard, tabs, upload.
   The offer sheet itself keeps its own styling in styles.css so the
   print layout is unaffected by anything here.
------------------------------------------------------------------- */

body.app{
  background:#e8e5df;
  font-family:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,sans-serif;
  color:#0a0a0a;margin:0;
}

/* ---------- topbar ---------- */
.topbar{background:#0a0a0a;color:#fbfaf8;position:sticky;top:0;z-index:20;}
.topbar-in{
  max-width:1080px;margin:0 auto;padding:0 28px;height:54px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.bm-name{font-size:11px;text-transform:uppercase;letter-spacing:.28em;}
.topnav{display:flex;gap:22px;}
.topnav a{
  color:#8a857c;text-decoration:none;font-size:11px;text-transform:uppercase;
  letter-spacing:.16em;padding:4px 0;border-bottom:1px solid transparent;
}
.topnav a:hover{color:#fbfaf8;}
.topnav a.on{color:#fbfaf8;border-bottom-color:#b8952f;}

/* ---------- page ---------- */
.page{max-width:1080px;margin:0 auto;padding:34px 28px 72px;}
@media(max-width:720px){.page{padding:22px 16px 48px;}.topbar-in{padding:0 16px;}}

.pagehead{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin-bottom:26px;
}
.pagehead h1{
  font-family:"Cormorant Garamond",serif;font-weight:300;font-size:40px;
  margin:0;letter-spacing:-.015em;
}

/* ---------- stats ---------- */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:#dedad2;border:1px solid #dedad2;margin-bottom:22px;
}
@media(max-width:720px){.stats{grid-template-columns:repeat(2,1fr);}}
.stat{background:#fbfaf8;padding:18px 20px;}
.stat-n{
  display:block;font-family:"Cormorant Garamond",serif;font-size:30px;
  line-height:1;font-weight:400;
}
.stat-l{
  display:block;margin-top:7px;font-size:9px;text-transform:uppercase;
  letter-spacing:.18em;color:#8a857c;
}

/* ---------- panels ---------- */
.panel{background:#fbfaf8;border:1px solid #dedad2;padding:22px 24px;margin-bottom:22px;}
.panel-h{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin-bottom:16px;flex-wrap:wrap;
}
.panel-h h2{
  font-size:10px;text-transform:uppercase;letter-spacing:.24em;font-weight:600;margin:0;
}
.hint{font-size:11px;color:#8a857c;}

/* ---------- dropzone ---------- */
.drop{
  border:1px dashed #cfcabf;background:#f6f4ef;padding:38px 20px;text-align:center;
  cursor:pointer;transition:border-color .15s,background .15s;outline:none;
}
.drop:hover,.drop:focus-visible{border-color:#0a0a0a;background:#f2efe9;}
.drop.over{border-color:#b8952f;background:#f7f2e4;border-style:solid;}
.drop-in{display:flex;flex-direction:column;align-items:center;gap:8px;}
.drop-ico{width:30px;height:30px;color:#a8a49b;stroke-linecap:round;stroke-linejoin:round;}
.drop-t{font-size:13px;}
.drop-s{font-size:11px;color:#8a857c;}
.linkbtn{
  background:none;border:0;padding:0;font:inherit;color:#0a0a0a;
  text-decoration:underline;cursor:pointer;
}
.spinner{
  width:22px;height:22px;border:2px solid #dedad2;border-top-color:#0a0a0a;
  border-radius:50%;animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
@media(prefers-reduced-motion:reduce){.spinner{animation-duration:2s;}}

/* ---------- parse result ---------- */
.parseresult{margin-top:16px;border:1px solid #dedad2;background:#fff;padding:16px 18px;}
.pr-h{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;}
.pr-model{font-family:"Cormorant Garamond",serif;font-size:26px;line-height:1.1;}
.pr-meta{font-size:11px;color:#8a857c;margin-top:3px;}
.pr-badge{
  font-size:9px;text-transform:uppercase;letter-spacing:.14em;padding:3px 8px;
  border:1px solid currentColor;white-space:nowrap;
}
.pr-badge.ok{color:#2f6b45;}
.pr-badge.warn{color:#9a6b1e;}
.pr-badge.bad{color:#a13a2a;}
.pr-figs{
  display:flex;gap:26px;flex-wrap:wrap;margin-top:14px;padding-top:14px;
  border-top:1px solid #eeebe4;
}
.pr-fig .n{display:block;font-size:15px;font-variant-numeric:tabular-nums;}
.pr-fig .l{
  display:block;font-size:9px;text-transform:uppercase;letter-spacing:.16em;
  color:#8a857c;margin-top:3px;
}
.pr-act{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap;}
.pr-warn{
  margin-top:12px;font-size:11.5px;color:#9a6b1e;line-height:1.6;
  background:#fdf8ec;border-left:2px solid #d9b25f;padding:9px 12px;
}
.pr-err{
  margin-top:0;font-size:12px;color:#a13a2a;line-height:1.6;
  background:#fdf1ef;border-left:2px solid #d08a7c;padding:11px 13px;
}

/* ---------- filters ---------- */
.filters{display:flex;gap:6px;}
.chip{
  font-size:10px;text-transform:uppercase;letter-spacing:.12em;
  border:1px solid #dedad2;background:transparent;padding:4px 10px;cursor:pointer;
  font-family:inherit;color:#8a857c;
}
.chip:hover{border-color:#0a0a0a;color:#0a0a0a;}
.chip.on{background:#0a0a0a;color:#fbfaf8;border-color:#0a0a0a;}

/* ---------- offer list ---------- */
.olist{border-top:1px solid #eeebe4;}
.orow{
  display:grid;grid-template-columns:auto 1fr auto auto;gap:16px;align-items:center;
  padding:13px 0;border-bottom:1px solid #eeebe4;text-decoration:none;color:inherit;
}
@media(max-width:720px){
  .orow{grid-template-columns:auto 1fr;row-gap:6px;}
  .orow .o-tot,.orow .o-when{grid-column:2;text-align:left;}
}
.orow:hover{background:#f6f4ef;}
.o-dot{width:7px;height:7px;border-radius:50%;background:#b8952f;}
.o-dot.bentley{background:#1f3d2f;}
.o-main{min-width:0;}
.o-model{font-size:14px;}
.o-sub{font-size:11px;color:#8a857c;margin-top:2px;}
.o-tot{font-size:14px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;}
.o-when{font-size:11px;color:#8a857c;text-align:right;white-space:nowrap;}
.o-status{
  font-size:9px;text-transform:uppercase;letter-spacing:.14em;color:#8a857c;
  border:1px solid #dedad2;padding:2px 7px;margin-left:8px;
}
.o-status.sent{color:#2f6b45;border-color:#bcd4c4;}
.o-status.accepted{color:#0a0a0a;border-color:#0a0a0a;}

.emptystate{
  padding:42px 0;text-align:center;color:#a8a49b;font-size:12.5px;line-height:1.8;
}

/* ---------- buttons ---------- */
.act{
  font-size:11px;letter-spacing:.06em;padding:9px 18px;cursor:pointer;
  font-family:inherit;border:1px solid #0a0a0a;background:#0a0a0a;color:#fbfaf8;
  text-decoration:none;display:inline-block;
}
.act.ghost{background:transparent;color:#0a0a0a;}
.act:hover{opacity:.84;}
.act:disabled{opacity:.4;cursor:not-allowed;}

/* ---------- tabs (offer page) ---------- */
.tabs{
  display:flex;gap:0;border-bottom:1px solid #dedad2;margin-bottom:0;
  background:#fbfaf8;
}
.tab{
  font-size:10px;text-transform:uppercase;letter-spacing:.18em;
  background:transparent;border:0;border-bottom:2px solid transparent;
  padding:13px 18px;cursor:pointer;font-family:inherit;color:#8a857c;
}
.tab:hover{color:#0a0a0a;}
.tab.on{color:#0a0a0a;border-bottom-color:#0a0a0a;}
.tab .badge{
  display:inline-block;margin-left:7px;font-size:9px;color:#8a857c;
  letter-spacing:.04em;
}
.tabpanel[hidden]{display:none;}

/* ---------- forms ---------- */
.fieldgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 24px;}
@media(max-width:720px){.fieldgrid{grid-template-columns:1fr;}}
.fieldgrid.two{grid-template-columns:repeat(2,1fr);}
@media(max-width:720px){.fieldgrid.two{grid-template-columns:1fr;}}
.f{display:block;}
.f .lbl{
  font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:#8a857c;
  display:block;margin-bottom:5px;
}
.f input,.f select,.f textarea{
  width:100%;padding:8px 10px;border:1px solid #dedad2;background:#fff;
  font-family:inherit;font-size:14px;color:#0a0a0a;border-radius:0;
}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:#0a0a0a;}
.f textarea{resize:vertical;min-height:76px;line-height:1.6;}
.f .note{font-size:10.5px;color:#a8a49b;margin-top:5px;display:block;}
.f input[type=number]{text-align:right;font-variant-numeric:tabular-nums;}

.savebar{
  position:sticky;bottom:0;background:#fbfaf8;border-top:1px solid #dedad2;
  padding:14px 0;margin-top:26px;display:flex;gap:10px;align-items:center;
  flex-wrap:wrap;
}
.savebar .spacer{flex:1;}
.savenote{font-size:11px;color:#8a857c;}

@media print{
  .topbar,.tabs,.savebar,.pagehead{display:none!important;}
  body.app{background:#fff;}
  .page{padding:0;max-width:none;}
}

/* preview read-only values */
.party .pv{
  font-size:14px;padding:3px 0 5px;border-bottom:1px solid var(--rule);
  min-height:20px;
}
#tab-preview .sheet{margin:0 auto;max-width:860px;}

/* ---------- dealer item quick-add ---------- */
.dealeritems{
  margin-top:20px;padding-top:16px;border-top:1px solid #eeebe4;
}
.di-lbl{
  font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:#8a857c;
  display:block;margin-bottom:9px;
}
.di-buttons{display:flex;gap:8px;flex-wrap:wrap;}
.di-buttons .addbtn{
  font-size:10px;letter-spacing:.04em;text-transform:none;padding:6px 11px;
}
.di-buttons .addbtn.used{
  opacity:.35;cursor:default;border-style:dashed;
}
.di-buttons .addbtn.used:hover{
  background:transparent;color:#0a0a0a;border-color:#dedad2;
}