/* MATU PRINT v111.39.9.87 — colour-only shop configuration palette.
   Deliberately limited to the product calculator and textile order form.
   Product artwork, garment/film colours, editors, catalogue and error states
   keep their own styles. No sizing, layout, typography or interaction changes. */
.m59-shop #product-calculator[data-product],
#order-flow {
  --shop-control: #076b9c;
  --shop-control-hover: #05577f;
  --shop-soft: #edf7fc;
  --shop-hover: #f5faff;
  --shop-ink: #18334d;
  --shop-muted: #526980;
  --shop-line: #c5d5e2;
  --shop-focus: #076b9c;
}
.m59-shop #product-calculator[data-product] {
  --accent: var(--shop-control);
  --large-accent: var(--shop-control);
  --large-tint: var(--shop-soft);
  --large-ink: var(--shop-ink);
}

/* Native quantity/dimension/parameter fields; leave validation colours intact. */
.m59-shop #product-calculator[data-product] .field input:not([type="color"]):not([aria-invalid="true"]),
.m59-shop #product-calculator[data-product] .field select:not([aria-invalid="true"]),
.m59-shop #product-calculator[data-product] .field textarea:not([aria-invalid="true"]),
#order-flow #configuration input:not([type="color"]):not([type="checkbox"]):not([aria-invalid="true"]),
#order-flow #configuration select:not([aria-invalid="true"]),
#order-flow #configuration textarea:not([aria-invalid="true"]) {
  color: var(--shop-ink);
  background-color: #fff;
  border-color: var(--shop-line);
}
.m59-shop #product-calculator[data-product] .field > span:first-child,
.m59-shop #product-calculator[data-product] .matu-canvas-size-heading strong,
.m59-shop #product-calculator[data-product] .matu-canvas-exact-label strong {
  color: var(--shop-ink);
}
.m59-shop #product-calculator[data-product] input:not([type="color"]):not([aria-invalid="true"]):focus,
.m59-shop #product-calculator[data-product] select:not([aria-invalid="true"]):focus,
.m59-shop #product-calculator[data-product] textarea:not([aria-invalid="true"]):focus,
#order-flow #configuration input:not([type="color"]):not([aria-invalid="true"]):focus-visible,
#order-flow #configuration select:not([aria-invalid="true"]):focus-visible,
#order-flow #configuration textarea:not([aria-invalid="true"]):focus-visible {
  border-color: var(--shop-control);
  outline-color: var(--shop-focus);
}
.m59-shop #product-calculator[data-product] button:focus-visible,
.m59-shop #product-calculator[data-product] a:focus-visible,
#order-flow #configuration button:focus-visible,
#order-flow #configuration .quantity-stepper:focus-within {
  outline-color: var(--shop-focus);
}

/* Common option cards, size presets and direction controls. */
.m59-shop #product-calculator[data-product] .matu-business-option,
.m59-shop #product-calculator[data-product] .matu-quantity-presets button,
.m59-shop #product-calculator[data-product] .matu-canvas-preset,
.m59-shop #product-calculator[data-product] .direction-options button,
.m59-shop #product-calculator[data-product] .matu-pvc-groups button,
.m59-shop #product-calculator[data-product] .matu-pvc-card,
.m59-shop #product-calculator[data-product] .matu-large-groups button,
.m59-shop #product-calculator[data-product] .matu-large-card,
.m59-shop #product-calculator[data-product] .matu-large-options button {
  color: var(--shop-ink);
  background-color: #fff;
  border-color: var(--shop-line);
}
.m59-shop #product-calculator[data-product] .matu-business-option:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-quantity-presets button:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-canvas-preset:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .direction-options button:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-pvc-groups button:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-pvc-card:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-large-groups button:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-large-card:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-large-options button:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-window-example:hover:not(:disabled) {
  color: var(--shop-ink);
  background-color: var(--shop-hover);
  border-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-business-option.selected,
.m59-shop #product-calculator[data-product] .matu-quantity-presets button.active,
.m59-shop #product-calculator[data-product] .matu-canvas-preset.is-active,
.m59-shop #product-calculator[data-product] .direction-options button.selected,
.m59-shop #product-calculator[data-product] .matu-pvc-groups button[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-pvc-card[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-large-groups button[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-large-card[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-large-options button[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-window-example[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-window-custom[aria-pressed="true"] {
  color: var(--shop-ink);
  background-color: var(--shop-soft);
  border-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-business-option.selected i,
.m59-shop #product-calculator[data-product] .matu-pvc-card[aria-pressed="true"] .matu-pvc-card-check,
.m59-shop #product-calculator[data-product] .matu-large-card[aria-pressed="true"] .matu-large-check,
.m59-shop #product-calculator[data-product] .matu-pvc-quantity-table > button[aria-pressed="true"] strong > i,
.m59-shop #product-calculator[data-product] .matu-large-quantity-table > button[aria-pressed="true"] strong > i,
.m59-shop #product-calculator[data-product] .direction-options button > b,
.m59-shop #product-calculator[data-product] .matu-window-example[aria-pressed="true"] .matu-window-choice {
  color: #fff;
  background-color: var(--shop-control);
  background-image: none;
  border-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-business-option.selected i {
  box-shadow: 0 4px 10px rgba(7,107,156,.22);
}
.m59-shop #product-calculator[data-product] .matu-pvc-groups button[aria-pressed="true"],
.m59-shop #product-calculator[data-product] .matu-pvc-card[aria-pressed="true"] {
  box-shadow: inset 0 0 0 1px var(--shop-control);
}
.m59-shop #product-calculator[data-product] .direction-options button.selected {
  box-shadow: 0 0 0 3px rgba(7,107,156,.12);
}
.m59-shop #product-calculator[data-product] .matu-quantity-presets button.active {
  box-shadow: 0 3px 9px rgba(7,107,156,.18);
}
.m59-shop #product-calculator[data-product] .matu-canvas-preset.is-active {
  box-shadow: inset 0 -3px 0 var(--shop-control), 0 6px 14px rgba(24,51,77,.13);
}
.m59-shop #product-calculator[data-product] .matu-canvas-preset.is-active small {
  color: var(--shop-muted);
}
.m59-shop #product-calculator[data-product] .matu-window-example[aria-pressed="true"] {
  box-shadow: 0 0 0 2px var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-window-custom[aria-pressed="true"] {
  box-shadow: 0 0 0 1px var(--shop-control);
}

/* Quantity buttons and the PVC/large-format quantity tables. */
.m59-shop #product-calculator[data-product] .matu-mobile-qty-control {
  background-color: var(--shop-soft);
  background-image: none;
  border-color: var(--shop-line);
}
.m59-shop #product-calculator[data-product] .matu-mobile-qty-control .matu-qty-stepper {
  color: var(--shop-control);
  background-color: var(--shop-soft);
  background-image: none;
  border-color: var(--shop-line);
}
.m59-shop #product-calculator[data-product] .matu-mobile-qty-control .matu-qty-more:not(:disabled) {
  color: #fff;
  background-color: var(--shop-control);
  border-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-mobile-qty-control .matu-qty-less:hover:not(:disabled) {
  color: var(--shop-control-hover);
  background-color: var(--shop-hover);
  border-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-mobile-qty-control .matu-qty-more:hover:not(:disabled) {
  background-color: var(--shop-control-hover);
  background-image: none;
  border-color: var(--shop-control-hover);
}
.m59-shop #product-calculator[data-product] .matu-mobile-qty-control .matu-qty-stepper:disabled {
  color: #8390a1;
  background-color: #edf1f4;
  border-color: #dce4e9;
}
.m59-shop #product-calculator[data-product] .matu-pvc-quantity-table > button:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-large-quantity-table > button:not(:disabled) {
  color: var(--shop-ink);
  background-color: #fff;
}
.m59-shop #product-calculator[data-product] .matu-pvc-quantity-table > button:hover:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-large-quantity-table > button:hover:not(:disabled) {
  background-color: var(--shop-hover);
}
.m59-shop #product-calculator[data-product] .matu-pvc-quantity-table > button[aria-pressed="true"]:not(:disabled),
.m59-shop #product-calculator[data-product] .matu-large-quantity-table > button[aria-pressed="true"]:not(:disabled) {
  background-color: var(--shop-soft);
  box-shadow: inset 3px 0 0 var(--shop-control);
}

/* Required-choice guidance retains the existing pending/done distinction. */
.m59-shop #product-calculator[data-product] .field[data-field-kind="select"].matu-choice-pending {
  background-color: var(--shop-soft);
  background-image: none;
  border-color: var(--shop-control);
  box-shadow: 0 0 0 3px rgba(7,107,156,.08);
}
.m59-shop #product-calculator[data-product] .field[data-field-kind="select"].matu-choice-done {
  background-color: #fff;
  background-image: none;
  border-color: var(--shop-line);
}
.m59-shop #product-calculator[data-product] .matu-choice-pending .matu-choice-status {
  color: #fff;
  background-color: var(--shop-control);
  background-image: none;
  box-shadow: 0 3px 10px rgba(7,107,156,.18);
}
.m59-shop #product-calculator[data-product] .matu-choice-done .matu-choice-status {
  color: var(--shop-control);
  background-color: var(--shop-soft);
}
.m59-shop #product-calculator[data-product] .matu-choice-placeholder {
  color: var(--shop-control) !important;
}
.m59-shop #product-calculator[data-product] .matu-choice-pending select,
.m59-shop #product-calculator[data-product] .matu-choice-done select {
  background-image: linear-gradient(45deg,transparent 50%,#076b9c 50%),linear-gradient(135deg,#076b9c 50%,transparent 50%) !important;
}
.m59-shop #product-calculator[data-product] .matu-choice-pending select:not([aria-invalid="true"]) {
  border-color: var(--shop-control) !important;
  box-shadow: 0 0 0 2px rgba(7,107,156,.10) !important;
}
.m59-shop #product-calculator[data-product] .matu-choice-done select:not([aria-invalid="true"]) {
  border-color: var(--shop-line) !important;
}
.m59-shop #product-calculator[data-product] .matu-choice-pending select:not([aria-invalid="true"]):focus {
  outline-color: var(--shop-focus);
}
.m59-shop #product-calculator[data-product] .matu-choice-alert {
  color: var(--shop-control);
  background-color: var(--shop-soft);
  background-image: none;
  border-color: var(--shop-line);
}

/* Selection summaries, prices and the primary shop action. */
.m59-shop #product-calculator[data-product] .matu-pvc-selected,
.m59-shop #product-calculator[data-product] .matu-pvc-group-icon,
.m59-shop #product-calculator[data-product] .matu-pvc-groups button[aria-pressed="true"] .matu-pvc-group-icon,
.m59-shop #product-calculator[data-product] .matu-window-choice,
.m59-shop #product-calculator[data-product] .matu-live-quantity-price,
.m59-shop #product-calculator[data-product] .matu-textile-total,
.m59-shop #product-calculator[data-product] .matu-magnet-fixed-material,
.m59-shop #product-calculator[data-product] .product-data-panel,
.m59-shop #product-calculator[data-product] .minimum-pricing-notice,
.m59-shop #product-calculator[data-product] .matu-calendar-editor-link {
  color: var(--shop-ink);
  background-color: var(--shop-soft);
  background-image: none;
  border-color: var(--shop-line);
}
.m59-shop #product-calculator[data-product] .matu-pvc-selected {
  border-left-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-pvc-selected-label,
.m59-shop #product-calculator[data-product] .matu-pvc-group-icon,
.m59-shop #product-calculator[data-product] .matu-pvc-text-button,
.m59-shop #product-calculator[data-product] .matu-live-quantity-price strong,
.m59-shop #product-calculator[data-product] .matu-canvas-size-heading small,
.m59-shop #product-calculator[data-product] .price {
  color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .matu-pvc-quote,
.m59-shop #product-calculator[data-product] .matu-large-quote {
  color: #fff;
  background-color: var(--shop-ink);
}
.m59-shop #product-calculator[data-product] .matu-pvc-quote span,
.m59-shop #product-calculator[data-product] .matu-pvc-quote small,
.m59-shop #product-calculator[data-product] .matu-large-quote span,
.m59-shop #product-calculator[data-product] .matu-large-quote small {
  color: #d3e4eb;
}
.m59-shop #product-calculator[data-product] .button.primary.add-button,
.m59-shop #product-calculator[data-product] .matu-canvas-editor-link,
.m59-shop #product-calculator[data-product] .matu-canvas-editor-icon,
.m59-shop #product-calculator[data-product] .matu-calendar-editor-link > span:last-child {
  color: #fff;
  background-color: var(--shop-control);
  background-image: none;
  border-color: var(--shop-control);
}
.m59-shop #product-calculator[data-product] .button.primary.add-button:hover:not(:disabled) {
  background-color: var(--shop-control-hover) !important;
  border-color: var(--shop-control-hover);
}
.m59-shop #product-calculator[data-product] .matu-canvas-editor-link:hover {
  background-color: var(--shop-control-hover);
  border-color: var(--shop-control-hover);
}
.m59-shop #product-calculator[data-product] .matu-canvas-editor-copy strong,
.m59-shop #product-calculator[data-product] .matu-canvas-editor-arrow {
  color: #fff;
}
.m59-shop #product-calculator[data-product] .matu-canvas-editor-copy small,
.m59-shop #product-calculator[data-product] .matu-canvas-editor-copy em {
  color: #d3e4eb;
}

/* Textile order configuration lives in its own document, before the editor. */
#order-flow #configuration .steps .active,
#order-flow #configuration .quantity-count,
#order-flow #configuration .quantity-table .selected,
#order-flow #configuration .route-card[aria-pressed="true"],
#order-flow #configuration .order-total {
  color: var(--shop-ink);
  background-color: var(--shop-soft);
}
#order-flow #configuration .quantity-table .selected th,
#order-flow #configuration .quantity-count,
#order-flow #configuration .price-main {
  color: var(--shop-control);
}
#order-flow #configuration .price-panel,
#order-flow #configuration .quantity-stepper,
#order-flow #configuration .route-card {
  border-color: var(--shop-line);
}
#order-flow #configuration .price-panel {
  box-shadow: 0 6px 24px rgba(24,51,77,.024);
}
#order-flow #configuration .price-unit {
  color: var(--shop-muted);
}
#order-flow #configuration .quantity-stepper button,
#order-flow #configuration .route-card {
  color: var(--shop-ink);
  background-color: #fff;
}
#order-flow #configuration .quantity-stepper button:hover:not(:disabled),
#order-flow #configuration .route-card:hover:not(:disabled) {
  color: var(--shop-control);
  background-color: var(--shop-hover);
  border-color: var(--shop-control);
}
#order-flow #configuration .route-card[aria-pressed="true"] {
  background-color: var(--shop-soft);
  border-color: var(--shop-control);
}
#order-flow #configuration #hide-files,
#order-flow #configuration .same-file {
  color: var(--shop-ink);
  background-color: #fff;
  border-color: var(--shop-line);
}
#order-flow #configuration #hide-files:hover:not(:disabled),
#order-flow #configuration .same-file:hover:not(:disabled) {
  color: var(--shop-control);
  background-color: var(--shop-hover);
  border-color: var(--shop-control);
}
#order-flow #configuration .check-label input {
  accent-color: var(--shop-control);
}
#order-flow #configuration .primary {
  color: #fff;
  background-color: var(--shop-control);
  border-color: var(--shop-control);
}
#order-flow #configuration .primary:hover:not(:disabled) {
  background-color: var(--shop-control-hover);
  border-color: var(--shop-control-hover);
}
