/* Contact Buttons Popup v1.7 - content comes from UniShop header contacts */
.cntct_btns,
.cntct_btns_popup {
  position: fixed !important;
  right: 10px;
  bottom: 18px;
  z-index: 30000 !important;
  display: block !important;
  font-family: Roboto, Arial, Helvetica, sans-serif;
  cursor: default;
}

.cntct_btns *,
.cntct_btns_popup * {
  box-sizing: border-box;
}

/* Old icon links from the original module must not appear anymore */
.cntct_btns .cntct_btn,
.cntct_btns_popup .cntct_btn {
  display: none !important;
}

.cntct_btn_mn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 54px !important;
  height: 54px !important;
  padding: 14px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #149dbc;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .18) !important;
  cursor: pointer !important;
  transition: transform .15s ease, box-shadow .15s ease;
}

.cntct_btn_mn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22) !important;
}

.cntct_btn_mn img {
  display: block !important;
  width: 26px !important;
  height: 26px !important;
}

.cntct_popup {
  display: none;
  position: absolute !important;
  right: 0 !important;
  bottom: calc(100% + 14px) !important;
  z-index: 30010 !important;

  width: 390px !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100vh - 110px) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;

  padding: 16px !important;
  border: 1px solid #e3edf2 !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 14px 40px rgba(32, 68, 88, .22) !important;
  color: #303942 !important;
  cursor: default !important;
}

.cntct_btns_popup.is-open {
  z-index: 30020 !important;
}

.cntct_btns_popup.is-open .cntct_popup {
  display: block !important;
}

.cntct_popup_close {
  position: absolute !important;
  top: 8px !important;
  right: 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #8a96a0 !important;
  font-size: 24px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.cntct_popup_head {
  margin: 0 32px 12px 0 !important;
  padding: 0 !important;
  color: #2f3b45 !important;
  font-size: 20px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
}

.cntct_popup_body,
.cntct_popup_body * {
  box-sizing: border-box;
}

.cntct_popup_body {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  color: #303942 !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.cntct_popup_body .cntct_unishop_contacts,
.cntct_popup_body .header-phones__ul,
.cntct_popup_body ul {
  display: block !important;
  position: static !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  list-style: none !important;
}

.cntct_popup_body li {
  list-style: none !important;
}

.cntct_popup_body .gt-contact-menu {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #303942 !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.cntct_popup_body .gt-contact-section {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 0 10px !important;
  padding: 14px !important;
  border: 1px solid #e3edf2 !important;
  border-radius: 15px !important;
  background: #f8fbfd !important;
  float: none !important;
  clear: both !important;
  overflow: hidden !important;
}

.cntct_popup_body .gt-contact-section:first-child {
  background: linear-gradient(135deg, rgba(21,159,186,.08), rgba(255,128,104,.07)) !important;
  border-color: rgba(21,159,186,.22) !important;
}

.cntct_popup_body .gt-contact-section:last-child {
  margin-bottom: 0 !important;
}

.cntct_popup_body .gt-contact-title {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: #3f464c !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  float: none !important;
  clear: both !important;
}

.cntct_popup_body .gt-contact-desc {
  display: block !important;
  margin: -3px 0 10px !important;
  padding: 0 !important;
  color: #7a858d !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

.cntct_popup_body .gt-contact-row {
  display: grid !important;
  grid-template-columns: 90px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: baseline !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 7px 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  color: #303942 !important;
  text-decoration: none !important;
  float: none !important;
  clear: both !important;
}

.cntct_popup_body .gt-contact-label,
.cntct_popup_body .gt-contact-row__name,
.cntct_popup_body .gt-contact-row span:first-child {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #5a6066 !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

.cntct_popup_body a,
.cntct_popup_body .gt-contact-row__value,
.cntct_popup_body .gt-contact-value {
  display: inline-block !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ff8068 !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}

.cntct_popup_body a:hover {
  color: #ef6d54 !important;
  text-decoration: none !important;
}

.cntct_popup_body .gt-contact-note {
  display: block !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  color: #7a858d !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

.cntct_popup_body .gt-contact-note strong {
  color: #4a5055 !important;
  font-weight: 900 !important;
}

/* Fallback styling for native UniShop contacts, if no custom gt-contact-menu is used */
.cntct_popup_body .header-phones__item,
.cntct_popup_body .header-phones__li,
.cntct_popup_body .contacts__item {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 14px !important;
  border: 1px solid #e3edf2 !important;
  border-radius: 15px !important;
  background: #f8fbfd !important;
}

.cntct_popup_empty {
  padding: 14px !important;
  border: 1px solid #e3edf2 !important;
  border-radius: 15px !important;
  background: #f8fbfd !important;
  color: #7a858d !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

@media (max-width: 767px) {
  .cntct_btns,
  .cntct_btns_popup {
    right: var(--cntct-right, 10px) !important;
    bottom: var(--cntct-bottom, 14px) !important;
  }

  .cntct_popup {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    bottom: calc(var(--cntct-bottom, 14px) + 70px) !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100vh - 120px) !important;
    padding: 13px !important;
    border-radius: 16px !important;
  }

  .cntct_popup_body .gt-contact-section,
  .cntct_popup_body .header-phones__item,
  .cntct_popup_body .header-phones__li,
  .cntct_popup_body .contacts__item {
    padding: 13px !important;
    border-radius: 14px !important;
  }

  .cntct_popup_head {
    font-size: 19px !important;
  }

  .cntct_popup_body .gt-contact-row {
    grid-template-columns: 82px minmax(0, 1fr) !important;
    gap: 8px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 380px) {
  .cntct_popup_body .gt-contact-row {
    display: block !important;
  }

  .cntct_popup_body .gt-contact-label,
  .cntct_popup_body .gt-contact-row__name,
  .cntct_popup_body .gt-contact-row span:first-child {
    margin-bottom: 3px !important;
  }
}

/* v1.7: strict header stacking for UniShop2.
   Goal: account dropdown > header contacts dropdown > main menu. */
header {
  position: relative !important;
}

header #top,
#top.top-menu,
.top-menu {
  position: relative !important;
  z-index: 5000 !important;
}

header #top .container,
#top .top-menu__account,
#top #account,
.top-menu .top-menu__account,
.top-menu #account {
  position: relative !important;
  z-index: 5010 !important;
}

#top .dropdown-menu,
.top-menu .dropdown-menu,
#top .btn-group.open > .dropdown-menu,
.top-menu .btn-group.open > .dropdown-menu,
#account.open > .dropdown-menu,
.top-menu__account .dropdown-menu {
  z-index: 5020 !important;
}

/* The middle header row must be above the turquoise category menu,
   otherwise the opened contacts block gets cut/covered by the menu. */
header > .container:not(#main-menu),
header .header-block,
header .header-block__item,
header .header-block__item-telephone,
header .header-block__item-cart,
header .header-phones {
  position: relative !important;
  z-index: 3000 !important;
}

header .header-phones.open,
header .header-phones:hover,
header .header-block__item-telephone:hover {
  z-index: 3030 !important;
}

header .header-phones__ul,
header .header-phones .dropdown-menu,
header .gt-fly-contacts-dropdown {
  z-index: 3040 !important;
}

/* Keep the main category bar below opened contacts, but do not break its own dropdowns. */
header #main-menu {
  position: relative !important;
  z-index: 1000 !important;
}

header #main-menu .menu,
header #main-menu .menu-wrapper {
  z-index: 1000 !important;
}

header #main-menu .menu__collapse,
header #main-menu .menu__level-2 {
  z-index: 1010 !important;
}

/* The floating/mobile fly menu is separate and should stay above page content. */
#fly-menu,
.fly-menu {
  z-index: 1065;
}