/* Tactile selector controls shared by language, division and delivery year. */
.public-site.site-remodel-v2 :is(.language-switch, .segmented, .year-segmented) {
  position: relative;
  isolation: isolate;
  gap: 5px;
  padding: 5px;
  overflow: visible;
  border: 1px solid #a9bfba;
  border-radius: 6px;
  background: linear-gradient(180deg, #cbd8d5 0%, #e5ecea 42%, #f5f8f7 100%);
  box-shadow:
    inset 0 3px 6px rgba(18, 44, 50, 0.18),
    inset 0 -1px 0 rgba(255, 255, 255, 0.92),
    0 1px 0 #ffffff,
    0 7px 14px rgba(18, 44, 50, 0.09);
  perspective: 520px;
}

.public-site.site-remodel-v2 :is(.language-switch, .segmented, .year-segmented)::after {
  position: absolute;
  inset: 4px;
  z-index: -1;
  border: 1px solid rgba(19, 58, 64, 0.1);
  border-radius: 3px;
  content: "";
  pointer-events: none;
}

.public-site.site-remodel-v2 :is(.language-choice, .segment, .year-choice) {
  position: relative;
  z-index: 1;
  min-width: 0;
  border: 1px solid rgba(53, 88, 91, 0.18);
  border-radius: 3px;
  color: #38545a;
  background: linear-gradient(180deg, #ffffff 0%, #eef3f1 54%, #d7e1de 100%);
  box-shadow:
    inset 0 1px 0 #ffffff,
    inset 0 -2px 3px rgba(34, 63, 67, 0.12),
    0 1px 1px rgba(22, 52, 58, 0.12);
  transform: translateY(1px) rotateX(0deg);
  transform-origin: 50% 100%;
  transition:
    transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1),
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.public-site.site-remodel-v2 :is(.language-choice, .segment, .year-choice):not(.active):hover {
  border-color: #6f9995;
  color: #102d34;
  background: linear-gradient(180deg, #ffffff 0%, #f3f7f5 52%, #dce7e4 100%);
  box-shadow:
    inset 0 1px 0 #ffffff,
    inset 0 -2px 3px rgba(34, 63, 67, 0.1),
    0 2px 3px rgba(22, 52, 58, 0.14);
  transform: translateY(0) rotateX(-1deg);
}

.public-site.site-remodel-v2 :is(.language-choice, .segment, .year-choice).active {
  border-color: #076c70;
  color: #ffffff;
  background: linear-gradient(180deg, #18a0a2 0%, #0b8589 52%, #076b70 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.38),
    inset 0 -3px 0 #a8d84d,
    0 4px 0 #064f54,
    0 8px 13px rgba(5, 70, 74, 0.24);
  text-shadow: 0 1px 1px rgba(3, 47, 51, 0.44);
  transform: translateY(-3px) rotateX(-2deg);
}

.public-site.site-remodel-v2 :is(.language-choice, .segment, .year-choice).active::before {
  position: absolute;
  top: 2px;
  right: 4px;
  left: 4px;
  height: 42%;
  border-radius: 2px;
  content: "";
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2), transparent);
  pointer-events: none;
}

.public-site.site-remodel-v2 :is(.language-choice, .segment, .year-choice):active {
  box-shadow:
    inset 0 2px 4px rgba(4, 49, 53, 0.26),
    inset 0 -2px 0 #a8d84d,
    0 1px 0 #064f54;
  transform: translateY(1px) rotateX(1deg);
}

.public-site.site-remodel-v2 .language-switch {
  grid-template-columns: repeat(2, 38px);
}

.public-site.site-remodel-v2 .language-choice {
  min-height: 37px;
}

.public-site.site-remodel-v2 :is(.segment, .year-choice) {
  min-height: 45px;
}

@media (max-width: 760px) {
  .public-site.site-remodel-v2 .language-switch {
    grid-template-columns: repeat(2, 33px);
    gap: 4px;
    padding: 4px;
  }

  .public-site.site-remodel-v2 .language-choice {
    min-height: 34px;
  }

  .public-site.site-remodel-v2 :is(.segment, .year-choice) {
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .public-site.site-remodel-v2 :is(.language-choice, .segment, .year-choice) {
    transition: none;
  }
}
