/* Clobechi - общие стили сайта (Настройки сайта > Вставка кода > Дополнительные CSS стили).
   Только то, чего нет в настройках стандартных блоков:
   окно и страница товара, корзина и избранное, карточки каталога, счётчики на иконках шапки.
   Вёрстка Zero-блоков здесь не правится - она делается в редакторе. */

/* ---------- окно товара (попап каталога) и страница товара /tproduct ---------- */
.t1291 .t-popup__container, .t-body:has(.t-catalog__product-snippet), .t-rec:has(.t-catalog__product-snippet) {background:#fafafa !important}
.t-catalog__prod-popup__name {font-size:28px !important; font-weight:500 !important; line-height:1.25 !important}
.t-catalog__prod-popup__info .cz-kicker {display:block; margin-bottom:10px; font-family:var(--t-text-font,Arial); font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:#8c8c8c}
.t-catalog__prod-popup__price-wrapper {margin:16px 0 28px !important}
.t-catalog__prod-popup__price {font-size:24px !important; font-weight:600 !important}
.t-catalog__prod-popup__btn-wrapper {display:flex !important; gap:8px; flex-wrap:nowrap !important}
.t-catalog__prod-popup__btn-wrapper .t-btn {flex:1; width:auto !important; height:56px !important; margin:0 !important; background:#111 !important; color:#fff !important; border:1px solid #111 !important; border-radius:0 !important; font-size:15px !important}
.t-catalog__prod-popup__btn-wrapper .t-btn * {color:#fff !important}
.t-catalog__prod-popup__btn-wrapper .t-btn:hover {background:#d61f26 !important; border-color:#d61f26 !important}
.t-catalog__prod-popup__info .t-catalog__tabs {width:100% !important; max-width:none !important; margin:32px 0 0 !important; padding:0 !important}
.t-catalog__tabs__item-title {font-size:13px !important; font-weight:600 !important; letter-spacing:.08em; text-transform:uppercase}
.t-catalog__tabs__content, .t-catalog__tabs__content .t-descr {font-size:14px !important; line-height:1.65 !important; color:#444 !important}
.t-catalog__prod-popup__info p.t-typography__characteristics:empty {display:none}
.cz-ch {display:flex; justify-content:space-between; gap:24px; margin:0 !important; padding:10px 0; border-bottom:1px solid #e6e6e6}
.cz-ch:last-of-type {border-bottom:0}
.cz-ch b {font-weight:400; color:#8c8c8c}
.cz-ch span {color:#111; text-align:right}
.t-catalog__prod-popup__slider .t-slds__main, .t-catalog__prod-popup__slider .t-slds__thumbsbullet, .t-catalog__prod-popup__slider .t-slds__thumbsbullet-border {border-radius:0 !important}
.t-catalog__prod-popup__slider .t-slds__thumbsbullet {opacity:.5; transition:opacity .2s}
.t-catalog__prod-popup__slider .t-slds__thumbsbullet:hover, .t-catalog__prod-popup__slider .t-slds__thumbsbullet.t-slds__bullet_active {opacity:1}
.t-catalog__relevants__title {font-size:24px !important; font-weight:500 !important; margin-bottom:24px !important}
/* «Вам может понравиться» - одной строкой: на компьютере 4 карточки, на планшете и телефоне лента с прокруткой */
.t-catalog__relevants__container {padding-left:var(--cz-side) !important; padding-right:var(--cz-side) !important; box-sizing:border-box}
.t-catalog__relevants__container > .t-container {max-width:none !important; width:100% !important; padding:0 !important}
.t-catalog__relevants__container .t-col {float:none !important; width:100% !important; max-width:none !important; margin:0 !important; padding:0 !important}
.t-catalog__relevants__container .t-catalog__card-list {display:grid !important; grid-template-columns:repeat(4, minmax(0,1fr)); gap:20px; width:100% !important; max-width:none !important; margin:0 !important}
.t-catalog__relevants__container .t-catalog__card, .t-catalog__relevants__container .t-catalog__card:nth-child(n) {width:auto !important; max-width:none !important; margin:0 !important}

/* лайк - квадрат рядом с кнопкой */
.t-catalog__prod-popup__btn-wrapper .t1002__addBtn {flex:0 0 56px; width:56px !important; height:56px !important; margin:0 !important; border:1px solid #111 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important}
.t-catalog__prod-popup__btn-wrapper .t1002__addBtn:hover {background:#111 !important}
.t-catalog__prod-popup__btn-wrapper .t1002__addBtn:hover svg path {stroke:#fff}
.t-catalog__prod-popup__btn-wrapper .t1002__addBtn_active svg path {fill:#d61f26; stroke:#d61f26}

/* компьютер: фото во весь экран слева, текст справа и не уезжает */
@media (min-width:960px) {
  .t-catalog__prod-popup__container {padding:0 !important}
  .t-catalog__prod-popup__slider.t-catalog__prod-popup__col-left {width:60% !important; max-width:none !important; margin:0 !important}
  .t-catalog__prod-popup__gallery-column {display:grid !important; grid-template-columns:1fr 1fr; gap:4px}
  .t-catalog__prod-popup__gallery-column > .t-catalog__prod-popup__wrapper {width:auto !important; height:auto !important; margin:0 !important; padding:0 !important; float:none !important; overflow:hidden; border-radius:0 !important}
  .t-catalog__prod-popup__gallery-column > .t-catalog__prod-popup__wrapper:last-child:nth-child(odd) {grid-column:1 / -1}
  .t-catalog__prod-popup__columns {display:block; width:100% !important; height:auto !important; aspect-ratio:2/3; object-fit:cover !important; object-position:center top; border-radius:0 !important}
  .t-catalog__prod-popup__wrapper:last-child:nth-child(odd) .t-catalog__prod-popup__columns {aspect-ratio:auto; height:calc(100vh - var(--czh,0px)) !important; object-position:center 25%}
  .t-catalog__prod-popup__info.t-catalog__prod-popup__col-right {width:40% !important; max-width:none !important; margin:0 !important; top:0 !important; padding:72px clamp(32px,5vw,112px) 48px !important; box-sizing:border-box}
  .t-catalog__prod-popup__info > *, .t-catalog__prod-popup__info .t-catalog__tabs {max-width:520px !important}
  .t-catalog__prod-popup__name {font-size:32px !important}
}
@media (max-width:959px) {
  .t-catalog__prod-popup__name {font-size:22px !important}
  .t-catalog__relevants__container {padding-left:20px !important; padding-right:20px !important}   /* на телефоне - как текст страницы товара */
  .t-catalog__relevants__container .t-catalog__card-list {display:flex !important; flex-wrap:nowrap !important; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding-bottom:16px}
  .t-catalog__relevants__container .t-catalog__card-list::-webkit-scrollbar {display:none}
  .t-catalog__relevants__container .t-catalog__card {flex:0 0 calc((100% - 12px) / 1.6) !important; scroll-snap-align:start}
  /* миниатюры фото крупнее */
  .t-catalog__prod-popup__slider .t-slds__thumbsbullet-wrapper {height:auto !important}
  .t-catalog__prod-popup__slider .t-slds__thumbsbullet {width:72px !important; height:96px !important; margin:8px 8px 0 0 !important}
  .t-catalog__prod-popup__slider .t-slds__thumbsbullet .t-slds__bgimg {background-size:cover !important; background-position:center top !important}
}

/* шапка сайта остаётся над окном товара */
body.cz-prod-open .cz-header {z-index:10000002 !important}
body.cz-prod-open .t1291 .t-popup {top:var(--czh,0px) !important; height:calc(100% - var(--czh,0px)) !important}

/* ---------- корзина и избранное: панель справа ---------- */
.t706__cartwin, .t1002__wishlistwin {z-index:10000010 !important; background:rgba(17,17,17,.45) !important}
.t706__cartwin_showed, .t1002__wishlistwin_showed {animation:czFade .3s ease}
@keyframes czFade {from {background:rgba(17,17,17,0)}}
.t706__cartwin {padding:0 !important; overflow:hidden !important}
.t706__cartwin-content {width:100% !important; max-width:560px !important; height:100% !important; margin:0 0 0 auto !important; border-radius:0 !important; overflow-y:auto; box-sizing:border-box}
.t706__cartwin_showed .t706__cartwin-content {animation:czSlide .3s ease}
@keyframes czSlide {from {transform:translateX(100%)} to {transform:none}}
.t706__cartwin-close {background:transparent !important}
.t706__cartwin-close svg g {fill:#111 !important}

.t706__cartwin-content, .t1002__wishlistwin-content {background:#fafafa !important; padding:40px 40px 48px !important}
.t706__cartwin-top, .t1002__wishlistwin-top {padding:0 0 20px !important; border-bottom:1px solid #111 !important}
.t706__cartwin-heading, .t1002__wishlistwin-heading {font-size:22px !important; font-weight:500 !important}
.t706__cartwin-products, .t1002__wishlistwin-products {padding:0 !important; margin:0 !important}
.t706__product, .t1002__product {display:grid !important; grid-template-columns:72px 1fr auto; grid-template-areas:"thumb title del" "thumb qty amount"; align-items:start; column-gap:16px; row-gap:12px; height:auto !important; padding:16px 0 !important; margin:0 !important; border-bottom:1px solid #e6e6e6}
.t1002__product {grid-template-areas:"thumb title del" "thumb amount amount"}
.t706__product-thumb, .t1002__product-thumb {grid-area:thumb}
.t706__product-title, .t1002__product-title {grid-area:title}
.t706__product-plusminus {grid-area:qty; align-self:end}
.t706__product-amount, .t1002__product-amount {grid-area:amount; align-self:end}
.t706__product-amount {text-align:right}
.t706__product-del-wrapper, .t1002__product-del {grid-area:del; justify-self:end}
.t706__product-del-wrapper {position:relative !important; width:20px; height:20px}
.t706__product-del {top:0 !important; right:0 !important}
.t1002__product-del {position:relative !important; top:0 !important; right:auto !important}
@media (max-width:639px) {.t706__cartwin-content, .t1002__wishlistwin-content {padding:24px 20px 32px !important}}
.t706__product > *, .t1002__product > * {width:auto !important; height:auto !important; padding:0 !important}
.t706__product-imgdiv, .t1002__product-imgdiv {width:72px !important; height:96px !important; border-radius:0 !important; background-size:cover !important; background-position:center top !important}
.t706__product-title, .t1002__product-title {font-size:14px !important; font-weight:500 !important; line-height:1.4 !important}
.t706__product-title a, .t1002__product-link {color:#111 !important}
.t706__product-amount, .t1002__product-amount {font-size:14px !important; font-weight:600 !important; white-space:nowrap}
.t706__product-plusminus {white-space:nowrap}
.t706__product-quantity {color:#111 !important}
.t706__product-del, .t1002__product-del {opacity:.45; transition:opacity .2s}
.t706__product-del:hover, .t1002__product-del:hover {opacity:1}
.t706__cartwin-prodamount-wrap {padding:20px 0 !important; font-size:15px !important}

.t706 .t-input-title {font-size:12px !important; letter-spacing:.08em; text-transform:uppercase; color:#8c8c8c !important; padding-bottom:4px !important}
.t706 .t-input {height:48px !important; padding:0 !important; border:0 !important; border-bottom:1px solid #111 !important; border-radius:0 !important; background:transparent !important; font-size:15px !important}
.t706 .t-input-phonemask__wrap {padding:0 !important}
.t706 .t-input-phonemask {border:0 !important}
.t706 .t-submit {height:56px !important; border-radius:0 !important; background:#111 !important; color:#fff !important; font-size:15px !important; font-weight:500 !important}
.t706 .t-submit:hover {background:#d61f26 !important}

/* ---------- счётчики на иконках шапки ---------- */
.cz-cart[data-count]:not([data-count="0"])::after, .cz-fav[data-count]:not([data-count="0"])::after {
  content:attr(data-count); position:absolute; top:-6px; right:-9px; min-width:16px; height:16px; padding:0 4px; box-sizing:border-box;
  border-radius:8px; background:#d61f26; color:#fff; font:600 10px/16px var(--t-text-font,Arial); text-align:center; pointer-events:none}

/* ---------- карточки каталога (ST340: каталог и «Популярные товары» на главной) ---------- */
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card {container-type:inline-size}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__link, :is(.t1291, .t-catalog__relevants__container) .t-catalog__card__textwrapper {display:flex; flex-direction:column}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__contentwrapper, :is(.t1291, .t-catalog__relevants__container) .t-catalog__card__wrap_txt-and-btns {flex-grow:1; display:flex; flex-direction:column}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__wrap_txt-and-btns {padding-left:0 !important; padding-right:0 !important; justify-content:space-between}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__descr {order:-1; margin:0 0 6px}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__title {text-transform:uppercase}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__btns-wrapper {display:grid; grid-template-columns:1fr 1fr; gap:8px}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__btns-wrapper .t-btnflex {width:100%; height:44px; margin:0 !important; padding:0 8px; font-size:14px !important}
:is(.t1291, .t-catalog__relevants__container) .t-btnflex_type_button2:hover {background-color:#d61f26 !important; border-color:#d61f26 !important}
@container (max-width:250px) {:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__btns-wrapper {grid-template-columns:1fr}}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card .t1002__addBtn {width:40px !important; height:40px !important; min-width:0 !important}
:is(.t1291, .t-catalog__relevants__container) .t-catalog__card .t1002__addBtn svg {width:20px !important; height:20px !important}
@media (max-width:639px) {:is(.t1291, .t-catalog__relevants__container) .t-catalog__card__descr, :is(.t1291, .t-catalog__relevants__container) .t-catalog__card__title {font-size:14px !important}}

/* ---------- боковые отступы каталогов (каталог и «Популярные товары») - как у Zero-блоков:
   48 / 16 / 16 / 12 / 12 / 8 px на ширинах 1900 / 1200 / 960 / 640 / 480 / 360, растут вместе с экраном ---------- */
:root {--cz-side:2.5vw}
@media (min-width:360px) {:root {--cz-side:2.2222vw}}
@media (min-width:480px) {:root {--cz-side:2.5vw}}
@media (min-width:640px) {:root {--cz-side:1.875vw}}
@media (min-width:960px) {:root {--cz-side:1.6667vw}}
@media (min-width:1200px) {:root {--cz-side:1.3333vw}}
@media (min-width:1900px) {:root {--cz-side:2.5263vw}}
@media (min-width:2561px) {:root {--cz-side:calc(50vw - 1215px)}}
.t1291 .t-catalog__cont-w-filter {padding-left:var(--cz-side) !important; padding-right:var(--cz-side) !important}
.t1291 .t-catalog__grid-cont:has(> .t1291__header_col) {padding-left:var(--cz-side) !important; padding-right:var(--cz-side) !important}
.t1291 .t1291__header_col, .t1291 .t1291__header_col .t-col {padding-left:0 !important; padding-right:0 !important; margin-left:0 !important; margin-right:0 !important}

/* ---------- очень широкие экраны (больше 2560px, например 4К без масштабирования) ----------
   Zero-блоки с автомасштабированием по окну и высотой «по содержимому» перестают расти после 2560px:
   фон остаётся на всю ширину, содержимое - как на 2560px по центру. 1.3474 = 2560 / 1900 */
@media (min-width:2561px) {
  .t396__artboard[data-artboard-upscale=window][data-artboard-heightmode=hug] {padding-left:calc(50vw - 1215px) !important; padding-right:calc(50vw - 1215px) !important}
  .t396__artboard[data-artboard-upscale=window][data-artboard-heightmode=hug] > :is(.t396__group, .t396__elem) {zoom:1.3474 !important}
}
