.header__menu-item {
  position: relative;
  white-space: nowrap;
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/theme/fonts/Lato-Regular.ttf) format("truetype");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/theme/fonts/Lato-Medium.ttf) format("truetype");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/theme/fonts/Lato-Semibold.ttf) format("truetype");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/theme/fonts/Lato-Bold.ttf) format("truetype");
}

@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/theme/fonts/Lato-Heavy.ttf) format("truetype");
}

.header__logo img {
  width: auto;
  height: auto;
  max-width: 80%;
}

.header-mobile__logo {
  width: 50px;
  height: 63px;
  flex-shrink: 0;
}

.header-mobile__logo img {
  width: 50px;
  height: 63px;
  object-fit: contain;
}

.top-content__img {
  overflow: hidden;
  min-width: 0;
}

.top-content__img img {
  width: 100%;
  max-width: 100%;
  height: 100%;
  object-fit: cover;
}

.postavki__slide-wrapper img {
  width: 100%;
  height: auto;
}

.header__menu_inner {
  display: none;
  position: absolute;
  min-width: 150px;
  z-index: 20;
  top: 100%;
  left: 0;
  background-color: #eee;
  padding: 10px;
  border-radius: 8px;
}

.header__menu-item.headLevel2 > .header__menu_inner {
  top: 0;
  left: 100%;
}

.header__menu-item:hover > .header__menu_inner {
  display: block;
}

.header__search svg,
.header__search svg use {
  fill: #91a1a4;
}

.item__order-info {
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
}

.item__btns {
  flex: 0 0 auto;
}

.item__btns .item__btn,
.item__btns .oneClick.btn_one_click.item__btn.btn {
  width: 200px !important;
  min-width: 200px !important;
  max-width: 200px !important;
}

.item__btns .item__btn + .item__btn {
  margin-top: 0;
  margin-left: 0;
}

/* Как в custom.css (#msCart [type=submit][value=cart/change]); дублируем на случай кэша/специфичности */
#msCart .counter > .btn-orange {
  display: none !important;
}

#successModal .popup__btn.btn:not(.btn--grey) {
  background-color: var(--brand-color, #c41230);
  border-color: var(--brand-color, #c41230);
  color: #fff;
}

/* Bootstrap a:focus / .btn:focus и button:focus из style.min.css рисуют рамку при клике */
html {
  -webkit-tap-highlight-color: transparent;
}

:focus:not(.policy-invalid),
:focus-visible:not(.policy-invalid) {
  outline: none !important;
}

a:focus,
a:focus-visible,
a:active,
button:focus,
button:focus-visible,
button:active,
.btn:focus,
.btn:focus-visible,
.btn:active:focus,
.btn.active:focus,
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Fenom desktop: active product tab keeps its shadow while :focus (global button:focus zeroes box-shadow) */
@media (min-width: 768px) {
  .item__tabs-title._active,
  .item__tabs-title._active:focus,
  .item__tabs-title._active:focus-visible,
  .item__tabs-title._active:active {
    box-shadow: 2px -7px 11px 2px rgba(0, 0, 0, 0.07) !important;
  }
}

/* Красный круг шапки: иконка сумки белая, не чёрная */
.header__cart-icon svg,
.header__cart-icon svg use {
  fill: #fff;
}

/* Таббар «Корзина»: без чёрной рамки, нажатие/актив — красный фон и белая иконка */
.mobile-tabbar a.mobile-tabbar__item[href*="checkout"]:focus,
.mobile-tabbar a.mobile-tabbar__item[href*="checkout"]:active,
.mobile-tabbar a.mobile-tabbar__item[href*="checkout"].active {
  color: #fff;
  background-color: #cd1211;
  border-radius: 8px;
}

.mobile-tabbar a.mobile-tabbar__item[href*="checkout"]:focus svg path,
.mobile-tabbar a.mobile-tabbar__item[href*="checkout"]:active svg path,
.mobile-tabbar a.mobile-tabbar__item[href*="checkout"].active svg path {
  stroke: #fff;
}

.btn-primary-color:hover,
.btn-primary-color:focus,
.btn-primary-color:active {
  color: #fff;
}

.btn-primary-color:hover svg,
.btn-primary-color:focus svg,
.btn-primary-color:active svg,
.catalog-item__btn.btn-primary-color svg {
  fill: #fff !important;
}

.btn-to-cart:focus,
.btn-to-cart:active {
  background-color: #cd1211;
  color: #fff;
}

.btn-to-cart:focus svg,
.btn-to-cart:active svg {
  fill: #fff;
}

/* Fenom uslugi-gallery-item: phpthumb 320x240 zc=1 — кадры одного размера */
.uslugiSwiper .uslugi-slide__image {
  aspect-ratio: 320 / 240;
  overflow: hidden;
  background: #f3f5f5;
}

.uslugiSwiper .uslugi-slide__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Fenom msProducts.item: thumb 320x177 far=C, опции harakt как на metall-prokat78.ru */
.catalog-item {
  display: flex;
  flex-direction: column;
  padding: 10px 16px 16px;
  box-sizing: border-box;
}

.catalog-item .ms2_form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

.catalog-item .btn-con {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 0;
}

.catalog-item .catalog-item__btn {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  max-width: none;
  box-sizing: border-box;
  white-space: nowrap;
}

.catalog-item .catalog-item__img {
  max-height: none;
  padding: 8px 8px 4px;
  box-sizing: border-box;
}

.catalog-item .catalog-item__img > a {
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.catalog-item .catalog-item__img .bottom {
  width: 100%;
  padding: 10px 4px 0 0;
  box-sizing: border-box;
}

.catalog-item .catalog-item__img .bottom img {
  width: 101px;
  height: 34px;
  max-width: 101px;
  max-height: 34px;
  object-fit: contain;
  flex-shrink: 0;
  margin-left: auto;
}

.catalog-item .catalog-item__photo {
  height: 177px;
  min-height: 177px;
  width: 100%;
  flex-shrink: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.harakt-desktop {
  display: block;
}

.harakt-mobile {
  display: none;
}

@media (max-width: 767px) {
  html,
  body {
    overflow-x: hidden;
    max-width: 100%;
  }

  body {
    padding-bottom: 70px;
  }

  .mobile-tabbar {
    z-index: 1000;
    max-width: 100%;
    box-sizing: border-box;
  }

  .mobile-tabbar__item {
    min-width: 0;
    flex: 1 1 0;
  }

  /* Debugbar на мобилке закрывает таббар Fenom; на бою его нет */
  .phpdebugbar,
  .phpdebugbar-open-handler {
    display: none !important;
  }

  .custom-filter__filters,
  .fw-cstm__filters,
  .items-table-wrap,
  .cm-mobile,
  .mobile-menu,
  .mobile-submenu__panel {
    max-width: 100%;
  }

  .fw-cstm__filters-item {
    min-width: 0;
    max-width: 100%;
  }

  .harakt-desktop {
    display: none;
  }

  .harakt-mobile {
    display: block;
  }
}

.oneclick-modal {
  max-width: 640px;
  width: calc(100% - 32px);
}
.oneclick-form__product {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.oneclick-form__title {
  flex: 1 1 180px;
  font-weight: 600;
}
.oneclick-form__price {
  white-space: nowrap;
}
.oneclick-form__qty {
  display: flex;
  align-items: center;
  border: 1px solid #ddd;
  border-radius: 4px;
}
.oneclick-form__qty button {
  width: 32px;
  height: 32px;
  background: #fff;
}
.oneclick-form__qty input {
  width: 48px;
  text-align: center;
  border: 0;
}
.oneclick-form__fields {
  background: #f4fbff;
  padding: 16px;
  display: grid;
  gap: 12px;
}
.oneclick-form__fields label {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: flex-end;
}
.oneclick-form__fields input {
  flex: 1;
  max-width: 280px;
}
.oneclick-form__submit {
  width: 100%;
  margin-top: 16px;
}

/* Fenom .slider-button: 30px outline circles + CSS chevron. Late swiper.min.css
   otherwise wins on .swiper-button-* (27×44, red SVG) and doubles the arrows. */
.banners .banners__btn.slider-button.swiper-button-prev,
.banners .banners__btn.slider-button.swiper-button-next {
  width: 30px;
  height: 30px;
  padding: 0;
  margin-top: 0;
  background-image: none;
  background-color: transparent;
}

@media (min-width: 768px) {
  .banners .banners__btn.slider-button.swiper-button-prev,
  .banners .banners__btn.slider-button.swiper-button-next {
    margin-top: -15px;
  }
}

/* Fenom unsorted-4: pagin-flex keeps pagination left and ГОСТ/ТУ/PDF right.
   custom.css .page-pagination { justify-content:center } only applies without this wrap. */
.pagin-flex {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.pagin-flex .mse2_pagination.page-pagination {
  justify-content: flex-start;
  width: auto;
  flex: 1 1 auto;
}
@media (max-width: 468px) {
  .pagin-flex {
    gap: 45px;
    justify-content: center;
  }
}

.sect-otzyvy__tab-button {
  flex: 0 0 auto;
  width: auto;
  min-width: 138px;
  padding: 10px 14px;
  box-sizing: border-box;
}
