/* Customer layouts. Dealer styles stay in main.css; theme in site.css. */
.client-only { display:none!important; }
.client-mode .client-only:not(.hidden) { display:flex!important; }
.client-mode .ow-pdf-btn, .client-mode #ow-total-reset { display:none!important; }
.client-mode .ow-total-input { border:0; pointer-events:none; background:transparent; }
.client-mode #screen-order-windows .screen-content,
.client-mode #screen-order-windows .screen-footer { max-width:1100px; width:100%; margin:auto; }
.client-mode #screen-order-windows .screen-footer { border-top:1px solid var(--border); }
.client-mode .screen-content { padding:24px; }

/* No onboarding banner: header + step navigation + workspace + action bar. */
.client-mode .editor-header { order:0; min-height:48px; padding:4px 12px; gap:8px; }
.client-mode .editor-header .btn { min-height:36px; }
.client-mode .editor-header__info { justify-content:flex-start; }
.client-mode .editor-counter { display:none; }
.client-mode #client-guide-btn { width:36px; padding:0; justify-content:center; font-size:17px; }
.client-mode .editor-tabs { order:1; height:40px; min-height:40px; padding:0; border-top:0; border-bottom:1px solid var(--border); }
.client-mode .editor-tab { flex:1 0 auto; flex-direction:row; gap:7px; min-width:0; padding:0 14px; margin:0; border-top:0; border-bottom:2px solid transparent; letter-spacing:0; }
.client-mode .editor-tab span { width:auto; overflow:visible; font-size:12px; }
.client-mode .editor-tab svg { display:none; }
.client-mode .editor-body { order:2; min-height:0; flex:1; grid-template-columns:var(--sidebar-w) minmax(0,1fr) 10px var(--options-w); }
.client-mode .editor-sidebar { display:flex; }
.client-mode .editor-options { min-width:0; padding:0; }
.client-mode .options-section { padding:12px; margin:0; }
.client-mode .options-title { font-size:14px; line-height:1.4; letter-spacing:0; text-transform:none; border:0; padding:0; margin:0 0 10px; }
.client-mode .options-hint { font-size:12px; line-height:1.5; margin-bottom:10px; }
.client-mode #dims-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.client-mode #dims-fields .field-label { margin:0; font-size:12px; }
.client-mode #dims-fields .field-input { width:100%; min-width:0; }
.client-mode .client-shape-section .options-hint { display:none; }
.client-mode .shape-btn { padding:6px 3px; border-width:1px; min-height:64px; }
.client-mode .shape-btn__icon { height:30px; }
.client-mode .shape-btn__label { font-size:10px; }
.client-mode .editor-footer { order:3; min-height:60px; padding:7px 12px calc(7px + var(--safe-bottom)); gap:8px; border-top:1px solid var(--border); }
.client-mode .editor-footer__cost { flex:1; min-width:0; flex-direction:row; align-items:center; gap:18px; }
.client-mode .editor-cost-main { gap:8px; }
.client-mode .editor-cost-value { white-space:nowrap; font-size:20px; font-variant-numeric:tabular-nums; }
.client-mode .editor-cost-label { display:none; }
.client-mode .editor-dims-info { font-size:10px; }
.client-mode #editor-save-btn { min-width:130px; min-height:44px; padding:10px 18px; font-size:14px; }
.client-mode #client-prev-step { min-height:44px; padding:8px 12px; }

.client-help { position:fixed; inset:auto 16px 76px auto; margin:0; width:min(370px,calc(100vw - 32px)); padding:24px; z-index:11000; }
.client-help:not(:popover-open):not(.help-fallback) { display:none; }
.help-fallback { display:block; }
.client-help h2 { font-size:20px; margin:12px 0; }
.client-help>p:not(.site-eyebrow) { font-size:14px; line-height:1.6; }
.client-help .btn { margin-top:16px; }
.help-close { position:absolute; right:8px; top:6px; width:36px; height:36px; background:none; border:0; color:inherit; font-size:25px; cursor:pointer; }
.checkout-layout { display:grid; grid-template-columns:minmax(0,610px) minmax(260px,360px); gap:48px; max-width:1050px; margin:24px auto; }
.checkout-layout h1,.client-success h1 { font-size:32px; line-height:1.2; letter-spacing:-.7px; margin:12px 0; }
.checkout-intro { font-size:14px; line-height:1.7; margin:16px 0 24px; }
.client-form-pair { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
#client-form .field-label { margin-bottom:18px; }
#client-form textarea { resize:vertical; }
.client-company { border-bottom:1px solid var(--border); padding-bottom:12px; margin-bottom:20px; }
.client-company summary { font-size:13px; cursor:pointer; padding:8px 0; }
.checkout-summary { position:sticky; top:0; align-self:start; padding:24px; border:1px solid var(--border); }
.review-window { display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--border); }
.review-window>span { font-size:12px; color:var(--text-muted); }
.review-window strong { font-size:14px; display:block; }
.review-window small { font-size:12px; line-height:1.6; color:var(--text-muted); display:block; margin-top:4px; }
.review-total { padding:24px 0; display:flex; flex-direction:column; gap:8px; }
.review-total>span { font-size:13px; color:var(--text-muted); }
.review-total strong { font-size:32px; font-variant-numeric:tabular-nums; }
.checkout-summary>p { font-size:12px; color:var(--text-muted); line-height:1.6; margin-bottom:20px; }
.client-success { margin:auto; text-align:center; max-width:560px; padding:32px 24px; }
.success-mark { display:inline-grid; place-items:center; width:56px; height:56px; font-size:28px; margin-bottom:24px; }
.client-success>p:not(.site-eyebrow) { font-size:15px; line-height:1.7; margin:24px 0; }
.client-success>.btn { display:block; margin:18px auto; }

@media (min-width:701px) and (max-width:1023px) {
  .client-mode .editor-body { grid-template-columns:var(--sidebar-w) minmax(0,1fr) var(--options-w); }
  .client-mode .editor-dims-info { display:none; }
}
@media (max-width:700px) {
  .client-mode .editor-header { padding:4px 8px; }
  .client-mode .editor-window-title { font-size:13px; }
  .client-mode .editor-header__total { display:none; }
  .client-mode .editor-header__info { justify-content:center; }
  .client-mode .editor-tab { flex:0 0 auto; padding:0 10px; gap:5px; }
  .client-mode .editor-tab span { font-size:11px; }
  .client-mode .editor-body { display:flex!important; flex-direction:column; overflow-y:auto; gap:0; }
  .client-mode .editor-drawing { order:0; flex:none; height:clamp(180px,30dvh,260px); min-height:180px; width:100%; border-bottom:1px solid var(--border); }
  .client-mode .editor-sidebar { order:1; flex-direction:row; width:100%; height:auto; min-height:52px; overflow-x:auto; overflow-y:hidden; flex-shrink:0; padding:2px 8px; }
  .client-mode .editor-sidebar__label { display:none; }
  .client-mode .sidebar-item { flex:0 0 65px; min-height:48px; padding:5px; font-size:9px; }
  .client-mode .editor-options { order:2; flex:none; width:100%!important; overflow:visible; max-height:none; min-height:0; }
  .client-mode .editor-resize-handle { display:none; }
  .client-mode .editor-footer { padding:6px 8px calc(6px + var(--safe-bottom)); min-height:58px; }
  .client-mode .editor-footer__cost { display:flex; }
  .client-mode .editor-cost-value { font-size:17px; }
  .client-mode .editor-area-badge,.client-mode .editor-dims-info { display:none; }
  .client-mode #editor-save-btn { min-width:110px; max-width:190px; font-size:13px; padding:10px 12px; }
  .client-mode #client-prev-step { font-size:12px; padding:8px; }
  .client-mode .screen-content { padding:16px; }
  .client-mode .window-card__actions { flex-wrap:wrap; }
  .client-mode #screen-order-windows .window-card { overflow:hidden; }
  .checkout-layout { display:flex; flex-direction:column; gap:24px; margin:8px auto; }
  .checkout-summary { order:-1; position:static; width:100%; padding:16px; }
  #client-review { max-height:140px; overflow:auto; }
  .checkout-summary>p { display:none; }
  .review-total { flex-direction:row; justify-content:space-between; align-items:center; padding:16px 0; }
  .review-total strong { font-size:26px; }
  .client-form-pair { grid-template-columns:1fr; gap:0; }
  .checkout-layout h1,.client-success h1 { font-size:28px; }
}
@media (max-height:500px) and (min-width:600px) {
  .client-mode .editor-body { display:grid!important; grid-template-columns:54px minmax(0,1fr) minmax(260px,45%); }
  .client-mode .editor-drawing { height:auto; min-height:0; }
  .client-mode .editor-options { overflow-y:auto; }
  .client-mode .editor-sidebar { width:54px; flex-direction:column; overflow-y:auto; }
  .client-mode .sidebar-item { flex:none; }
  .client-mode .editor-resize-handle { display:none; }
}