/* GarageWiz — layout & responsive */

/* user menu rows */
.menu-row{ display:flex; align-items:center; gap:11px; width:100%; text-align:left; border:none; background:transparent;
  padding:12px 16px; font-size:14.5px; font-weight:600; color:var(--ink); cursor:pointer; }
.menu-row:hover{ background:var(--field); }
.menu-row svg{ color:var(--ink-3); }

/* tile grids */
.tile-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.tile-grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }

/* ===== Configurator layout ===== */
.config-wrap{ display:grid; grid-template-columns:248px minmax(0,1fr) 372px; min-height:calc(100vh - 70px); }
.config-rail{ background:var(--navy); padding:22px 12px; position:sticky; top:70px; height:calc(100vh - 70px); overflow-y:auto; }
.config-main{ padding:34px 44px; display:flex; flex-direction:column; min-width:0; }
.config-body{ flex:1; width:100%; max-width:660px; }
.config-nav{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:34px; padding-top:22px; border-top:1px solid var(--line); max-width:660px; }
.config-nav-mobileprice{ display:none; text-align:center; }
.config-price{ background:#fff; border-left:1px solid var(--line); padding:26px 24px; position:sticky; top:70px; height:calc(100vh - 70px); overflow-y:auto; }

/* mobile horizontal stepper (hidden on desktop) */
.config-progress{ display:none; gap:6px; align-items:center; margin-bottom:22px; }
.config-progress .cp-track{ flex:1; height:8px; background:var(--field); border-radius:999px; overflow:hidden; }
.config-progress .cp-fill{ height:100%; background:linear-gradient(90deg,var(--blue),var(--teal)); border-radius:999px; transition:width .3s; }
.config-progress .cp-label{ font-weight:800; font-size:12px; letter-spacing:.08em; color:var(--blue); white-space:nowrap; }

/* ===== price tables (admin) ===== */
.price-table{ width:100%; border-collapse:collapse; min-width:760px; }
.price-table th{ font-family:var(--body); font-size:11.5px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-3); padding:8px 6px; text-align:center; white-space:nowrap; }
.price-table td{ padding:4px 5px; text-align:center; border-top:1px solid var(--line); }
.price-cell{ width:74px; padding:8px 6px; border:1.5px solid transparent; border-radius:8px; background:var(--field); text-align:right; font-size:14px; font-weight:600; font-variant-numeric:tabular-nums; outline:none; color:var(--ink); }
.price-cell:hover{ border-color:var(--line-2); }
.price-cell:focus{ border-color:var(--blue); background:#fff; box-shadow:var(--ring); }

/* ===== admin generic tables ===== */
.table-head6,.table-row6{ display:grid; grid-template-columns:2.4fr .9fr .8fr .8fr 1fr 1.1fr; gap:14px; align-items:center; padding:14px 22px; }
.table-head-parts,.table-row-parts{ display:grid; grid-template-columns:1.7fr 0.8fr 0.7fr 1.6fr 0.8fr 1.4fr; gap:14px; align-items:center; padding:13px 22px; }
.table-head-users,.table-row-users{ display:grid; grid-template-columns:2.4fr 1fr 1fr 1.4fr; gap:14px; align-items:center; padding:13px 22px; }
.table-head-act,.table-row-act{ display:grid; grid-template-columns:1.6fr .8fr 1.1fr 1fr 1.3fr 1.4fr; gap:14px; align-items:center; padding:14px 22px; }
[class^="table-head"]{ background:var(--field); border-bottom:1px solid var(--line); font-family:var(--body); font-size:11.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); }
[class^="table-row"]{ border-top:1px solid var(--line); }
[class^="table-row"]:first-of-type{ border-top:none; }

/* dealer range slider */
.dealer-range{ -webkit-appearance:none; appearance:none; height:8px; border-radius:999px; background:rgba(255,255,255,.15); outline:none; }
.dealer-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:24px; height:24px; border-radius:999px; background:var(--yellow); cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.4); border:3px solid #fff; }
.dealer-range::-moz-range-thumb{ width:24px; height:24px; border-radius:999px; background:var(--yellow); cursor:pointer; border:3px solid #fff; }

/* ===== Responsive ===== */
@media (max-width:1180px){
  .config-wrap{ grid-template-columns:minmax(0,1fr) 340px; }
  .config-rail{ display:none; }
  .config-progress{ display:flex; }
  .config-main{ padding:28px 30px; }
}
@media (max-width:980px){
  .parts-sale-grid{ grid-template-columns:1fr !important; }
  .parts-ticket{ position:static !important; }
  .hub-grid{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:600px){
  .hub-grid{ grid-template-columns:1fr !important; }
}
@media (max-width:860px){
  .login-brand{ display:none !important; }
  .login-brand-sm{ display:block !important; }
  .admin-2col{ grid-template-columns:1fr !important; }
  .quote-grid{ grid-template-columns:1fr !important; }
  .dash-cols{ grid-template-columns:1fr !important; }
  .module-grid{ grid-template-columns:1fr !important; }
  .admin-side{ display:none; }
  .admin-main{ padding:26px 20px 70px !important; }
}
@media (max-width:820px){
  .config-wrap{ display:flex; flex-direction:column; }
  .config-price{ position:static; height:auto; border-left:none; border-top:1px solid var(--line); }
  .config-main{ order:1; }
  .config-price{ order:2; }
  .nav-label{ display:none; }
  .topnav{ display:none !important; }
  .topnav-mobile{ display:flex !important; }
  .tile-grid-3{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:680px){
  .tile-grid-2{ grid-template-columns:1fr; }
  .table-head6,.table-head-act{ display:none; }
  .table-row6{ grid-template-columns:1fr 1fr; }
  .table-row-act{ grid-template-columns:1fr 1fr; gap:8px; }
  .table-head-parts,.table-head-users{ display:none; }
  .table-row-parts,.table-row-users{ grid-template-columns:1fr; gap:10px; }
  .dash-mascot{ display:none; }
  .config-nav-mobileprice{ display:block; }
  .stat-strip{ grid-template-columns:repeat(2,1fr) !important; }
}

/* ===== Print (quote sheet) ===== */
@media print{
  body{ background:#fff; }
  header, .no-print, .config-rail, .config-price{ display:none !important; }
  .print-only{ display:block !important; }
  .quote-sheet{ box-shadow:none !important; border:1px solid #ccc; }
  @page{ margin:1.5cm; }
}
