/* Pump Supermarket Selector 2.1 — clean industrial interface */
.psm-selector {
  --psm-ink: #101820;
  --psm-navy: #12324a;
  --psm-blue: #0874c9;
  --psm-blue-dark: #075b9d;
  --psm-yellow: #f5c400;
  --psm-line: #cfd8e1;
  --psm-soft: #f3f6f8;
  --psm-muted: #596978;
  max-width: 1040px;
  border: 1px solid #bfcbd5;
  border-radius: 2px;
  box-shadow: 0 14px 34px rgba(16, 40, 58, .12);
  overflow: hidden;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

.psm-selector [hidden] {
  display: none !important;
}

.psm-selector__header {
  position: relative;
  padding: 34px 42px 32px;
  background: linear-gradient(110deg, #0d151b 0%, #122532 100%);
  border-bottom: 4px solid var(--psm-yellow);
}

.psm-selector__header::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 26%;
  height: 100%;
  background: linear-gradient(135deg, transparent 48%, rgba(8, 116, 201, .17) 49%);
  pointer-events: none;
}

.psm-selector__header h2 {
  margin: 7px 0 9px;
  font-size: clamp(26px, 3.2vw, 36px);
  font-weight: 720;
  letter-spacing: -.6px;
}

.psm-selector__header p {
  max-width: 790px;
  color: #d7e0e7;
}

.psm-selector__header .psm-selector__eyebrow {
  color: var(--psm-yellow);
  letter-spacing: 2px;
}

.psm-progress {
  gap: 22px;
  padding: 19px 42px 0;
}

.psm-progress__bar {
  height: 5px;
  border-radius: 0;
  background: #e4e9ed;
}

.psm-progress__bar span {
  border-radius: 0;
  background: var(--psm-blue);
}

.psm-progress p {
  display: flex;
  min-width: 205px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: var(--psm-muted);
}

.psm-progress p strong {
  color: var(--psm-navy);
  font-size: 12px;
  letter-spacing: .7px;
  text-transform: uppercase;
}

.psm-form,
.psm-result {
  padding: 30px 42px 40px;
}

.psm-step__title {
  margin-bottom: 26px;
  padding-bottom: 18px;
  border-bottom: 1px solid #e2e7eb;
}

.psm-step__title > span {
  width: 34px;
  height: 34px;
  flex-basis: 34px;
  border-radius: 1px;
  background: var(--psm-navy);
}

.psm-step__title h3 {
  margin-top: 0;
  color: var(--psm-ink);
  font-size: 23px;
  font-weight: 700;
}

.psm-choice-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.psm-choice-card,
.psm-choice-grid--three .psm-choice-card {
  min-height: 170px;
  padding: 22px;
  border: 1px solid var(--psm-line);
  border-left: 4px solid var(--psm-line);
  border-radius: 1px;
  box-shadow: none;
  transform: none;
}

.psm-choice-card:hover {
  border-color: #8ea6b8;
  border-left-color: var(--psm-blue);
  box-shadow: 0 7px 18px rgba(14, 55, 82, .08);
  transform: none;
}

.psm-choice-card.is-selected {
  border-color: var(--psm-blue);
  border-left-color: var(--psm-yellow);
  background: #f2f8fc;
  box-shadow: inset 0 0 0 1px var(--psm-blue);
  transform: none;
}

.psm-choice-card__icon {
  width: 42px;
  height: 42px;
  margin-bottom: 17px;
  border-radius: 1px;
  background: #e8f2f9;
  color: var(--psm-blue-dark);
}

.psm-choice-card strong {
  color: var(--psm-ink);
  font-size: 18px;
}

.psm-field-grid {
  gap: 20px 24px;
}

.psm-field label {
  color: #1c2c37;
  font-weight: 700;
}

.psm-field input,
.psm-field select,
.psm-field textarea {
  height: 49px;
  border: 1px solid #b9c6d0 !important;
  border-radius: 1px !important;
  background: #fff !important;
}

.psm-field textarea {
  height: auto;
}

.psm-field input:focus,
.psm-field select:focus,
.psm-field textarea:focus {
  border-color: var(--psm-blue) !important;
  box-shadow: 0 0 0 2px rgba(8, 116, 201, .13) !important;
}

.psm-field.is-engineering-error input,
.psm-field.is-engineering-error select,
.psm-field.is-engineering-error textarea {
  border-color: #c8292f !important;
  box-shadow: inset 4px 0 0 #c8292f !important;
}

.psm-booster-profile {
  padding: 20px;
  border: 1px solid #b9ccda;
  border-left: 4px solid var(--psm-blue);
  border-radius: 1px;
  background: #f4f8fb;
}

.psm-booster-profile__notice,
.psm-consent,
.psm-turnstile-wrap,
.psm-engineering-check,
.psm-engineering-check__facts > div,
.psm-engineering-check__errors,
.psm-engineering-check__warnings,
.psm-result__badge,
.psm-result__grid,
.psm-result__notes {
  border-radius: 1px !important;
}

.psm-selector-version {
  display: inline-block;
  margin: -13px 0 18px;
  padding: 4px 8px;
  border-left: 3px solid var(--psm-yellow);
  background: #f5f7f8;
  color: #52606c;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
}

.psm-engineering-check {
  border: 1px solid #b9cbd8;
  border-left: 4px solid var(--psm-blue);
  background: #f5f9fc;
}

.psm-engineering-check.has-errors {
  border-left-color: #c8292f;
}

.psm-engineering-check.has-warnings {
  border-left-color: #d8a900;
}

.psm-button {
  min-width: 118px;
  border: 1px solid transparent;
  border-radius: 1px;
  padding: 13px 23px;
  letter-spacing: .15px;
  box-shadow: none;
}

.psm-button--next,
.psm-button--submit,
.psm-button--restart {
  background: var(--psm-blue);
}

.psm-button--next:hover,
.psm-button--submit:hover,
.psm-button--restart:hover {
  background: var(--psm-blue-dark);
  transform: none;
}

.psm-button--back {
  border-color: #bdc8d0;
  background: #fff;
  color: #223440;
}

.psm-file-field input[type="file"]::file-selector-button {
  border-radius: 1px;
}

.psm-result__grid {
  border-color: #c9d3da;
  background: #c9d3da;
}

.psm-result__item {
  border-left: 3px solid transparent;
}

.psm-result__item:hover {
  border-left-color: var(--psm-blue);
  background: #f8fbfd;
}

@media (max-width: 700px) {
  .psm-selector {
    margin: 12px 0;
    border-radius: 1px;
  }

  .psm-selector__header {
    padding: 25px 20px 23px;
  }

  .psm-progress {
    display: block;
    padding: 17px 20px 0;
  }

  .psm-progress p {
    min-width: 0;
    margin-top: 10px;
  }

  .psm-form,
  .psm-result {
    padding: 24px 20px 30px;
  }

  .psm-choice-grid--three {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .psm-choice-grid--three .psm-choice-card {
    min-height: 0;
    padding: 13px 14px;
    border-left-width: 4px;
  }

  .psm-choice-grid--three .psm-choice-card__icon {
    width: 38px;
    height: 38px;
    margin: 0;
  }

  .psm-step__title {
    margin-bottom: 20px;
  }

  .psm-step__title h3 {
    font-size: 20px;
  }

  .psm-actions {
    margin: 26px -20px -30px;
    padding: 13px 20px;
    border-top: 1px solid #dbe2e7;
    box-shadow: 0 -5px 14px rgba(17, 42, 59, .07);
  }

  .psm-button {
    min-width: 105px;
  }
}
