/* --------------------------------------------------------------------------
   Additions on top of assets/css/style.css.
   Kept in a separate file so the compiled style.css stays untouched.
   -------------------------------------------------------------------------- */

/* Skip link ------------------------------------------------------------- */
.skip-link {
  position: absolute;
  inset-inline-start: -9999px;
  top: 0;
  z-index: 2000;
  padding: 12px 24px;
  background: #16920e;
  color: #fff;
  text-decoration: none;
  border-radius: 0 0 8px 0;
}

.skip-link:focus {
  inset-inline-start: 0;
}

/* Top bar --------------------------------------------------------------- */
.upper-header__work-days {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.upper-header__work-days-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
}

.upper-header__text {
  margin: 0;
  min-width: 0;
}

/* style.css opens a 70px gap below 480px, which overflows the viewport once the
   tagline and the opening hours are both present. Keep them on one row instead. */
@media (max-width: 767px) {
  .upper-header__container {
    gap: 12px;
  }

  .upper-header__text {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .upper-header__work-days {
    flex: 0 0 auto;
  }
}

@media (max-width: 480px) {
  .upper-header__container {
    gap: 12px;
  }

  .upper-header__text {
    display: none;
  }

  .upper-header__work-days {
    margin-inline-start: auto;
  }
}

/* Logo ------------------------------------------------------------------ */
.header__logo > img {
  display: block;
  height: 32px;
  width: auto;
}

/* Language switcher ----------------------------------------------------- */
.lang-menu {
  gap: 4px;
}

.lang-item + .lang-item {
  border-inline-start: 1px solid rgba(88, 180, 22, .35);
  padding-inline-start: 4px;
}

.lang-link {
  display: inline-block;
  padding: 4px 6px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .5px;
  color: #8fa090;
  transition: color .2s linear, background-color .2s linear;
}

.lang-link:hover,
.lang-link:focus-visible {
  color: #58b416;
  background-color: rgba(88, 180, 22, .08);
}

.lang-item--is-active .lang-link {
  color: #fff;
  background: linear-gradient(129.47deg, #16920e, #5cb616 99.252%);
}

@media (max-width: 991px) {
  .lang-menu {
    justify-content: center;
  }
}

/* Contact block --------------------------------------------------------- */
.contacts-item .contacts-link {
  font-size: 14px;
}

/* Map ------------------------------------------------------------------- */
.map {
  padding-block-end: 0;
}

.map__frame {
  position: relative;
  line-height: 0;
}

.map__frame iframe {
  display: block;
  width: 100%;
  border: 0;
  filter: grayscale(.25);
}

.map__note {
  margin: 0;
  padding: 12px 16px;
  background-color: #eef4ef;
  color: #617c63;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

@media (max-width: 767px) {
  .map__frame iframe {
    height: 320px;
  }
}

/* Empty grid cells used as spacers in the four-up asset grid ------------- */
.features--trade-page .features__item[aria-hidden="true"] {
  pointer-events: none;
}