/*
 * Beautys brand color bridge.
 * Replaces Hummingbird's inherited Bootstrap blue with an accessible rose.
 */

:root,
[data-bs-theme="light"] {
  --bs-primary: #c34f67;
  --bs-primary-rgb: 195, 79, 103;
  --bs-primary-text-emphasis: #c34f67;
  --bs-primary-bg-subtle: #fff0f3;
  --bs-primary-border-subtle: #f0c7cf;
  --bs-link-color: #c34f67;
  --bs-link-color-rgb: 195, 79, 103;
  --bs-link-hover-color: #a93e55;
  --bs-link-hover-color-rgb: 169, 62, 85;
  --bs-focus-ring-color: rgba(195, 79, 103, 0.25);
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #c34f67;
  --bs-btn-border-color: #c34f67;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #a93e55;
  --bs-btn-hover-border-color: #a93e55;
  --bs-btn-focus-shadow-rgb: 195, 79, 103;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #963448;
  --bs-btn-active-border-color: #963448;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #c34f67;
  --bs-btn-disabled-border-color: #c34f67;
}

.btn-outline-primary {
  --bs-btn-color: #c34f67;
  --bs-btn-border-color: #c34f67;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #c34f67;
  --bs-btn-hover-border-color: #c34f67;
  --bs-btn-focus-shadow-rgb: 195, 79, 103;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #a93e55;
  --bs-btn-active-border-color: #a93e55;
  --bs-btn-disabled-color: #c34f67;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #c34f67;
}

.accordion {
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(195, 79, 103, 0.25);
}

.dropdown-menu,
.dropdown-menu-dark {
  --bs-dropdown-link-active-bg: #c34f67;
}

.list-group {
  --bs-list-group-active-bg: #c34f67;
  --bs-list-group-active-border-color: #c34f67;
}

.nav-pills {
  --bs-nav-pills-link-active-bg: #c34f67;
}

.pagination {
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: #c34f67;
  --bs-pagination-active-border-color: #c34f67;
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(195, 79, 103, 0.25);
}

.progress,
.progress-stacked {
  --bs-progress-bar-bg: #c34f67;
}

/* Keep checkout progress states aligned with the Beautys rose palette. */
.checkout-steps__step--success .checkout-steps__number,
.checkout-steps__step--current .checkout-steps__number,
.checkout-steps__step--success::before,
.checkout-steps__step--success::after,
.checkout-steps__step--current::before {
  background-color: #c34f67;
}

.checkout-steps__step--success .checkout-steps__btn {
  color: #c34f67;
}

.checkout-steps__mobile .progress-ring.beautys-checkout-progress {
  color: #c34f67 !important;
}

/* Give checkout actions and the order reassurance column room to breathe. */
.page-order .checkout-grid__content .buttons-wrapper > .btn-primary {
  min-height: 46px;
  min-width: 160px;
  padding-inline: 24px;
}

@media (min-width: 992px) {
  .page-order .checkout-grid {
    --bs-gutter-x: 3rem;
  }
}

@media (max-width: 991.98px) {
  .page-order .checkout-grid__content {
    margin-block-end: 1.5rem;
  }

  .page-order .checkout-grid__content .buttons-wrapper > .btn-primary {
    width: 100%;
  }
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn-close:focus {
  box-shadow: 0 0 0 0.25rem rgba(195, 79, 103, 0.25);
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
  border-color: #c34f67;
  background-color: #c34f67;
}

.form-range::-webkit-slider-thumb {
  background-color: #c34f67;
}

.form-range::-moz-range-thumb {
  background-color: #c34f67;
}

.form-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(195, 79, 103, 0.25);
}

.form-range:focus::-moz-range-thumb {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(195, 79, 103, 0.25);
}
