/* Component styles for the in-store quotation pages (rendered inside the Dawn theme).
   Everything is scoped under .oq and uses Dawn's own CSS variables, so the store's
   theme settings (colours, fonts, buttons) apply automatically. */
.oq { padding-top: 3rem; padding-bottom: 5rem; }
@media (min-width: 750px) { .oq { padding-top: 5rem; padding-bottom: 7rem; } }
.oq-narrow { max-width: 56rem; margin: 0 auto; }
.oq-center { text-align: center; }
.oq-stack { display: grid; gap: 1.5rem; }
.oq-mt { margin-top: 2rem; }
.oq-muted { color: rgba(var(--color-foreground), .65); font-size: 1.3rem; }
.oq-right { text-align: right; white-space: nowrap; }
.oq-strike { text-decoration: line-through; color: rgba(var(--color-foreground), .5); }
.oq-full { width: 100%; }
.oq-title-row { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1.5rem; margin-bottom: 2.5rem; }
.oq-title-row h1 { margin: 0; }

.oq-notice { padding: 1.5rem 2rem; margin-bottom: 2rem; border: .1rem solid rgba(var(--color-foreground), .15); font-size: 1.4rem; }
.oq-notice--error { border-color: rgba(200, 32, 32, .5); background: rgba(200, 32, 32, .05); color: rgb(200, 32, 32); }
.oq-notice--success { border-color: rgba(23, 112, 63, .5); background: rgba(23, 112, 63, .06); color: rgb(23, 112, 63); }
.oq-notice--info { background: rgba(var(--color-foreground), .04); }

.oq-field { display: flex; flex-direction: column; gap: .6rem; }
.oq-field label { font-size: 1.4rem; color: rgba(var(--color-foreground), .75); }
.oq-input {
  width: 100%; min-height: 4.5rem; padding: 1.2rem 1.5rem; font: inherit; font-size: 1.6rem;
  color: rgb(var(--color-foreground)); background: rgb(var(--color-background));
  border: var(--inputs-border-width, .1rem) solid rgba(var(--color-foreground), var(--inputs-border-opacity, .55));
  border-radius: var(--inputs-radius, 0); box-sizing: border-box;
}
.oq-input:focus { outline: none; box-shadow: 0 0 0 .1rem rgba(var(--color-foreground), .75) inset; }
textarea.oq-input { min-height: 10rem; resize: vertical; }
.oq-qty { width: 9rem !important; min-height: 4rem; padding: .6rem 1rem; }
.oq-checkbox { display: flex; gap: 1rem; align-items: flex-start; font-size: 1.4rem; }
.oq-checkbox input { width: 1.8rem; height: 1.8rem; margin-top: .3rem; accent-color: rgb(var(--color-foreground)); }

.oq-table-wrap { overflow-x: auto; }
.oq-table { width: 100%; border-collapse: collapse; font-size: 1.4rem; }
.oq-table th { text-align: left; font-weight: 400; text-transform: uppercase; letter-spacing: .1rem; font-size: 1.2rem; color: rgba(var(--color-foreground), .75); padding: 1.2rem 1rem; border-bottom: .1rem solid rgba(var(--color-foreground), .08); }
.oq-table td { padding: 1.6rem 1rem; border-bottom: .1rem solid rgba(var(--color-foreground), .08); vertical-align: top; color: rgb(var(--color-foreground)); }
.oq-line-item { display: flex; gap: 1.5rem; align-items: flex-start; }
.oq-line-item img { width: 6rem; height: 6rem; object-fit: cover; border: .1rem solid rgba(var(--color-foreground), .08); }
@media (max-width: 749px) {
  .oq-table--stack thead { display: none; }
  .oq-table--stack tr { display: block; border-bottom: .1rem solid rgba(var(--color-foreground), .08); padding: 1rem 0; }
  .oq-table--stack td { display: flex; justify-content: space-between; border: 0; padding: .4rem 0; }
  .oq-table--stack td::before { content: attr(data-label); text-transform: uppercase; font-size: 1.1rem; letter-spacing: .1rem; color: rgba(var(--color-foreground), .6); padding-right: 1rem; }
  .oq-table--stack td.oq-cell-product { display: block; }
  .oq-table--stack td.oq-cell-product::before { display: none; }
}

.oq-badge { display: inline-block; padding: .3rem 1.2rem; border-radius: 4rem; font-size: 1.2rem; letter-spacing: .1rem; background: rgba(var(--color-foreground), .08); color: rgb(var(--color-foreground)); white-space: nowrap; }
.oq-badge--success { background: rgba(23, 112, 63, .12); color: rgb(23, 112, 63); }
.oq-badge--warning { background: #fff4d6; color: #7a5300; }
.oq-badge--primary, .oq-badge--info { background: rgb(var(--color-foreground)); color: rgb(var(--color-background)); }
.oq-badge--muted { background: transparent; border: .1rem solid rgba(var(--color-foreground), .3); color: rgba(var(--color-foreground), .7); }

.oq-quote-grid { display: grid; gap: 4rem; }
@media (min-width: 990px) { .oq-quote-grid { grid-template-columns: 1fr 36rem; align-items: start; } }
.oq-summary { border: .1rem solid rgba(var(--color-foreground), .1); padding: 2.5rem; display: grid; gap: 1.5rem; }
.oq-summary dl { margin: 0; display: grid; grid-template-columns: auto auto; gap: .6rem 2rem; font-size: 1.4rem; }
.oq-summary dt { color: rgba(var(--color-foreground), .7); }
.oq-summary dd { margin: 0; text-align: right; color: rgb(var(--color-foreground)); }
.oq-summary .oq-total { font-size: 2rem; color: rgb(var(--color-foreground)); }

.oq-picker { border: .1rem solid rgba(var(--color-foreground), .1); padding: 2rem; display: grid; gap: 1.5rem; }
.oq-picker__results { display: grid; gap: 1rem; max-height: 44rem; overflow-y: auto; }
.oq-picker__product { display: grid; grid-template-columns: 5.6rem 1fr; gap: 1.2rem; padding: 1.2rem 0; border-bottom: .1rem solid rgba(var(--color-foreground), .08); }
.oq-picker__product img, .oq-picker__noimg { width: 5.6rem; height: 5.6rem; object-fit: cover; background: rgba(var(--color-foreground), .04); }
.oq-picker__variant { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .4rem 0; font-size: 1.4rem; flex-wrap: wrap; }
.oq-link-button { background: none; border: 0; padding: 0; font: inherit; color: rgb(var(--color-link, var(--color-foreground))); text-decoration: underline; cursor: pointer; }
.oq-empty { text-align: center; padding: 4rem 2rem; border: .1rem dashed rgba(var(--color-foreground), .2); }
.oq .button--small { min-height: 3.5rem; padding: 0 1.5rem; min-width: 0; font-size: 1.3rem; }

/* Class names emitted by new-quote.js (shared with the standalone pages) */
.oq .picker__product { display: grid; grid-template-columns: 5.6rem 1fr; gap: 1.2rem; padding: 1.2rem 0; border-bottom: .1rem solid rgba(var(--color-foreground), .08); }
.oq .picker__product img, .oq .picker__noimg { width: 5.6rem; height: 5.6rem; object-fit: cover; background: rgba(var(--color-foreground), .04); }
.oq .picker__variant { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .4rem 0; font-size: 1.4rem; flex-wrap: wrap; }
.oq .muted { color: rgba(var(--color-foreground), .65); font-size: 1.3rem; }
.oq .right { text-align: right; white-space: nowrap; }
.oq .link-button { background: none; border: 0; padding: 0; font: inherit; color: rgb(var(--color-foreground)); text-decoration: underline; cursor: pointer; }
.oq .qty-input { width: 9rem; min-height: 4rem; padding: .6rem 1rem; font: inherit; border: .1rem solid rgba(var(--color-foreground), .55); background: rgb(var(--color-background)); color: rgb(var(--color-foreground)); }
@media (max-width: 749px) {
  .oq-table--stack td.cell-product { display: block; }
  .oq-table--stack td.cell-product::before { display: none; }
}
.oq-table th.oq-right, .oq-table td.oq-right { text-align: right; }