.scpc-configurator {
  --scpc-gap: 20px;
  --scpc-text: inherit;
  --scpc-accent: #2271b1;
  --scpc-accent-text: #fff;
  color: var(--scpc-text);
}
.scpc-configurator *, .scpc-configurator *::before, .scpc-configurator *::after { box-sizing: border-box; }
.scpc-configurator__step { display: none; }
.scpc-configurator__step.is-active { display: block; }
.scpc-configurator__heading { margin: 0 0 var(--scpc-gap); }
.scpc-configurator__description { margin: calc(var(--scpc-gap) * -.5) 0 var(--scpc-gap); }
.scpc-configurator__choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--scpc-gap); }
.scpc-configurator__choice { position: relative; display: grid; grid-template-columns: 72px 1fr; gap: 12px; align-items: start; padding: 14px; border: 1px solid #d7d7d7; border-radius: 6px; cursor: pointer; }
.scpc-configurator__choice:has(input:checked) { border-color: var(--scpc-accent); box-shadow: 0 0 0 1px var(--scpc-accent); }
.scpc-configurator__choice:focus-within { border-color: var(--scpc-accent); box-shadow: 0 0 0 2px var(--scpc-accent); }
.scpc-configurator__choice > input { margin: 3px 0; grid-column: 1; position: absolute; inset-inline-start: 12px; z-index: 1; }
.scpc-configurator__choice > img { width: 72px; height: 72px; object-fit: cover; grid-column: 1; }
.scpc-configurator__choice-content { display: grid; gap: 5px; grid-column: 2; }
.scpc-configurator__choice-name { font-weight: 700; }
.scpc-configurator__choice-price .price, .scpc-configurator__total { font-weight: 700; }
.scpc-configurator__availability { font-size: .9em; }
.scpc-configurator__variation { grid-column: 1 / -1; display: grid; gap: 8px; padding-block-start: 8px; }
.scpc-configurator__variation[hidden] { display: none; }
.scpc-configurator__variation select, .scpc-configurator__quantity { width: 100%; min-height: 38px; }
.scpc-configurator__variation-status { font-size: .85em; }
.scpc-configurator__component-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--scpc-gap); }
.scpc-configurator__footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: var(--scpc-gap); }
.scpc-configurator__quote { font-weight: 700; text-align: center; }
.scpc-configurator button, .scpc-configurator__button { display: inline-block; min-height: 42px; padding: 9px 16px; border: 1px solid var(--scpc-accent); border-radius: 4px; background: var(--scpc-accent); color: var(--scpc-accent-text); cursor: pointer; text-decoration: none; }
.scpc-configurator :focus-visible { outline: 3px solid var(--scpc-accent); outline-offset: 2px; }
.scpc-configurator button:disabled { opacity: .55; cursor: not-allowed; }
.scpc-configurator__back { background: transparent; color: var(--scpc-accent); }
.scpc-configurator__errors:empty { display: none; }
.scpc-configurator__errors { margin-bottom: var(--scpc-gap); padding: 12px; border-inline-start: 3px solid #b32d2e; background: #fcf0f1; color: #8a2424; }
.scpc-configurator__progress { margin-bottom: 10px; font-size: .9em; }
.scpc-configurator__summary { margin: 0 0 var(--scpc-gap); padding-inline-start: 1.2em; }
.scpc-configurator__success { padding: var(--scpc-gap); border: 1px solid #46b450; background: #f0f8f1; }
.scpc-configurator.is-loading { opacity: .65; pointer-events: none; }
@media (max-width: 480px) { .scpc-configurator__choices { grid-template-columns: 1fr; } .scpc-configurator__footer { flex-direction: column-reverse; } .scpc-configurator__footer button { width: 100%; } }