/*
 * Shared language-row parity.
 * This file loads last so every public/client page uses the same stable row.
 */
html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(118px, 0.9fr) minmax(150px, 1.1fr) !important;
  align-items: center !important;
  justify-content: center !important;
  flex-flow: row nowrap !important;
  gap: 0 10px !important;
  width: min(100%, 430px) !important;
  max-width: calc(100% - 24px) !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 44px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 5px 7px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > span {
  grid-column: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  flex: none !important;
  align-self: center !important;
  justify-self: stretch !important;
  text-align: center !important;
  white-space: nowrap !important;
  transform: none !important;
}

html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > .public-language-select.public-language-select,
html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > .dependent-custom-select.dependent-custom-select {
  grid-column: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  inset: auto !important;
  flex: none !important;
  align-self: center !important;
  justify-self: stretch !important;
  transform: none !important;
}

html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  .public-language-trigger.public-language-trigger,
html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  .dependent-custom-trigger.dependent-custom-trigger {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > .public-native-language-select.public-native-language-select,
html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > .dependent-native-select.dependent-native-select {
  position: absolute !important;
  display: block !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 0 !important;
  max-width: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  inset: auto !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > select:not(.public-native-language-select, .dependent-native-select) {
  grid-column: 2 !important;
  width: 100% !important;
  height: 42px !important;
  min-height: 42px !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 42px 0 15px !important;
  align-self: center !important;
  justify-self: stretch !important;
  box-sizing: border-box !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  color: #10283a !important;
  -webkit-text-fill-color: #10283a !important;
  background:
    linear-gradient(45deg, transparent 50%, #0a6b68 50%) calc(100% - 18px) 17px / 6px 6px no-repeat,
    linear-gradient(135deg, #0a6b68 50%, transparent 50%) calc(100% - 12px) 17px / 6px 6px no-repeat,
    rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(200, 164, 95, 0.56) !important;
  border-radius: 5px !important;
  box-shadow: 0 8px 20px rgba(8, 46, 65, 0.07) !important;
  font-family: var(--site-header-body, "Avenir Next", "Segoe UI", sans-serif) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 42px !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

html
  body[data-page]
  header.site-header.site-header
  .language-control.language-control
  > select:not(.public-native-language-select, .dependent-native-select):is(:hover, :focus-visible) {
  background-color: #ffffff !important;
  border-color: rgba(200, 164, 95, 0.9) !important;
  box-shadow:
    0 0 0 3px rgba(200, 164, 95, 0.13),
    0 10px 24px rgba(8, 46, 65, 0.09) !important;
  outline: none !important;
}

/* Mobile language rows must flex to translated labels instead of clipping them. */
@media (max-width: 760px) {
  html
    body[data-page]
    header.site-header.site-header
    .language-control.language-control {
    grid-template-columns: minmax(125px, 0.9fr) minmax(140px, 1.1fr) !important;
    gap: 0 8px !important;
    width: min(100%, 356px) !important;
    max-width: 356px !important;
  }

  html
    body[data-page]
    header.site-header.site-header
    .language-control.language-control
    > span {
    max-width: none !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    text-overflow: clip !important;
    line-height: 1.15 !important;
  }
}
