/* Field Notes strip: hide money, Submit, Work Bench pop-out, email RFQ, staff chrome. */
.fn-strip-money,
#quote-price-rail,
#grand-total,
#submit-order-btn,
#save-for-later-btn,
#budgetary-band,
#tax-row,
#est-split,
#rush-tier-row,
#recalculate-price-btn,
#sterling-post-price-prompt,
#special-request-card,
#sharpen-view,
#tips-sidebar-card,
#quote-honesty-banner,
.customer-quote-only,
.customer-money-only,
#email-import-zone,
#email-order-review,
#reorder-card,
#fab-paint-handoff,
#paint-from-banner,
#intake-review-banner,
#quote-mode-tabs,
#quote-mode-hint,
#services-include,
#total-actions,
.quote-card-line-price,
[data-skinny-piece-price-cell],
[data-skinny-piece-price],
[data-skinny-line-price-math],
[data-draft-bench-popout],
[data-draft-bench-close],
[data-draft-popup-status],
.draft-workbench-actions,
.draft-workbench-actions [data-draft-bench-popout],
.skinny-read-room,
[data-read-room-door],
[data-quote-card-edit-desk],
[data-shop-approval],
.shop-certified-overlay,
[data-skinny-piece-price-cell],
.quote-card-line-price,
.qty-confirmation-notice,
.line-toolbar [onclick*="downloadFlatDxf"],
.line-toolbar [onclick*="downloadProductionFiles"],
.line-toolbar [onclick*="downloadBrakeNc"],
.line-toolbar [onclick*="toggleEditCad"],
[data-production-files-index],
.quote-card-export-menu,
[data-quote-card-export-menu],
.sheet-production-hold-note,
.quote-card-popout {
  display: none !important;
}

body[data-fn-fork="1"] #portal-signout-form {
  display: none !important;
}

/* V-Grooving is not a Field Notes feature. Welding / End Caps stay. */
body[data-fn-fork="1"] .vgroove-check,
body[data-fn-fork="1"] .vgroove-input,
body[data-fn-fork="1"] .vgroove-hint,
body[data-fn-fork="1"] .vg-qty-wrap,
body[data-fn-fork="1"] .vg-total,
body[data-fn-fork="1"] .vg-note,
body[data-fn-fork="1"] .fab-only-field:has(.vgroove-check) {
  display: none !important;
}

.fn-front-door {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 16px 0 8px;
}

.fn-front-door .fn-primary {
  min-height: 48px;
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 700;
}

.fn-secondary-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 16px;
}

.fn-hidden-host {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.fn-job-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px;
  margin: 0 0 20px;
}

.fn-job-bar label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: #315a76;
}

.fn-job-bar input {
  min-width: 16rem;
}

body[data-fn-fork="1"] .cust-marks-help {
  display: none;
}

body[data-fn-fork="1"] {
  --fn-blue: #1d4ed8;
  --fn-blue-deep: #1e3a8a;
  --fn-blue-soft: #dbeafe;
  --fn-pad: #f8fbff;
  background: #f4f7fb;
}

body[data-fn-fork="1"] .cust-appbar {
  background: #0b1f3a;
}

.fn-draw-dock {
  margin: 16px 0 12px;
  padding: 16px;
  border: 1px solid #93c5fd;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 28px rgb(29 78 216 / 8%);
  overflow-y: auto;
  touch-action: pan-y;
}

.fn-draw-dock-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.fn-draw-dock-title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 750;
  color: var(--fn-blue-deep);
}

.fn-draw-dock-copy {
  margin: 4px 0 0;
  font-size: 13px;
  color: #334155;
}

.fn-draw-collapse,
.fn-workbench-tab,
.fn-import-qa-head button {
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid var(--fn-blue);
  border-radius: 999px;
  background: #fff;
  color: var(--fn-blue-deep);
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}

/* Pad full width on top; Profile | 3D stay 50/50 under the canvas.
   Do not hoist live panes beside the pad (no display:contents / 3-col). */
.fn-draw-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.fn-draw-pad {
  min-width: 0;
  width: 100%;
}

.fn-draw-live {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  width: 100%;
}

.fn-live-pane {
  min-width: 0;
  padding: 10px;
  border: 1px solid #93c5fd;
  border-radius: 12px;
  background: #f8fbff;
}

.fn-live-pane h3 {
  margin: 0 0 6px;
  font-size: 0.95rem;
  font-weight: 750;
  color: var(--fn-blue-deep);
}

.fn-live-note {
  margin: 0 0 8px;
  font-size: 12px;
  color: #334155;
}

.fn-live-profile {
  min-height: 180px;
  display: grid;
  place-items: center;
  background: #fff;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  overflow: hidden;
}

.fn-live-profile svg {
  width: 100%;
  height: 200px;
}

.fn-live-empty {
  display: grid;
  gap: 4px;
  padding: 16px;
  text-align: center;
  color: #1e3a8a;
}

.fn-live-empty strong {
  font-size: 14px;
}

.fn-live-empty span {
  font-size: 12px;
  color: #475569;
}

.fn-live-three {
  position: relative;
  height: 220px;
  border-radius: 8px;
  overflow: hidden;
  background: #0b1f3a;
}

.fn-live-three canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
}

.fn-live-three-status {
  position: absolute;
  inset: 0;
  margin: 0;
  display: grid;
  place-items: center;
  padding: 16px;
  color: #dbeafe;
  font-size: 13px;
  text-align: center;
  pointer-events: none;
}

.fn-live-three-status[hidden] {
  display: none;
}

/* Minimize draw hides only the sketch pad. Profile | 3D and Shapes stay. */
.fn-draw-dock.is-collapsed .fn-draw-pad,
.fn-draw-dock.is-collapsed #custom-profile-sketch {
  display: none;
}

.fn-draw-dock.is-collapsed .fn-draw-dock-body,
.fn-draw-dock.is-collapsed .fn-draw-stage,
.fn-draw-dock.is-collapsed .fn-draw-live {
  display: grid;
}

.fn-draw-dock.is-collapsed {
  padding-bottom: 12px;
}

@media (max-width: 720px) {
  .fn-live-profile {
    min-height: 150px;
  }

  .fn-live-profile svg {
    height: 160px;
  }

  .fn-live-three {
    height: 190px;
  }
}

/* Stack Profile | 3D only when a 50/50 pair cannot stay readable. */
@media (max-width: 280px) {
  .fn-draw-live {
    grid-template-columns: minmax(0, 1fr);
  }
}

.fn-quote-request-open,
.fn-quote-request-send {
  min-height: 40px;
  padding: 8px 16px;
  border: 1px solid var(--fn-blue);
  border-radius: 999px;
  background: var(--fn-blue);
  color: #fff;
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}

.fn-quote-request {
  width: min(640px, calc(100vw - 24px));
  max-height: min(92vh, 860px);
  padding: 18px;
  border: 1px solid #93c5fd;
  border-radius: 16px;
  background: #fff;
  color: #0f172a;
}

.fn-quote-request::backdrop {
  background: rgb(11 31 58 / 45%);
}

.fn-qr-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.fn-qr-head h2 {
  margin: 0;
  font-size: 1.2rem;
  color: var(--fn-blue-deep);
}

.fn-qr-head p,
.fn-qr-status,
.fn-qr-foot {
  margin: 6px 0 0;
  font-size: 13px;
  color: #475569;
}

.fn-qr-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

.fn-qr-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  font-weight: 650;
  color: #1e3a8a;
}

.fn-qr-span {
  grid-column: 1 / -1;
}

.fn-qr-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  align-items: center;
}

.fn-qr-actions a {
  color: var(--fn-blue-deep);
  font-weight: 650;
}

@media (max-width: 640px) {
  .fn-qr-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.fn-shapes-title {
  margin: 8px 0 10px;
  font-size: 1.05rem;
  font-weight: 750;
  color: var(--fn-blue-deep);
}

body[data-fn-fork="1"] .fn-start-with {
  padding: 12px 0 8px;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body[data-fn-fork="1"] .cust-build-draft-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

body[data-fn-fork="1"] .cust-build-draft-actions > button {
  width: 100%;
  justify-content: center;
  min-height: 44px;
  background: #fff;
  color: var(--fn-blue-deep);
  border: 1px solid #93c5fd;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgb(15 23 42 / 8%);
}

.fn-workbench-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.fn-workbench-tab[hidden] {
  display: none !important;
}

.fn-import-qa {
  margin: 8px 0 16px;
  padding: 14px;
  border: 1px solid #93c5fd;
  border-radius: 14px;
  background: #fff;
}

.fn-import-qa[hidden] {
  display: none !important;
}

.fn-import-qa-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.fn-import-qa-head h2 {
  margin: 0;
  font-size: 1.05rem;
  color: var(--fn-blue-deep);
}

.fn-import-qa-head p,
.fn-import-qa-empty {
  margin: 6px 0 0;
  font-size: 13px;
  color: #475569;
}

.fn-photo-beside-draw {
  display: none;
}

body[data-fn-fork="1"] #line-items-container .line-item {
  background: #fff;
  color: #0f172a;
  border: 1px solid #d6e3ec;
  border-radius: 12px;
  padding: 16px;
}

body[data-fn-fork="1"] #line-items-container .line-item .input,
body[data-fn-fork="1"] #line-items-container .line-item select,
body[data-fn-fork="1"] #line-items-container .line-item .leg-input {
  background: #fff;
  color: #0f172a;
}

.fn-ask-stace-fab {
  position: fixed;
  left: max(16px, env(safe-area-inset-left));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 40;
  border-radius: 999px;
  box-shadow: 0 8px 24px rgb(7 89 133 / 35%);
}

body[data-fn-fork="1"] .fn-job-bar label {
  color: #8f9dae;
}

body[data-fn-fork="1"] .fn-job-bar input {
  background: #12161f;
  color: #e7edf4;
  border-color: #1e2633;
}

[data-fn-ink-wrap] {
  position: relative;
}

[data-fn-ink-layer] {
  position: absolute;
  inset: 0;
  z-index: 2;
  cursor: crosshair;
  touch-action: none;
}

/* Draw / import placeholder confirm stays visible — do not hide .geometry-confirmation-notice */

.fn-draw-mode {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 10px;
}

.fn-draw-mode button {
  min-height: 40px;
  padding: 0.45rem 0.9rem;
  border: 1px solid #93c5fd;
  border-radius: 999px;
  background: #fff;
  color: #1e3a8a;
  font: inherit;
  cursor: pointer;
}

.fn-draw-mode button[aria-pressed="true"] {
  background: var(--fn-blue, #1d4ed8);
  border-color: var(--fn-blue, #1d4ed8);
  color: #fff;
}

.fn-stace-stub,
.fn-stace-draw {
  background: #fff;
  color: #0f172a;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  overflow: hidden;
}

.fn-stace-draw-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px;
  background: #1d4ed8;
  color: #fff;
  font-size: 15px;
}

.fn-stace-draw-head button {
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.fn-stace-draw-meta {
  margin: 0;
  padding: 10px 14px 0;
  font-size: 13px;
  color: #334155;
}

.fn-stace-draw-bubble {
  margin: 10px 14px 14px;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
  font-size: 14px;
  line-height: 1.45;
  color: #0f172a;
}

/* Work Bench is not the home shell. Keep the dialog out of the page until
   an import Q&A path explicitly opens it (Field Notes uses #fn-import-qa). */
body[data-fn-fork="1"] #draft-workbench.quote-card-visual-dialog,
body[data-fn-fork="1"] #draft-workbench,
body[data-fn-fork="1"] #draft-workbench:not([open]) {
  display: none !important;
}

body[data-fn-fork="1"] [data-custom-sketch-host] {
  touch-action: auto;
}

body[data-fn-fork="1"] .fn-draw-dock[data-fn-drawing="1"] [data-fn-ink-layer] {
  touch-action: none;
}

body[data-fn-fork="1"] .custom-profile-sketch {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #0f172a;
}

body[data-fn-fork="1"] .custom-profile-sketch h3 {
  color: var(--fn-blue-deep);
}

body[data-fn-fork="1"] .custom-profile-sketch .pb-draft-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body[data-fn-fork="1"] .custom-profile-sketch button {
  border-radius: 999px;
  min-height: 44px;
  padding: 0.55rem 1.15rem;
  border: 1px solid #93c5fd;
  background: #fff;
  color: var(--fn-blue-deep);
}

body[data-fn-fork="1"] .fn-draw-mode button[aria-pressed="true"] {
  background: var(--fn-blue);
  border-color: var(--fn-blue);
  color: #fff;
}

body[data-fn-fork="1"] .custom-profile-sketch [data-draft-action="finish"] {
  background: var(--fn-blue);
  border-color: var(--fn-blue);
  color: #fff;
}

body[data-fn-fork="1"] .custom-profile-sketch [data-draft-action="finish"]:disabled {
  background: #dbeafe;
  border-color: #bfdbfe;
  color: #64748b;
}

body[data-fn-fork="1"] .custom-profile-sketch svg,
body[data-fn-fork="1"] #profile-draft-canvas {
  border: 2px solid var(--fn-blue);
  border-radius: 12px;
  background-color: var(--fn-pad);
  background-image:
    linear-gradient(to right, rgba(37, 99, 235, 0.12) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(37, 99, 235, 0.12) 1px, transparent 1px),
    linear-gradient(to right, rgba(29, 78, 216, 0.28) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(29, 78, 216, 0.28) 1px, transparent 1px);
  background-size: 12px 12px, 12px 12px, 60px 60px, 60px 60px;
  background-position: -1px -1px;
}

body[data-fn-fork="1"] #profile-draft-canvas > rect:first-of-type {
  fill: none !important;
}

body[data-fn-fork="1"] .custom-profile-sketch :focus-visible,
body[data-fn-fork="1"] .fn-draw-mode button:focus-visible,
body[data-fn-fork="1"] .fn-draw-collapse:focus-visible {
  outline: 3px solid var(--fn-blue);
  outline-offset: 3px;
}

@media (max-width: 700px) {
  .fn-draw-dock {
    margin: 10px 0;
    padding: 12px;
  }

  body[data-fn-fork="1"] .custom-profile-sketch svg {
    min-height: 240px;
  }
}