.local-auto-pick,
.local-auto-pick * {
  box-sizing: border-box;
}

.local-auto-pick {
  --auto-pick-green: #155f55;
  --auto-pick-green-dark: #0d4d45;
  --auto-pick-border: #dfe7e4;
  --auto-pick-control-border: #c8cdcb;
  --auto-pick-control-ring: rgb(17 24 22 / 10%);
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 45;
  color: #171d1b;
  font-family: inherit;
}

.local-auto-pick__launcher {
  display: flex;
  width: 54px;
  height: 54px;
  padding: 5px 3px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--auto-pick-control-border);
  border-radius: 50%;
  background: #fff;
  color: #111;
  box-shadow: none;
  cursor: pointer;
  transform: none !important;
  transition: none;
  -webkit-tap-highlight-color: transparent;
}

.local-auto-pick__launcher:hover,
.local-auto-pick__launcher:focus-visible {
  border-color: #969d9a;
  box-shadow: 0 0 0 3px var(--auto-pick-control-ring);
  outline: none;
}

.local-auto-pick__launcher:active {
  border-color: var(--auto-pick-control-border);
  box-shadow: none;
  transform: none !important;
}

.local-auto-pick__launcher span {
  font-size: 9px;
  font-weight: 800;
  line-height: 1.05;
  text-align: center;
}

.local-auto-pick__actions {
  display: grid;
  grid-template-columns: repeat(2, 54px);
  gap: 7px;
  align-items: center;
}

.local-auto-pick__action {
  min-height: 54px;
  padding: 0;
  border: 1px solid var(--auto-pick-control-border);
  border-radius: 50%;
  background: #fff;
  color: #111;
  font: inherit;
  cursor: pointer;
  box-shadow: none;
  transform: none !important;
  transition: none;
  -webkit-tap-highlight-color: transparent;
}

.local-auto-pick__action--back,
.local-auto-pick__action--next {
  width: 54px;
  min-height: 54px;
  display: grid;
  place-items: center;
}

.local-auto-pick__action--back svg,
.local-auto-pick__action--next svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.local-auto-pick__action:not(:disabled):hover,
.local-auto-pick__action:not(:disabled):focus-visible {
  border-color: #969d9a;
  box-shadow: 0 0 0 3px var(--auto-pick-control-ring);
  outline: none;
}

.local-auto-pick__action:active {
  border-color: var(--auto-pick-control-border);
  background: #fff;
  box-shadow: none;
  transform: none !important;
}

.local-auto-pick__action:disabled {
  border-color: var(--auto-pick-control-border);
  background: #fff;
  color: #111;
  cursor: default;
  box-shadow: none;
  opacity: 1;
}

/* Все круглые действия вокруг браслета используют ту же систему, что и
   локальный автоподбор: белый круг, чёрное содержимое и серая рамка. */
.bracelet-canvas-wrapper .bracelet-select-all-toggle,
.bracelet-canvas-wrapper .bracelet-training-toggle,
.bracelet-canvas-wrapper .bracelet-watch-toggle {
  width: 54px !important;
  min-width: 54px !important;
  height: 54px !important;
  min-height: 54px !important;
  border: 1px solid #c8cdcb !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: #111 !important;
  box-shadow: none !important;
  transition: none !important;
  -webkit-tap-highlight-color: transparent;
}

.bracelet-canvas-wrapper .bracelet-select-all-toggle *,
.bracelet-canvas-wrapper .bracelet-training-toggle *,
.bracelet-canvas-wrapper .bracelet-watch-toggle * {
  color: #111 !important;
}

.bracelet-canvas-wrapper .bracelet-training-toggle svg,
.bracelet-canvas-wrapper .bracelet-watch-toggle svg {
  font-size: 21px !important;
}

.bracelet-canvas-wrapper .bracelet-training-toggle span,
.bracelet-canvas-wrapper .bracelet-watch-toggle span {
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 0.95 !important;
}

.bracelet-canvas-wrapper .bracelet-select-all-toggle:hover,
.bracelet-canvas-wrapper .bracelet-select-all-toggle:focus-visible,
.bracelet-canvas-wrapper .bracelet-training-toggle:hover,
.bracelet-canvas-wrapper .bracelet-training-toggle:focus-visible,
.bracelet-canvas-wrapper .bracelet-watch-toggle:hover,
.bracelet-canvas-wrapper .bracelet-watch-toggle:focus-visible,
.bracelet-canvas-wrapper .bracelet-select-all-toggle--active {
  border-color: #969d9a !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgb(17 24 22 / 10%) !important;
  outline: none !important;
}

.bracelet-canvas-wrapper .bracelet-select-all-toggle:active,
.bracelet-canvas-wrapper .bracelet-training-toggle:active,
.bracelet-canvas-wrapper .bracelet-watch-toggle:active {
  border-color: #c8cdcb !important;
  background: #fff !important;
  box-shadow: none !important;
}

.bracelet-canvas-wrapper .bracelet-select-all-toggle .MuiTouchRipple-root,
.bracelet-canvas-wrapper .bracelet-training-toggle .MuiTouchRipple-root,
.bracelet-canvas-wrapper .bracelet-watch-toggle .MuiTouchRipple-root {
  display: none !important;
}

.local-auto-pick-used {
  display: flex;
  min-width: 0;
  margin: 8px 8px 0;
  padding: 7px 9px;
  align-items: center;
  gap: 9px;
  border: 1px solid rgb(21 95 85 / 12%);
  border-radius: 14px;
  background: #f6faf8;
}

.local-auto-pick-used__title {
  flex: 0 0 auto;
  color: #4e5c57;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.local-auto-pick-used__list {
  display: flex;
  width: 0;
  max-width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 3px;
  gap: 6px;
  scrollbar-color: #b9c9c4 transparent;
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.local-auto-pick-used__list::-webkit-scrollbar {
  display: block;
  height: 3px;
}

.local-auto-pick-used__list::-webkit-scrollbar-track {
  background: transparent;
}

.local-auto-pick-used__list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #b9c9c4;
}

.local-auto-pick-used__item {
  display: flex;
  min-width: max-content;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.local-auto-pick-used__select {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  padding: 3px;
  border: 1px solid #dce7e3;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}

.local-auto-pick-used__select:hover,
.local-auto-pick-used__select:focus-visible {
  border-color: var(--auto-pick-green, #155f55);
  outline: 2px solid rgb(21 95 85 / 18%);
  outline-offset: 1px;
}

.local-auto-pick-used__select img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
  object-fit: cover;
}

.local-auto-pick-used__meta,
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-text {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 3px;
}

.local-auto-pick-used__meta {
  min-width: max-content;
  flex: 0 0 auto;
}

.local-auto-pick-used__name,
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-text-link {
  display: block;
  max-width: 112px;
  color: #173c36;
  font-size: 10px;
  font-weight: 600;
  line-height: 16px;
  overflow: hidden;
  text-decoration: underline;
  text-decoration-color: rgb(21 95 85 / 32%);
  text-decoration-style: solid;
  text-decoration-thickness: auto;
  text-underline-offset: 2px;
  text-overflow: ellipsis;
}

.local-auto-pick-used__name:hover,
.local-auto-pick-used__name:focus-visible,
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-text-link:hover,
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-text-link:focus-visible {
  color: var(--auto-pick-green-dark, #0d4d45);
  text-decoration-color: currentColor;
}

.local-auto-pick-used__name {
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.local-auto-pick-used__info,
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-info {
  display: inline-grid;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  padding: 0;
  place-items: center;
  border: 1px solid #8ca59e;
  border-radius: 50%;
  background: #fff;
  color: #155f55;
  font-family: Georgia, serif;
  font-size: 0;
  font-weight: 700;
  line-height: 0;
  appearance: none;
  cursor: pointer;
}

.local-auto-pick-used__info::before,
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-info::before {
  content: 'i';
  display: block;
  color: #155f55;
  font: 700 10px/1 Georgia, serif;
}

.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label {
  display: flex;
  width: 100%;
  min-width: 0;
  justify-content: center;
}

.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-text {
  width: 100%;
  justify-content: center;
  white-space: nowrap;
}

.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-text-link {
  max-width: calc(100% - 19px);
  white-space: nowrap;
}

.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-info svg {
  display: none;
}

.main-configurator .swiper-slide:has(img.stone-icon) .swiper-label-info {
  position: static;
  inset: auto;
  flex: 0 0 16px;
  transform: none;
}

/* В основном прокручиваемом каталоге оставляем только изображение, название
   и штатную кнопку описания. */
.main-configurator .swiper-slide:has(img.stone-icon) .swiper-subtitle {
  display: none !important;
}

/* В корзине и оформлении повторяем визуальный язык блока «В браслете»:
   круглый образец, подчёркнутое название и компактная кнопка описания. */
.history-card-container .history-card-stones {
  display: flex !important;
  align-items: center !important;
  gap: 8px;
}

.history-card-container .history-card-stones > strong {
  flex: 0 0 auto;
}

.history-card-container .history-card-stones-list {
  display: flex !important;
  max-width: 100%;
  min-width: 0;
  margin-top: 0 !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 12px;
}

.history-card-container .history-card-stone-item {
  display: inline-flex !important;
  min-width: 0;
  align-items: center !important;
  gap: 5px;
  white-space: nowrap;
}

.history-card-stones-separator {
  display: none;
}

.history-card-container .history-card-stone-image {
  display: block !important;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  padding: 3px;
  border: 1px solid #dce7e3;
  border-radius: 50%;
  background: #fff;
  object-fit: cover;
}

.history-card-container .history-card-stone-link {
  display: inline-flex;
  max-width: 148px;
  min-width: 0;
  padding: 0;
  align-items: center;
  gap: 3px;
  border: 0 !important;
  background: transparent !important;
  color: #173c36 !important;
  font-family: Montserrat, sans-serif !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 16px !important;
  overflow: hidden;
  text-decoration: underline !important;
  text-decoration-color: rgb(21 95 85 / 32%) !important;
  text-decoration-style: solid !important;
  text-decoration-thickness: auto !important;
  text-underline-offset: 2px !important;
  text-overflow: ellipsis;
  cursor: pointer;
}

.history-card-container .history-card-stone-link:hover,
.history-card-container .history-card-stone-link:focus-visible {
  color: var(--auto-pick-green-dark, #0d4d45);
  text-decoration-color: currentColor;
  outline: none;
}

.history-card-stone-info {
  display: none !important;
}

.history-card-container .history-card-stone-link::after {
  content: 'i';
  display: inline-grid;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  place-items: center;
  border: 1px solid #8ca59e;
  border-radius: 50%;
  background: #fff;
  color: #155f55;
  font: 700 10px/1 Georgia, serif;
  text-decoration: none;
}

@media (max-width: 600px) {
  .local-auto-pick {
    top: 8px;
    left: 8px;
  }

  .local-auto-pick__launcher {
    width: 50px;
    height: 50px;
  }

  .local-auto-pick__actions {
    grid-template-columns: repeat(2, 50px);
    gap: 7px;
  }

  .local-auto-pick__action,
  .local-auto-pick__action--back,
  .local-auto-pick__action--next {
    min-height: 50px;
  }

  .local-auto-pick__action--back,
  .local-auto-pick__action--next {
    width: 50px;
  }

  .bracelet-canvas-wrapper .bracelet-select-all-toggle,
  .bracelet-canvas-wrapper .bracelet-training-toggle,
  .bracelet-canvas-wrapper .bracelet-watch-toggle {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  .local-auto-pick-used {
    margin: 6px 8px 0;
    padding: 6px 8px;
  }

  .local-auto-pick-used__name {
    max-width: 92px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .local-auto-pick__launcher,
  .local-auto-pick__action {
    transition: none;
  }
}