/* Construction catalogue follows the questions workspace's visual language. */
body.construction-page {
  --bg: #f5f4ef;
  --surface: #fcfdf9;
  --text: #252b24;
  --muted: #50584d;
  --muted2: #697161;
  --border: #dce1d5;
  --border2: #9ba88f;
  --accent: #303b2c;
  --radius-sm: 5px;
  --radius-md: 5px;
  --radius-lg: 5px;
  --pill: 5px;
  --shadow-sm: none;
  --shadow-md: 0 12px 32px rgba(37,43,36,.08);
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: 'Pretendard Variable', Pretendard, sans-serif;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
.construction-page button, .construction-page input,
.construction-page select, .construction-page textarea { font-family: inherit; }
.construction-page a { color: inherit; text-underline-offset: 4px; }
.construction-page :is(a,button,input,select,textarea):focus-visible {
  outline: 2px solid #526648 !important;
  outline-offset: 3px;
}
.construction-header {
  max-width: 1200px;
  margin: auto;
  padding: 25px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid var(--border);
}
.construction-brand { display:flex; gap:10px; align-items:center; font-size:22px; font-weight:700; text-decoration:none; white-space:nowrap; }
.construction-brand img { width:26px; height:26px; object-fit:contain; }
.construction-brand-sub { font-size:13px; font-weight:400; }
.construction-nav { display:flex; align-items:center; gap:20px; flex-wrap:wrap; justify-content:flex-end; }
.construction-nav a { text-decoration:underline; font-size:14px; }
.construction-nav .construction-utility { font-size:12px; color:var(--muted); }
.construction-main { max-width:1200px; margin:auto; padding:48px 32px 48px; }
.construction-intro { margin-bottom:32px; }
.construction-eyebrow { color:var(--muted); font-size:12px; letter-spacing:2px; }
.construction-intro h1 { font-size:48px; line-height:1.2; font-weight:550; letter-spacing:-1.5px; margin:18px 0; }
.construction-intro > p:not(.construction-eyebrow) { color:var(--muted); font-size:15px; line-height:1.75; }
.construction-intro-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:20px; }
.construction-intro-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 16px; border-radius:5px; font-size:14px; }
.construction-action-primary { background:var(--accent); color:#fff !important; border:1px solid var(--accent); }
.construction-action-primary:hover { background:#414d39; }
.construction-action-secondary { border:1px solid var(--border2); }
.construction-action-secondary:hover { background:#e9eddf; }
.construction-page .ref-doc-bar { background:transparent; border:1px solid var(--border); border-radius:5px; padding:14px 16px; margin-bottom:24px; }
.construction-page .ref-doc-bar-inner { gap:8px; align-items:center; }
.construction-page .ref-doc-label { font-size:13px; color:var(--muted); font-weight:600; margin-right:8px; }
.construction-page .ref-doc-chip { border:1px solid var(--border); border-radius:5px; background:var(--surface); color:var(--muted); padding:5px 10px; line-height:1.5; font-size:12px; }
.construction-page .ref-doc-chip:hover { border-color:var(--border2); background:#e9eddf; color:var(--text); }
.construction-page .ref-doc-add-btn, .construction-page .ref-doc-upload-form button { background:var(--surface); color:var(--text); border:1px solid var(--border2); border-radius:5px; }
.construction-page .mode-toggle { padding:0 0 20px; background:transparent; border-bottom:1px solid var(--border); gap:10px; flex-wrap:wrap; align-items:center; }
.construction-page .mode-toggle button { min-height:44px; padding:10px 16px; border:1px solid var(--border2); border-radius:5px; background:transparent; color:var(--text); font-size:14px; font-weight:500; }
.construction-page .mode-toggle button.active { background:#e4e9dc; border-color:#8c9b7e; color:var(--text); }
.construction-page #quickEstBtn { background:var(--accent) !important; color:#fff !important; border-color:var(--accent) !important; }
.construction-page .mode-toggle button:hover { background:#e9eddf; }
.construction-page #quickEstBtn:hover { background:#414d39 !important; }
.construction-page .mode-toggle-hint { color:var(--muted); font-size:13px; line-height:1.65; flex:1 1 430px; margin-left:4px; }
.construction-page .stmt-wrap { width:100%; max-width:none; margin:0; padding:24px 0 0; }
.construction-page .stmt-filterbar { gap:10px; align-items:center; margin-bottom:12px; }
.construction-page .stmt-filterbar :is(input,select) { min-height:44px; padding:10px 12px; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:5px; font-size:14px; }
.construction-page .stmt-filterbar #stmt-search-input { width:240px; }
.construction-page .stmt-filterbar button { min-height:44px; padding:10px 18px; background:var(--accent); color:#fff; border:1px solid var(--accent); border-radius:5px; font-size:14px; }
.construction-page .stmt-filterbar > a { color:var(--muted) !important; text-decoration:underline; font-size:13px; }
.construction-page .stmt-count { color:var(--muted); font-size:13px; margin-left:auto; }
.construction-page .stmt-toolbar { margin:0 0 16px; gap:8px; flex-wrap:wrap; }
.construction-page .stmt-btn { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:8px 12px; border:1px solid var(--border); border-radius:5px; background:transparent; color:var(--text); font-size:13px; font-weight:400; line-height:1.5; }
.construction-page .stmt-btn:hover { background:#e9eddf; border-color:var(--border2); }
.construction-page .stmt-tbl-scroll { border:1px solid var(--border); border-radius:5px; background:var(--surface); max-width:100%; scrollbar-color:#9ba88f #e9eddf; }
.construction-page .stmt-tbl { font-size:13px; background:var(--surface); }
.construction-page .stmt-tbl th { padding:13px 10px; background:#eef1e7; color:#50584d; border-bottom:1px solid var(--border); font-size:12px; font-weight:600; line-height:1.5; }
.construction-page .stmt-tbl th small { font-size:11px; }
.construction-page .stmt-major-row td { padding:12px 14px; background:#e4e9dc; color:var(--text); border-bottom:1px solid #cdd5c1; font-weight:600; font-size:14px; }
.construction-page .stmt-major-row.open td { background:#dbe3cf; }
.construction-page .stmt-major-row:hover td { background:#dbe3cf; }
.construction-page .stmt-wt-row td { padding:10px 14px 10px 28px; background:#f0f2e9; color:#414b38; border-bottom:1px solid var(--border); font-weight:500; }
.construction-page .stmt-wt-row.open td, .construction-page .stmt-wt-row:hover td { background:#e9eddf; }
.construction-page .stmt-group-count { margin-left:8px; color:#697161; font-size:12px; font-weight:400; }
.construction-page .stmt-item-row td { padding:9px 8px; border-bottom:1px solid #e7eade; color:var(--text); }
.construction-page .stmt-item-row:hover td { background:#f1f4ea; }
.construction-page .stmt-item-row .stmt-title { line-height:1.55; }
.construction-page .stmt-title a { font-weight:500; color:var(--text); }
.construction-page .stmt-title a:hover { color:#526648; text-decoration:underline; }
.construction-page .stmt-title small { color:var(--muted) !important; }
.construction-page .stmt-unit-total { font-weight:600; color:var(--text); }
.construction-page .stmt-subtotal { color:#3d5331 !important; font-weight:600; font-variant-numeric:tabular-nums; }
.construction-page .stmt-qty-input { width:70px; min-height:40px; padding:8px 7px; border:1px solid var(--border); border-radius:5px; color:var(--text); background:var(--surface); font:inherit; text-align:right; font-variant-numeric:tabular-nums; }
.construction-page .stmt-cons-auto { color:#697161; font-size:12px; }
.construction-page .stmt-cons-auto:hover { color:#3d5331; }
.construction-page .stmt-cart-badge { border-radius:3px; background:#e4e9dc; color:#414b38; font-size:11px; font-weight:500; }
.construction-page .stmt-cart-save-btn { background:#e4e9dc; border-color:#9ba88f; color:#303b2c; border-radius:5px; }
.construction-page .stmt-cart-remove-btn { background:#f4e8e2; border-color:#dbc2b5; color:#854a39; border-radius:5px; }
.construction-page .stmt-cost-edit-btn { color:#526648; border-radius:5px; }
.construction-page .stmt-bar { gap:12px; align-items:center; border:1px solid #c5cfb8; border-radius:5px; background:#e9eddf; color:var(--text); padding:16px; margin-top:16px; box-shadow:0 -4px 18px rgba(37,43,36,.04); }
.construction-page .stmt-bar-total { font-size:14px; font-weight:400; line-height:1.8; flex:1 1 600px; }
.construction-page .stmt-bar-total > span { color:var(--muted) !important; }
.construction-page .stmt-bar b { color:#303b2c; font-weight:650; font-variant-numeric:tabular-nums; }
.construction-page .stmt-bar button.primary { min-height:44px; padding:10px 20px; background:var(--accent); color:#fff; border:1px solid var(--accent); border-radius:5px; font-size:14px; font-weight:500; }
.construction-page .stmt-bar-hint { color:var(--muted); font-size:12px; }
.construction-page #scrollTopBtn { border:1px solid var(--border2); background:var(--surface); color:var(--muted); border-radius:5px; box-shadow:none; font-size:12px; padding:8px 10px; min-height:40px; bottom:18px; right:18px; }
/* Alternate input modes keep their existing layout and operations. */
.construction-page .container { max-width:none; padding:24px 0 0; gap:24px; }
.construction-page .sidebar { background:var(--surface); border:1px solid var(--border); border-radius:5px; box-shadow:none; }
.construction-page .category-list a { border-radius:5px; }
.construction-page .category-list a:hover, .construction-page .category-list .active { background:#e4e9dc; }
.construction-page :is(.shop-topbar,.shop-banner,.shop-banner2,.top-bar,.card,.qe-tbl) { background:var(--surface); border:1px solid var(--border); border-radius:5px; box-shadow:none; }
.construction-page :is(.shop-banner,.shop-banner2)::before { display:none; }
.construction-page :is(.shop-topbar,.shop-banner,.shop-banner2,.top-bar) :is(a,button) { border-radius:5px !important; background:var(--surface) !important; color:var(--text) !important; border-color:var(--border2) !important; box-shadow:none !important; }
.construction-page .filters :is(input,select) { background:var(--surface); border-color:var(--border); border-radius:5px; }
.construction-page .card:hover { transform:none; background:#f1f4ea; border-color:var(--border2); box-shadow:none; }
.construction-page .card-price { font-weight:600; }
.construction-page .qe-panel { max-width:none; margin:24px 0; padding:0; }
.construction-page .qe-btn { background:transparent; color:var(--text); border-color:var(--border2); border-radius:5px; min-height:40px; }
.construction-page .qe-btn.primary { background:var(--accent); color:#fff; border-color:var(--accent); }
.construction-page .qe-tbl th { background:#eef1e7; color:var(--muted); }
.construction-page .qe-tbl input { border-color:var(--border); color:var(--text); background:var(--surface); border-radius:5px; }
.construction-page .qe-tbl .picked { background:#e9eddf; border-color:var(--border2); }
.construction-page .qe-suggest { background:var(--surface); border-color:var(--border); border-radius:5px; }
.construction-page .qe-suggest li:hover { background:#e4e9dc; }
/* Dialogs follow the same panel, field and action treatment as questions. */
.construction-page .stmt-modal { color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:5px; max-height:90vh; overflow-y:auto; }
.construction-page .stmt-modal :is(input,select) { color:var(--text); background:var(--surface); border-color:var(--border); min-height:44px; border-radius:5px; }
.construction-page .stmt-modal button { border-radius:5px; }
.construction-page .stmt-modal button.primary { background:var(--accent); }
.construction-page #qestOverlay { background:rgba(37,43,36,.48) !important; padding:20px; }
.construction-page #qestModal { background:var(--surface) !important; border:1px solid var(--border); border-radius:5px !important; padding:28px !important; max-width:100% !important; box-shadow:0 20px 60px rgba(37,43,36,.16) !important; }
.construction-page #qestTitle { font-size:24px !important; line-height:1.4; font-weight:600; color:var(--text) !important; }
.construction-page #qestModal > div:nth-child(2) { font-size:13px !important; color:var(--muted) !important; line-height:1.65; margin:8px 0 20px !important; }
.construction-page #qestModal label { color:var(--muted) !important; font-size:13px !important; }
.construction-page #qestModal :is(input:not([type=checkbox]),select) { width:100%; min-height:44px; padding:10px 12px !important; color:var(--text); background:var(--surface); border:1px solid var(--border) !important; border-radius:5px !important; font:inherit !important; font-size:14px !important; }
.construction-page #qestModal input[type=checkbox] { accent-color:var(--accent); width:16px; height:16px; vertical-align:middle; }
.construction-page #qestModal button { min-height:44px; border-radius:5px !important; font-family:inherit; }
.construction-page #qestModal button[onclick="closeQuickEstimate()"] { padding:6px 12px; color:var(--muted) !important; font-size:20px !important; }
.construction-page #qestModal button:is([onclick="runQuickEstimate()"],[onclick="applyQuickEstimate()"]) { background:var(--accent) !important; color:#fff !important; font-size:14px !important; font-weight:500 !important; }
.construction-page #qestModal button[onclick="backToQuickEstimateForm()"] { background:var(--surface) !important; color:var(--text); border-color:var(--border2) !important; }
.construction-page .qest-result-summary { background:#e9eddf !important; border-color:var(--border) !important; border-radius:5px !important; }
.construction-page #qestGrandTotal { color:#303b2c !important; font-weight:650 !important; }
.construction-page #qestRiskWrap { background:#f1eadb !important; border-color:#dfd5bf !important; border-radius:5px !important; }
.construction-page #qestRiskWrap > div:first-child { color:#574323 !important; }
.construction-page .qest-cat-h { color:var(--text); border-bottom:1px solid var(--border); }
.construction-page .qest-row { border-color:var(--border); }
.construction-page .qest-row .qest-name, .construction-page .qest-row .qest-cost { color:var(--text); }
.construction-page .qest-row .qest-conf-A { background:#526648; }
.construction-page .qest-row .qest-conf-B { background:#526f7b; }
.construction-page .qest-row .qest-conf-C { background:#917640; }
.construction-page .qest-row .qest-conf-D { background:#985d4b; }
.construction-page .qest-result-actions { background:var(--surface) !important; }
.construction-page #qestApplyStatus { color:#526648 !important; }
@media (max-width:800px) {
  .construction-header { padding:20px; flex-wrap:wrap; gap:14px; }
  .construction-nav { justify-content:flex-start; gap:14px; }
  .construction-nav a { font-size:13px; }
  .construction-main { padding:20px 20px 32px; }
  .construction-intro h1 { font-size:34px; letter-spacing:-1px; }
  .construction-intro > p:not(.construction-eyebrow) { font-size:14px; }
  .construction-intro .desktop { display:none; }
  .construction-intro-actions { gap:8px; }
  .construction-intro-actions a { font-size:13px; padding:10px 12px; }
  .construction-page .ref-doc-bar { padding:12px; margin-bottom:20px; }
  .construction-page .ref-doc-bar-inner { gap:8px; }
  .construction-page .ref-doc-label { flex-basis:100%; }
  .construction-page .mode-toggle-hint { flex-basis:100%; margin:4px 0 0; }
  .construction-page .stmt-filterbar select { width:calc(50% - 5px); min-width:0; }
  .construction-page .stmt-filterbar #stmt-search-input { width:calc(100% - 78px); min-width:0; }
  .construction-page .stmt-count { flex-basis:100%; margin-left:0; }
  .construction-page .stmt-bar { padding:12px; gap:8px; }
  .construction-page .stmt-bar-total { flex-basis:100%; font-size:13px; }
  .construction-page .stmt-bar button.primary { flex:1; }
  .construction-page #scrollTopBtn { bottom:12px; right:10px; }
  .construction-page #qestOverlay { padding:12px; }
  .construction-page #qestModal { padding:18px !important; max-height:90vh !important; }
  .construction-page #qestTitle { font-size:22px !important; }
  .construction-page .qest-area-grid, .construction-page .qest-scale-grid { grid-template-columns:1fr 1fr !important; }
  .construction-page .qest-row { flex-wrap:wrap; gap:6px; }
  .construction-page .qest-row .qest-name { min-width:70%; }
  .construction-page .qest-row .qest-qty { margin-left:24px; flex:1; text-align:left; min-width:0; }
  .construction-page .qest-result-actions { flex-wrap:wrap; }
  .construction-page .qest-result-actions button { font-size:13px !important; }
}
@media (prefers-reduced-motion:reduce) {
  .construction-page * { scroll-behavior:auto !important; transition:none !important; }
}

/* Keep the initial search controls clear; pin totals after a selection. */
.construction-page .stmt-bar { position:static; }
.construction-page .stmt-bar.has-items { position:sticky; bottom:12px; z-index:20; }

/* Catalogue rows start with the item name; no thumbnail column. */
.construction-page .stmt-tbl th:first-child,.construction-page .stmt-tbl .stmt-title{text-align:left}

/* Primary statement action and recoverable bulk clear. */
.construction-page .stmt-btn.stmt-primary { background:#365b75; border-color:#365b75; color:#fff; font-weight:650; padding-inline:18px; }
.construction-page .stmt-btn.stmt-primary:hover { background:#28485e; border-color:#28485e; }
.construction-page .stmt-btn.stmt-clear-cart { color:#94513f; border-color:#d8bbae; background:#fffaf7; }
.construction-page .stmt-btn.stmt-clear-cart:hover { background:#f8e9e3; }
.construction-page .stmt-btn[hidden] { display:none; }
.construction-page .stmt-bar .stmt-primary { min-height:44px; }
.cart-action-status { font-size:12px; color:#697161; flex-basis:100%; }
.cart-clear-dialog { width:min(420px,calc(100vw - 40px)); padding:26px; border:1px solid #d8ded0; border-radius:12px; color:#303b2c; background:#fffdf8; font-family:Pretendard,sans-serif; box-sizing:border-box; }
.cart-clear-dialog::backdrop { background:rgba(28,35,28,.35); }
.cart-clear-dialog h2 { margin:0 0 15px; font-size:20px; line-height:1.5; }
.cart-clear-dialog p { font-size:14px; line-height:1.7; }
.cart-clear-dialog .cart-clear-count { font-size:18px; font-weight:650; color:#94513f; }
.cart-clear-dialog .cart-clear-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:22px; flex-wrap:wrap; }
.cart-clear-dialog button { min-height:42px; padding:9px 15px; border:1px solid #d8ded0; border-radius:5px; background:transparent; color:#303b2c; font:inherit; cursor:pointer; }
.cart-clear-dialog .cart-clear-confirm { background:#94513f; color:#fff; border-color:#94513f; }
.cart-clear-dialog button:disabled { opacity:.6; cursor:wait; }
