/* Checkout tunnel — content only. The shared header and footer are intentionally out of scope. */
body#checkout #wrapper {
  color: #101a44 !important;
}

body#checkout #wrapper {
  overflow: hidden !important;
  background: #f0f4fe !important;
}

/* Four-step progress bar */
body#checkout .checkout-steps {
  height: 131px !important;
  margin: 0 !important;
  padding: 27px 0 14px !important;
  background: linear-gradient(108deg, #5220f3 0%, #6338ff 48%, #4655e7 100%) !important;
}

body#checkout .checkout-steps__desktop {
  width: min(1040px, calc(100% - 48px)) !important;
  max-width: 1040px !important;
  height: 90px !important;
  margin: 0 auto !important;
}

body#checkout .checkout-steps__list {
  display: flex !important;
  width: 100% !important;
  height: 90px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body#checkout .checkout-steps__step {
  position: relative !important;
  display: flex !important;
  width: 25% !important;
  height: 90px !important;
  min-width: 0 !important;
  flex: 1 1 25% !important;
  flex-direction: column !important;
  align-items: center !important;
  padding: 0 !important;
  color: rgba(255, 255, 255, 0.62) !important;
}

body#checkout .checkout-steps__number {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  color: #6338ff !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.58) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body#checkout .checkout-steps__btn {
  display: flex !important;
  width: 100% !important;
  min-height: 40px !important;
  align-items: flex-start !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 5px 8px 0 !important;
  color: rgba(255, 255, 255, 0.62) !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: normal !important;
}

body#checkout .checkout-steps .checkout-steps__step .checkout-steps__btn {
  font-size: 16px !important;
}

body#checkout .checkout-steps__step--current .checkout-steps__number,
body#checkout .checkout-steps__step--success .checkout-steps__number {
  color: #6338ff !important;
  background: #ffffff !important;
}

body#checkout .checkout-steps__step--current .checkout-steps__btn,
body#checkout .checkout-steps__step--success .checkout-steps__btn {
  color: #ffffff !important;
  font-weight: 700 !important;
}

body#checkout .checkout-steps__step--success .checkout-steps__number::after {
  content: "✓" !important;
  position: absolute !important;
  right: -5px !important;
  bottom: -4px !important;
  display: flex !important;
  width: 19px !important;
  height: 19px !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  background: #83d500 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

/* Main checkout canvas and two-column layout */
body#checkout .checkout-grid {
  box-sizing: border-box !important;
  width: min(1320px, calc(100% - 48px)) !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
  padding: 63px 0 40px !important;
}

body#checkout .checkout-grid__content,
body#checkout .checkout-grid__aside {
  box-sizing: border-box !important;
  padding-right: 12px !important;
  padding-left: 12px !important;
}

body#checkout .checkout-grid__content {
  margin-bottom: 0 !important;
}

body#checkout .checkout-grid__aside {
  margin-bottom: 0 !important;
}

/* Match the wide Figma composition while keeping the native two-column flow. */
@media (min-width: 1450px) {
  body#checkout .checkout-grid {
    width: 1360px !important;
    max-width: 1360px !important;
    margin-right: 0 !important;
    margin-left: -36px !important;
  }

  body#checkout .checkout-grid__content {
    box-sizing: border-box !important;
    flex: 0 0 874px !important;
    width: 874px !important;
    max-width: 874px !important;
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  body#checkout .checkout-grid__aside {
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body#checkout .checkout-grid .address__list {
    grid-template-columns: repeat(auto-fit, minmax(300px, 392px)) !important;
  }
}

body#checkout .checkout-grid .checkout-grid__aside-wrapper {
  position: sticky !important;
  top: 24px !important;
}

body#checkout .checkout-grid .step__title {
  margin: 0 0 22px 6px !important;
}

body#checkout .checkout-grid .step__title hr {
  display: none !important;
}

body#checkout .checkout-grid .step__title .page-title-section,
body#checkout .checkout-grid .step__title h1,
body#checkout .checkout-grid .step__title h2 {
  margin: 0 !important;
  color: #5b21ef !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

body#checkout .checkout-grid .step__content {
  color: #101a44 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

body#checkout .checkout-grid .step__content > form > p,
body#checkout .checkout-grid .js-address-form > form > p {
  margin: 0 6px 32px !important;
  color: #465174 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* Address cards */
body#checkout .checkout-grid .address__list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 392px)) !important;
  gap: 18px !important;
  margin: 0 0 22px !important;
}

body#checkout .checkout-grid .address-card {
  min-height: 194px !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  box-shadow: 0 7px 22px rgba(73, 70, 170, 0.12) !important;
}

body#checkout .checkout-grid .address-card.selected,
body#checkout .checkout-grid .address-card--radio.selected {
  border-color: rgba(99, 56, 255, 0.18) !important;
  box-shadow: 0 8px 24px rgba(99, 56, 255, 0.16) !important;
}

body#checkout .checkout-grid .address-card__container {
  display: flex !important;
  min-height: 194px !important;
  box-sizing: border-box !important;
  flex-direction: column !important;
  align-items: stretch !important;
  padding: 24px !important;
}

body#checkout .checkout-grid .address-card__header {
  display: flex !important;
  min-height: 24px !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 14px !important;
}

body#checkout .checkout-grid .address-card__header .custom-radio {
  position: relative !important;
  display: inline-flex !important;
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  align-items: center !important;
  justify-content: center !important;
}

body#checkout .checkout-grid .address-card__header .form-check-input {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  border: 2px solid #6338ff !important;
  box-shadow: none !important;
  accent-color: #6338ff !important;
}

body#checkout .checkout-grid .address-card__alias {
  color: #6338ff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

body#checkout .checkout-grid .address-card__content {
  display: block !important;
  margin: 0 0 18px !important;
  color: #6338ff !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  margin-left: 24px !important;
}

body#checkout .checkout-grid .address-card__actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: auto !important;
  margin-left: 21px !important;
}

body#checkout .checkout-grid .address-card__actions a {
  display: inline-flex !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 7px 14px !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important;
}

body#checkout .checkout-grid .address-card__edit {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #6232ff !important;
  box-shadow: 0 5px 12px rgba(99, 56, 255, 0.18) !important;
}

body#checkout .checkout-grid .address-card__edit:hover,
body#checkout .checkout-grid .address-card__edit:focus-visible {
  color: #ffffff !important;
  background: #5420ed !important;
}

body#checkout .checkout-grid .address-card__delete {
  color: #ff5a5f !important;
  -webkit-text-fill-color: #ff5a5f !important;
  background: #ffffff !important;
  box-shadow: 0 5px 14px rgba(16, 26, 68, 0.1) !important;
}

body#checkout .checkout-grid .address-card__delete:hover,
body#checkout .checkout-grid .address-card__delete:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #ff5a5f !important;
}

body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper > .btn-outline-primary {
  color: #755cff !important;
  -webkit-text-fill-color: #755cff !important;
  border-color: transparent !important;
  background: #ffffff !important;
  box-shadow: 0 5px 14px rgba(16, 26, 68, 0.08) !important;
}

body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper:not(.buttons-wrapper--split) > .btn-outline-primary i {
  display: none !important;
}

body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper:not(.buttons-wrapper--split) > .btn-outline-primary {
  font-size: 16px !important;
  font-weight: 400 !important;
  width: 248px !important;
  min-width: 248px !important;
}

/* Forms shared by personal information, address, delivery and payment steps */
body#checkout .checkout-grid .form-control,
body#checkout .checkout-grid .form-select,
body#checkout .checkout-grid input[type="text"],
body#checkout .checkout-grid input[type="email"],
body#checkout .checkout-grid input[type="tel"],
body#checkout .checkout-grid input[type="number"],
body#checkout .checkout-grid textarea,
body#checkout .checkout-grid select {
  min-height: 42px !important;
  color: #101a44 !important;
  border: 1px solid #dfe4f0 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

body#checkout .checkout-grid .form-control:focus,
body#checkout .checkout-grid .form-select:focus,
body#checkout .checkout-grid input:focus,
body#checkout .checkout-grid textarea:focus,
body#checkout .checkout-grid select:focus {
  border-color: #6338ff !important;
  box-shadow: 0 0 0 3px rgba(99, 56, 255, 0.13) !important;
}

body#checkout .checkout-grid .form-label,
body#checkout .checkout-grid .form-group label,
body#checkout .checkout-grid .form-control-label {
  margin-bottom: 6px !important;
  color: #101a44 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body#checkout .checkout-grid .delivery-option__check .form-check-input,
body#checkout .checkout-grid .payment-option__input,
body#checkout .checkout-grid #conditions-to-approve .form-check-input,
body#checkout .checkout-grid .order-options .form-check-input {
  appearance: none !important;
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  margin: 0 !important;
  border: 2px solid #755cff !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

body#checkout .checkout-grid #conditions-to-approve .form-check-input,
body#checkout .checkout-grid .order-options .form-check-input {
  border-radius: 4px !important;
}

body#checkout .checkout-grid .delivery-option__check .form-check-input:checked,
body#checkout .checkout-grid .payment-option__input:checked,
body#checkout .checkout-grid #conditions-to-approve .form-check-input:checked,
body#checkout .checkout-grid .order-options .form-check-input:checked {
  border-color: #6338ff !important;
  background: #6338ff !important;
  box-shadow: inset 0 0 0 4px #ffffff !important;
}

body#checkout .checkout-grid #conditions-to-approve .form-check-input:checked,
body#checkout .checkout-grid .order-options .form-check-input:checked {
  box-shadow: inset 0 0 0 3px #6338ff !important;
  background: #6338ff !important;
}

body#checkout .checkout-grid .delivery-option__check,
body#checkout .checkout-grid .payment-option__form-check {
  align-items: center !important;
}

body#checkout .checkout-grid .delivery-option,
body#checkout .checkout-grid .delivery-option__item,
body#checkout .checkout-grid .payment-option,
body#checkout .checkout-grid .custom-radio,
body#checkout .checkout-grid .form-check {
  color: #101a44 !important;
}

body#checkout .checkout-grid .delivery-option,
body#checkout .checkout-grid .delivery-option__item,
body#checkout .checkout-grid .payment-option {
  overflow: hidden !important;
  border: 1px solid #e1e5f0 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 5px 18px rgba(73, 70, 170, 0.08) !important;
}

body#checkout .checkout-grid .delivery-options__list,
body#checkout .checkout-grid .payment-options__list {
  display: grid !important;
  gap: 12px !important;
}

body#checkout .checkout-grid .delivery-option.selected,
body#checkout .checkout-grid .delivery-option__item:has(input:checked),
body#checkout .checkout-grid .payment-option.selected,
body#checkout .checkout-grid .payment-option:has(input:checked) {
  border-color: #6338ff !important;
  box-shadow: 0 6px 20px rgba(99, 56, 255, 0.14) !important;
}

body#checkout .checkout-grid .delivery-option__label {
  display: grid !important;
  min-height: 72px !important;
  grid-template-columns: minmax(190px, 1fr) minmax(160px, 1fr) auto !important;
  gap: 16px !important;
  align-items: center !important;
  padding: 16px 18px !important;
  cursor: pointer !important;
}

body#checkout .checkout-grid .delivery-option__left,
body#checkout .checkout-grid .delivery-option__carrier {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

body#checkout .checkout-grid .delivery-option__carrier-name,
body#checkout .checkout-grid .delivery-option__content {
  color: #101a44 !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

body#checkout .checkout-grid .delivery-option__carrier-name {
  font-weight: 600 !important;
}

body#checkout .checkout-grid .delivery-option__content {
  color: #69718b !important;
}

body#checkout .checkout-grid .delivery-option__price {
  color: #d59222 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

body#checkout .checkout-grid .delivery-option__extra {
  padding: 0 18px 16px !important;
}

body#checkout .checkout-grid .payment-option__form-check {
  display: flex !important;
  min-height: 62px !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 16px 18px !important;
}

body#checkout .checkout-grid .payment-option__label {
  display: flex !important;
  min-width: 0 !important;
  align-items: center !important;
  gap: 12px !important;
  color: #101a44 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body#checkout .checkout-grid .payment-option__label img {
  max-width: 90px !important;
  max-height: 30px !important;
  object-fit: contain !important;
}

body#checkout .checkout-grid .payment-option__additional-information,
body#checkout .checkout-grid .js-payment-option-form {
  padding: 0 18px 18px !important;
}

/* Native actions, restyled without changing their behavior */
body#checkout .checkout-grid .buttons-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 18px !important;
  margin-bottom: 20px !important;
}

body#checkout .checkout-grid .buttons-wrapper--split {
  justify-content: space-between !important;
  gap: 16px !important;
  margin-top: 28px !important;
  margin-right: 21px !important;
}

body#checkout .checkout-grid .buttons-wrapper--split > .js-back {
  width: 330px !important;
  flex: 0 0 330px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
}

body#checkout .checkout-grid .buttons-wrapper--split > .btn-primary {
  width: 214px !important;
  flex: 0 0 214px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
}

body#checkout .checkout-grid .buttons-wrapper--split > :first-child {
  margin-right: auto !important;
}

body#checkout .checkout-grid .buttons-wrapper--split > :last-child {
  margin-left: auto !important;
}

body#checkout .checkout-grid .btn {
  min-height: 38px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 7px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important;
}

body#checkout .checkout-grid .btn-primary {
  color: #ffffff !important;
  border-color: #6232ff !important;
  background: #6232ff !important;
  box-shadow: 0 6px 14px rgba(99, 56, 255, 0.2) !important;
}

body#checkout .checkout-grid .btn-primary:hover,
body#checkout .checkout-grid .btn-primary:focus-visible {
  color: #ffffff !important;
  border-color: #5420ed !important;
  background: #5420ed !important;
}

body#checkout .checkout-grid .btn-outline-primary {
  color: #6338ff !important;
  border-color: #6338ff !important;
  background: #ffffff !important;
  box-shadow: 0 5px 14px rgba(16, 26, 68, 0.08) !important;
}

body#checkout .checkout-grid .btn-outline-primary:hover,
body#checkout .checkout-grid .btn-outline-primary:focus-visible {
  color: #ffffff !important;
  border-color: #6338ff !important;
  background: #6338ff !important;
}

body#checkout .checkout-grid .btn-basic {
  min-height: 30px !important;
  padding: 6px 0 !important;
  color: #755cff !important;
  border: 0 !important;
  border-bottom: 1px solid #8d7bff !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body#checkout .checkout-grid .btn-basic:hover,
body#checkout .checkout-grid .btn-basic:focus-visible {
  color: #5522f5 !important;
  background: transparent !important;
}

body#checkout .checkout-grid .text-danger,
body#checkout .checkout-grid .link-danger {
  color: #ff5a5f !important;
}

/* Right-hand order summary */
body#checkout .checkout__summary-accordion-wrapper {
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 7px 24px rgba(73, 70, 170, 0.1) !important;
}

body#checkout .checkout__summary-accordion-wrapper .cart-summary {
  padding: 24px !important;
  color: #101a44 !important;
}

body#checkout .checkout__summary-accordion-wrapper hr {
  margin: 14px 0 !important;
  border-color: #edf0f6 !important;
  opacity: 1 !important;
}

body#checkout .cart-summary__products-number {
  color: #101a44 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body#checkout .cart-summary__products-accordion .accordion-button {
  padding: 8px 0 !important;
  color: #755cff !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 14px !important;
}

body#checkout .cart-summary__products-accordion .accordion-button::after {
  width: 14px !important;
  height: 14px !important;
  background-size: 14px !important;
}

body#checkout .cart-summary__line {
  min-height: 34px !important;
  align-items: center !important;
  padding: 6px 0 !important;
  color: #101a44 !important;
  border-bottom: 1px solid #f0f2f7 !important;
  font-size: 14px !important;
}

body#checkout .cart-summary__line:last-child {
  border-bottom: 0 !important;
}

body#checkout .cart-summary__label {
  color: #53607d !important;
}

body#checkout .cart-summary__value {
  color: #101a44 !important;
  font-weight: 600 !important;
}

body#checkout .cart-summary__line--bold {
  color: #101a44 !important;
  font-weight: 700 !important;
}

body#checkout .cart-summary-product__link {
  color: #101a44 !important;
  font-weight: 600 !important;
}

body#checkout .cart-summary-product__price,
body#checkout .cart-summary-product__total {
  color: #d59222 !important;
  font-weight: 700 !important;
}

body#checkout .cart-summary-product__attribute,
body#checkout .cart-summary-product__quantity,
body#checkout .cart-summary-product__unit-price {
  color: #69718b !important;
  font-size: 12px !important;
}

/* Cart product lines: mirror the production information hierarchy without
   changing the underlying cart pricing rules. */
body#cart .product-line__item--reference {
  color: #69718b;
  font-size: 0.8125rem;
}

body#cart .product-line__item--reference .product-line__item-label {
  color: #53607d;
  font-weight: 600;
}

body#cart .product-line__item--prices {
  column-gap: 0.625rem;
}

body#cart .product-line__item--prices .product-line__item-price {
  width: auto;
  color: #d59222;
  font-size: 1rem;
  font-weight: 700;
}

body#cart .product-line__item--prices .product-line__item-regular-price {
  color: #69718b;
  font-size: 0.875rem;
}

body#cart .product-line__item--prices .product-line__item-discount {
  color: #ffffff;
  background-color: #d59222 !important;
  font-size: 0.75rem;
  font-weight: 700;
}

@media (max-width: 991.98px) {
  body#checkout .checkout-steps__desktop {
    width: calc(100% - 24px) !important;
  }

  body#checkout .checkout-grid {
    width: min(720px, calc(100% - 32px)) !important;
    padding-top: 36px !important;
    padding-bottom: 52px !important;
  }

  body#checkout .checkout-grid__aside-wrapper {
    position: static !important;
    margin-top: 26px !important;
  }
}

@media (max-width: 767.98px) {
  body#checkout .checkout-steps {
    height: 88px !important;
    padding: 10px 16px !important;
  }

  body#checkout .checkout-steps__desktop {
    display: none !important;
  }

  body#checkout .checkout-steps__mobile {
    display: flex !important;
    height: 68px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
    color: #ffffff !important;
  }

  body#checkout .checkout-steps__mobile .progress-ring {
    width: 58px !important;
    height: 58px !important;
    color: #ffffff !important;
  }

  body#checkout .checkout-steps__mobile .progress-ring__background-circle {
    stroke: rgba(255, 255, 255, 0.35) !important;
  }

  body#checkout .checkout-steps__mobile .progress-ring__circle {
    stroke: #ffffff !important;
  }

  body#checkout .checkout-steps__mobile .progress-ring__text,
  body#checkout .checkout-steps__mobile .checkout-steps__title,
  body#checkout .checkout-steps__mobile .checkout-steps__subtitle {
    color: #ffffff !important;
  }

  body#checkout .checkout-grid {
    width: calc(100% - 24px) !important;
    padding: 28px 0 42px !important;
  }

  body#checkout .checkout-grid__content,
  body#checkout .checkout-grid__aside {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body#checkout .checkout-grid .step__title .page-title-section,
  body#checkout .checkout-grid .step__title h1,
  body#checkout .checkout-grid .step__title h2 {
    font-size: 24px !important;
  }

  body#checkout .checkout-grid .address__list {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body#checkout .checkout-grid .buttons-wrapper--split {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  body#checkout .checkout-grid .buttons-wrapper--split > :first-child,
  body#checkout .checkout-grid .buttons-wrapper--split > :last-child {
    width: 100% !important;
    margin: 0 !important;
  }

  body#checkout .checkout-grid .buttons-wrapper--split > .js-back,
  body#checkout .checkout-grid .buttons-wrapper--split > .btn-primary {
    width: 100% !important;
    flex: 1 1 auto !important;
  }

  body#checkout .checkout__summary-accordion-wrapper .cart-summary {
    padding: 20px !important;
  }
}

/* Figma frame 6 — "Tunel de commandes" (1920 px canvas). */
@media (min-width: 992px) {
  /* The design uses the natural width of each step label, separated by 135 px,
     rather than four equal-width columns. */
  body#checkout .checkout-steps__desktop {
    width: 842px !important;
    max-width: 842px !important;
    position: relative !important;
    top: -1px !important;
    left: 7.5px !important;
  }

  body#checkout .checkout-steps__list {
    width: 842px !important;
    gap: 135px !important;
    justify-content: flex-start !important;
  }

  body#checkout .checkout-steps__step {
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    opacity: 0.63 !important;
  }

  body#checkout .checkout-steps__step:nth-child(1) { width: 112px !important; }
  body#checkout .checkout-steps__step:nth-child(2) { width: 81px !important; }
  body#checkout .checkout-steps__step:nth-child(3) { width: 161px !important; }
  body#checkout .checkout-steps__step:nth-child(4) { width: 83px !important; }

  body#checkout .checkout-steps__number {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
    background: #ffffff !important;
  }

  body#checkout .checkout-steps__step:nth-child(3) .checkout-steps__number {
    transform: translateX(4.5px) !important;
  }

  body#checkout .checkout-steps .checkout-steps__step .checkout-steps__btn {
    min-height: 46px !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
  }

  /* The native checkout keeps old steps marked as successful when navigating
     backwards.  The Figma state is driven by the visible active tab instead. */
  body#checkout .checkout-steps__step:has(.checkout-steps__btn.active),
  body#checkout .checkout-steps__step:has(~ .checkout-steps__step .checkout-steps__btn.active) {
    opacity: 1 !important;
  }

  body#checkout .checkout-steps__step--success .checkout-steps__number::after {
    display: none !important;
  }

  body#checkout .checkout-steps__step:has(~ .checkout-steps__step .checkout-steps__btn.active) .checkout-steps__number::after {
    content: "✓" !important;
    right: -5px !important;
    bottom: -4px !important;
    display: flex !important;
  }

  body#checkout .checkout-grid .step__title .page-title-section,
  body#checkout .checkout-grid .step__title h1,
  body#checkout .checkout-grid .step__title h2 {
    font-weight: 800 !important;
  }

  /* Keep the native data, but give every address the Figma card geometry.
     The address preview deliberately shows its first three useful lines;
     editing remains available for the complete address. */
  body#checkout .checkout-grid .address__list {
    margin-bottom: 39px !important;
  }

  body#checkout .checkout-grid .address-card,
  body#checkout .checkout-grid .address-card__container {
    height: 216px !important;
    min-height: 216px !important;
  }

  body#checkout .checkout-grid .address-card {
    box-shadow: 0 7px 22px rgba(73, 70, 170, 0.12) !important;
  }

  body#checkout .checkout-grid .address-card.selected,
  body#checkout .checkout-grid .address-card--radio.selected {
    box-shadow: 0 0 17.4px rgba(97, 52, 255, 0.18) !important;
  }

  body#checkout .checkout-grid .address-card__container {
    padding: 26px 24px 29px 20px !important;
  }

  body#checkout .checkout-grid .address-card__header {
    gap: 11px !important;
    margin-bottom: 10px !important;
  }

  body#checkout .checkout-grid .address-card__header .custom-radio,
  body#checkout .checkout-grid .address-card__header .form-check-input {
    width: 13px !important;
    height: 13px !important;
    flex-basis: 13px !important;
  }

  body#checkout .checkout-grid .address-card__alias {
    line-height: 18px !important;
  }

  body#checkout .checkout-grid .address-card__content {
    height: 60px !important;
    margin: 0 0 0 24px !important;
    overflow: hidden !important;
    font-size: 14px !important;
    line-height: 20px !important;
  }

  body#checkout .checkout-grid .address-card__actions {
    gap: 7px !important;
    margin-left: 21px !important;
  }

  body#checkout .checkout-grid .address-card__actions a {
    min-height: 36px !important;
    padding: 6px 15px !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
  }

  body#checkout .checkout-grid .address-card__edit {
    border-color: transparent !important;
    background: linear-gradient(120deg, #6232ff 0%, #3f77ef 100%) !important;
    box-shadow: 0 0 8.7px rgba(0, 0, 0, 0.07) !important;
  }

  body#checkout .checkout-grid .address-card__delete {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.13) !important;
  }

  body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper:not(.buttons-wrapper--split) {
    margin: 0 0 13px !important;
  }

  body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper:not(.buttons-wrapper--split) > .btn-outline-primary {
    min-height: 36px !important;
    height: 36px !important;
    padding: 6px 15px !important;
    border-radius: 6px !important;
    box-shadow: 0 0 8.7px rgba(0, 0, 0, 0.07) !important;
  }

  body#checkout .checkout-grid #checkout-addresses-step > .step__content .btn-basic {
    box-sizing: content-box !important;
    min-height: 20px !important;
    height: 20px !important;
    padding: 0 0 20px !important;
    color: #5649f9 !important;
    border-bottom-color: #5649f9 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
  }

  body#checkout .checkout-grid .buttons-wrapper.buttons-wrapper--split {
    margin-top: 31px !important;
    margin-right: 21px !important;
  }

  body#checkout .checkout-grid .buttons-wrapper--split > .js-back,
  body#checkout .checkout-grid .buttons-wrapper--split > .btn-primary {
    min-height: 36px !important;
    height: 36px !important;
    padding: 6px 15px !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    box-shadow: 0 0 8.7px rgba(0, 0, 0, 0.07) !important;
  }

  body#checkout .checkout-grid .buttons-wrapper--split > .btn-primary {
    border-color: transparent !important;
    background: linear-gradient(120deg, #6232ff 0%, #3f77ef 100%) !important;
  }

  body#checkout #checkout-addresses-step .buttons-wrapper--split > .js-back {
    color: #6134ff !important;
    border-color: transparent !important;
    box-shadow: 0 0 8.7px rgba(0, 0, 0, 0.07) !important;
  }

  /* In the Figma frame, the summary has a 29 px horizontal inset and no
     external shadow.  This selector targets the root, which carries both
     classes in PrestaShop rather than a nested .cart-summary element. */
  body#checkout .checkout__summary-accordion-wrapper.cart-summary {
    box-sizing: border-box !important;
    min-height: 325px !important;
    padding: 25px 29px 20px !important;
    border-radius: 10px !important;
    box-shadow: none !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary hr {
    margin: 17px 0 8px !important;
    border-color: rgba(0, 0, 0, 0.07) !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__products-number,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__products-accordion .accordion-button,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__line,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__label,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__value {
    font-size: 14px !important;
    line-height: 18px !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__products-number,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__line,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__label,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__value {
    color: #000c3c !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__products-number,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__products-accordion .accordion-button,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__line,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__value {
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-weight: 400 !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__products-accordion .accordion-button {
    color: #6134ff !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__subtotals {
    box-sizing: border-box !important;
    min-height: 54px !important;
    padding-top: 2px !important;
    margin-bottom: 19px !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__subtotals .cart-summary__line {
    min-height: 26px !important;
    height: 26px !important;
    padding: 4px 0 !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__subtotals .cart-summary__line:first-child {
    min-height: 25px !important;
    height: 25px !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__total {
    box-sizing: border-box !important;
    min-height: 77px !important;
    height: 77px !important;
    padding: 6px 0 19px !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__total .cart-summary__line {
    min-height: 26px !important;
    height: 26px !important;
    padding: 4px 0 !important;
  }

  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__line--bold,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary .cart-summary__line--bold .cart-summary__value {
    font-weight: 700 !important;
  }

  /* The reference uses isolated step markers: no connector strokes between
     the circles, including for completed steps. */
  body#checkout .checkout-steps__step::before,
  body#checkout .checkout-steps__step::after {
    display: none !important;
    content: none !important;
  }

  body#checkout .checkout-steps .checkout-steps__step .checkout-steps__btn,
  body#checkout .checkout-steps__step--current .checkout-steps__btn,
  body#checkout .checkout-steps__step--success .checkout-steps__btn {
    font-weight: 400 !important;
  }

  /* The native summary strikes every .price .value because it expects the
     current price in .label and the regular price in .value.  Our French
     label is explicit, so only the optional regular price should be crossed. */
  body#checkout .cart-summary-product__price .value {
    color: #d59222 !important;
    text-decoration: none !important;
  }

  body#checkout .cart-summary-product__price .regular-price {
    color: #69718b !important;
    text-decoration: line-through !important;
  }

  /* Keep the summary in the right-hand column when its native product
     accordion is expanded.  The product row can have a larger intrinsic
     width than the column; allowing that width to size the flex item makes
     Bootstrap wrap the aside below the content. */
  body#checkout .checkout-grid__aside,
  body#checkout .checkout-grid__aside-wrapper,
  body#checkout .checkout__summary-accordion,
  body#checkout .checkout__summary-accordion-item,
  body#checkout .checkout__summary-accordion-wrapper.cart-summary {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  @media (min-width: 1450px) {
    body#checkout .checkout-grid__aside {
      box-sizing: border-box !important;
      flex: 0 0 486px !important;
      width: 486px !important;
      max-width: 486px !important;
    }
  }

  /* The Figma canvas reserves this same vertical rhythm before newsletter;
     prevent longer native address values from pulling the footer upward. */
body#checkout #wrapper {
    min-height: 829px !important;
  }
}

/* Give the separate billing-address action enough width for a readable
   two-line label while keeping the two actions on one desktop row. */
@media (min-width: 768px) {
  body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper:not(.buttons-wrapper--split) > .address-choice-different {
    width: 360px !important;
    min-width: 360px !important;
  }
}

@media (max-width: 767.98px) {
  body#checkout .checkout-grid #checkout-addresses-step .buttons-wrapper:not(.buttons-wrapper--split) > .address-choice-different {
    width: 100% !important;
    min-width: 0 !important;
  }
}
