/* Reserve a separate area for the arrow in every single-value select.
   The configurator injects important padding rules at runtime, so these
   overrides must also cover its controls. Native listboxes stay unchanged. */
html body select:not([multiple]):not([size]),
html body select:not([multiple])[size="1"],
html body #pcfg select:not([multiple]):not([size]),
html body #pcfg select:not([multiple])[size="1"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  padding-right: 42px !important;
  background-image: url('/icons/select-chevron.svg') !important;
  background-position: right 14px center !important;
  background-size: 14px 14px !important;
  background-repeat: no-repeat !important;
  text-overflow: ellipsis;
  cursor: pointer;
}

/* Keep the system arrow visible in Windows high-contrast mode. */
@media (forced-colors: active) {
  html body select:not([multiple]):not([size]),
  html body select:not([multiple])[size="1"],
  html body #pcfg select:not([multiple]):not([size]),
  html body #pcfg select:not([multiple])[size="1"] {
    -webkit-appearance: auto !important;
    appearance: auto !important;
    background-image: none !important;
  }
}

#order-status[data-level=error]{color:#a23c15;line-height:1.6}.order-success{max-width:680px;padding:45px 0}.order-success h2{font-size:clamp(28px,4vw,44px)}.order-success .small{overflow-wrap:anywhere}.order-success .button{margin-top:18px}