/* УКАПАК: логотип в шапке, слайдер на главной, изображения категорий (08–09.10.2026).
   Откат: удалить строку подключения ukapak.css из head.html и вернуть header.html/home.html/category.html из *.before_imgs */
:root { --ukp-accent: #e83969; --ukp-gray: #727271; }

/* ── Шапка: [Каталог] [логотип по центру] [поиск] ── */
#header-container.appnav { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
#header-container > .is-dropdown-nav,
#header-container > .is-inline-nav { order: 1; flex: 1 1 0; min-width: 0; }
#header-container > .ukp-brand { order: 2; flex: 0 1 450px; }
#header-container > form.search { order: 3; flex: 1 1 0; min-width: 180px; display: flex; justify-content: flex-end; }
#header-container > form.search .search-wrapper { width: 100%; max-width: 340px; }
#header-container > .is-pages { order: 4; flex: 1 1 100%; }
#header-container > .is-pages:empty { display: none; }
.ukp-brand { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
.ukp-logo { display: block; line-height: 0; max-width: 100%; }
.ukp-logo img { display: block; width: 450px; max-width: 100%; height: auto; }
.ukp-phone { margin-top: 4px; font-weight: 600; font-size: 1.05em; letter-spacing: .02em; color: var(--ukp-accent) !important; text-decoration: none; white-space: nowrap; }
.ukp-phone:hover { text-decoration: underline; }
@media (max-width: 1024px) {
  #header-container > .ukp-brand { flex: 1 1 100%; order: 0; }
  #header-container > .is-dropdown-nav, #header-container > .is-inline-nav { flex: 0 0 auto; }
  #header-container > form.search { flex: 1 1 200px; }
  #header-container > form.search .search-wrapper { max-width: none; }
}
@media (max-width: 768px) {
  header.globalheader { position: relative; } /* шапка с крупным логотипом не «прилипает» на телефоне */
  .ukp-logo img { width: 100%; }
  #header-container > form.search { flex: 0 0 auto; min-width: 0; justify-content: flex-start; }
  #header-container > form.search .search-wrapper { width: auto; }
  #header-container.search-active > form.search { flex: 1 1 100%; }
  #header-container.search-active > form.search .search-wrapper { width: 100%; }
}

/* ── Слайдер на главной (без обрезки: object-fit: contain, исходные пропорции) ── */
.ukp-slider { position: relative; margin: 0 0 2rem; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 2px 16px rgba(0,0,0,.06); }
.ukp-slider__track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch; margin: 0; padding: 0; list-style: none; }
.ukp-slider__track::-webkit-scrollbar { display: none; }
.ukp-slide { flex: 0 0 100%; scroll-snap-align: start; aspect-ratio: 1280 / 575; margin: 0; padding: 0; background: #fff; }
.ukp-slide a { display: block; width: 100%; height: 100%; }
.ukp-slide img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.ukp-slider__btn { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; border: 0; padding: 0; background: rgba(255,255,255,.85); color: #212121; font-size: 22px; line-height: 40px; cursor: pointer; box-shadow: 0 1px 6px rgba(0,0,0,.15); }
.ukp-slider__btn:hover { background: #fff; color: var(--ukp-accent); }
.ukp-slider__btn--prev { left: 12px; } .ukp-slider__btn--next { right: 12px; }
.ukp-slider__dots { position: absolute; left: 0; right: 0; bottom: 10px; display: flex; justify-content: center; gap: 8px; }
.ukp-slider__dots button { width: 10px; height: 10px; border-radius: 50%; border: 0; padding: 0; background: rgba(33,33,33,.25); cursor: pointer; }
.ukp-slider__dots button[aria-current="true"] { background: var(--ukp-accent); width: 24px; border-radius: 5px; }
@media (max-width: 768px) { .ukp-slider { border-radius: 8px; margin-bottom: 1.25rem; } .ukp-slider__btn { display: none; } .ukp-slider__dots { bottom: 6px; } }

/* ── Изображения категорий ── */
.ukp-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px; margin: 0 0 2rem; padding: 0; list-style: none; }
.ukp-cat { margin: 0; }
.ukp-cat a { display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; padding: 12px; border-radius: 12px; background: #fff; box-shadow: 0 1px 8px rgba(0,0,0,.06); text-decoration: none; color: #212121; text-align: center; transition: box-shadow .15s, transform .15s; }
.ukp-cat a:hover { box-shadow: 0 4px 18px rgba(0,0,0,.12); transform: translateY(-2px); color: var(--ukp-accent); }
.ukp-cat__img { width: 100%; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; }
.ukp-cat__img img { width: 100%; height: 100%; object-fit: contain; }
.ukp-cat__ph { width: 70%; aspect-ratio: 1/1; border-radius: 50%; background: #fbe3ea; color: var(--ukp-accent); display: flex; align-items: center; justify-content: center; font-size: 2.4em; font-weight: 700; }
.ukp-cat__name { font-size: .95em; line-height: 1.25; font-weight: 500; }
@media (max-width: 768px) { .ukp-cats { grid-template-columns: repeat(2, 1fr); gap: 10px; } }
.ukp-cat-head { display: flex; align-items: center; gap: 16px; }
.ukp-cat-head img { width: 96px; height: 96px; object-fit: contain; border-radius: 10px; background: #fff; flex: 0 0 auto; }
.sub-links .ukp-sub-img { width: 36px; height: 36px; object-fit: contain; border-radius: 6px; background: #fff; margin: -6px 8px -6px -6px; vertical-align: middle; }

/* 09.10 фото товаров со старого сайта: миниатюры без квадратной обрезки (знак ukapak.kz в углу должен оставаться виден).
   В шаблонах list-table/product/product.cart/compare размер '96x96' (crop) заменён на '96' (по длинной стороне). */
.more-images .image img { width: 64px; height: 64px; max-width: 64px; object-fit: contain; background: #fff; }
#product-image, .ukp-row .ukp-img img { object-fit: contain; }

/* 09.10 инфостраницы: инфо-меню в шапке, скрыт служебный apps-бар Webasyst, футер 4 колонки. Копия до правки: ukapak.css.before_info_pages */
#globalnav ul.apps, #globalnav .globalnav-bar > nav { display: none !important; }
#header-container > .is-pages { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px 6px; border-top: 1px solid #eee; padding-top: 8px; }
#header-container > .is-pages > li.ukp-info-item > a { font-weight: 500; color: #212121; padding: 6px 12px; border-radius: 6px; }
#header-container > .is-pages > li.ukp-info-item > a:hover, #header-container > .is-pages > li.ukp-info-item.selected > a { color: var(--ukp-accent); background: #fbe3ea; }
.appfooter .row > .ukp-footer { flex: 1 1 100%; }
.ukp-footer { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px 32px; padding: 24px 0 16px; border-bottom: 1px solid #e5e5e5; margin-bottom: 12px; font-size: .92em; line-height: 1.45; text-align: left; }
.ukp-footer__h { font-weight: 700; font-size: 1.05em; margin: 0 0 10px; color: #212121; }
.ukp-footer p { margin: 0 0 10px; }
.ukp-footer ul { list-style: none; margin: 0; padding: 0; }
.ukp-footer li { margin: 0 0 6px; }
.ukp-footer a { color: #212121; }
.ukp-footer a:hover { color: var(--ukp-accent); }
.ukp-footer__phone { font-weight: 700; font-size: 1.15em; color: var(--ukp-accent) !important; text-decoration: none; }
.ukp-footer__hint { color: var(--ukp-gray); font-size: .92em; }
.ukp-footer__map { display: flex; align-items: center; justify-content: center; height: 110px; margin: 0 0 10px; border: 1px dashed #ccc; border-radius: 10px; background: #fafafa; color: var(--ukp-gray) !important; text-decoration: none; text-align: center; padding: 8px; }
.ukp-footer__req { grid-column: 1 / -1; color: var(--ukp-gray); font-size: .9em; padding-top: 10px; border-top: 1px solid #eee; }
@media (max-width: 1024px) { .ukp-footer { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .ukp-footer { grid-template-columns: 1fr; } }
/* инфостраницы */
.ukp-points { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px 24px; margin: 1em 0; }
.ukp-point { padding: 14px 18px; border-radius: 10px; background: #fff; box-shadow: 0 1px 8px rgba(0,0,0,.06); }
.ukp-point h2 { margin-top: 0; }
.ukp-map-ph { display: flex; align-items: center; justify-content: center; min-height: 220px; margin: 1em 0 1.5em; border: 1px dashed #ccc; border-radius: 12px; background: #fafafa; color: var(--ukp-gray); text-align: center; }
.ukp-contact-phone { font-size: 1.15em; }
@media (max-width: 600px) { .ukp-points { grid-template-columns: 1fr; } }

/* УКАПАК 11.10 13:10: инфо-меню 8 пунктов, всё чёрное (без розового), узко → 2 строки по 4. Бэкап: menu_20261011/bk_before/ */
#header-container > .is-pages > li.ukp-info-item > a:hover, #header-container > .is-pages > li.ukp-info-item.selected > a { color: #212121 !important; background: #f2f2f2; }
#header-container > .is-pages > li.ukp-info-item { white-space: nowrap; }
@media (max-width: 768px) {
  #header-container > .is-pages { gap: 2px 0; justify-content: stretch; }
  #header-container > .is-pages > li.ukp-info-item { flex: 0 0 25%; max-width: 25%; text-align: center; box-sizing: border-box; }
  #header-container > .is-pages > li.ukp-info-item > a { display: block; padding: 6px 2px; font-size: 13px; letter-spacing: -0.2px; }
}
@media (max-width: 360px) { #header-container > .is-pages > li.ukp-info-item > a { font-size: 12px; padding: 6px 1px; } }

/* ===== 11.10.2026: цена со скидкой в обычной карточке (только при compare_price>0). Карточка без изменений ===== */
/* Работает везде, без демо-параметра: плитки (.thumbs .pricing) и список категории (ul.ukp-rows .ukp-price) */
/* старая цена — ЧЁРНАЯ как обычная карточка; красным ТОЛЬКО тонкая диагональная полоска ::after */
.thumbs .pricing .compare-at-price.ukp-old-price,
.thumbs .pricing .ukp-old-price,
ul.ukp-rows .ukp-price .compare-at-price.ukp-old-price{
  position:relative;display:inline-block;
  color:#212121 !important;
  text-decoration:none !important;
  font-weight:400;padding:0 2px;
}
.thumbs .pricing .ukp-old-price *,
.thumbs .pricing .compare-at-price.ukp-old-price *,
ul.ukp-rows .ukp-price .ukp-old-price *{color:#212121 !important;text-decoration:none !important;}
.thumbs .pricing .ukp-old-price:after,
ul.ukp-rows .ukp-price .ukp-old-price:after{
  content:"";position:absolute;left:-3px;right:-3px;top:50%;
  border-top:1.5px solid #e00;transform:rotate(-14deg);pointer-events:none;
}
/* новая цена — красная + резкое мигание big<->small (steps, не ease) */
.thumbs .pricing .price.ukp-new-price,
.thumbs .pricing .ukp-new-price,
ul.ukp-rows .ukp-price .price.ukp-new-price{
  color:#e00 !important;
  display:inline-block;transform-origin:left center;
  animation:ukpPriceBlink .7s steps(1,end) infinite;
}
ul.ukp-rows .ukp-price .price.ukp-new-price{transform-origin:right center;margin-top:2px}
ul.ukp-rows .ukp-price .ukp-new-price *{color:#e00 !important}
@keyframes ukpPriceBlink{
  0%,49%{transform:scale(1.18);opacity:1}
  50%,100%{transform:scale(.82);opacity:.55}
}
@media (prefers-reduced-motion:reduce){.thumbs .pricing .ukp-new-price,ul.ukp-rows .ukp-price .ukp-new-price{animation:none}}

/* ukapak 20261014: широкое выпадающее меню каталога */
@media (min-width: 761px){
header ul.flyout-nav li.category-btn-item{position:static;}
header .appnav, header.globalheader .container{position:relative;}
header ul.flyout-nav li.category-btn-item > .flyout{left:0;right:0;width:auto;max-width:none;max-height:75vh;overflow-y:auto;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.15);z-index:1000;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px 20px;padding:20px;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li{display:block;margin:0;width:auto;}
}
@media (min-width:1025px){header.globalheader ul.flyout-nav li.category-btn-item{position:static!important;left:auto!important;}header.globalheader ul.flyout-nav li.category-btn-item > a{position:relative;left:60px;}}
/* ukapak 20261014: скрыть пустые слоты «Скоро» в Акциях */
#akcii ul.ukp-cats[aria-label^="Скоро"]{display:none !important;}

/* ukapak 20261014b: мобильное меню каталога — полный список без узкой прокрутки */
@media (max-width: 760px){
header ul.flyout-nav.is-dropdown-nav{width:100%;}
header ul.flyout-nav li.category-btn-item{position:static;}
header ul.flyout-nav li.category-btn-item > .flyout{position:absolute;left:0;right:0;width:auto!important;max-width:100vw;max-height:none!important;height:auto!important;overflow:visible!important;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.15);z-index:1000;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v{padding:12px 16px;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li{display:block;width:auto;margin:0 0 14px 0;}
}

/* ukapak 20261014: мини-карта в подвале */
.ukp-footer__map.ukp-footer__map--img{display:block;height:130px;padding:0;border:1px solid #e5e5e5;border-radius:10px;overflow:hidden;background:#f3f1ea;}
.ukp-footer__map--img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border:0;}
/* ukapak 20261014: неполный последний ряд плиток каталога — по центру */
ul.ukp-cats:not([aria-label]){display:flex;flex-wrap:wrap;justify-content:center;}
ul.ukp-cats:not([aria-label]) > li.ukp-cat{flex:0 0 calc((100% - 5*16px)/6);max-width:calc((100% - 5*16px)/6);box-sizing:border-box;}
@media (max-width:1024px){ul.ukp-cats:not([aria-label]) > li.ukp-cat{flex-basis:calc((100% - 3*16px)/4);max-width:calc((100% - 3*16px)/4);}}
@media (max-width:760px){ul.ukp-cats:not([aria-label]) > li.ukp-cat{flex-basis:calc((100% - 10px)/2);max-width:calc((100% - 10px)/2);}}
/* ukapak 20261014: заголовок Акция / Скидка / Распродажа с поочерёдной вспышкой */
.ukp-akcii-title{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;}
.ukp-akcii-title > span{display:inline-block;will-change:transform;animation:ukpAkFlash 3s ease-in-out infinite;}
.ukp-akcii-title > span:nth-child(1){transform-origin:left center;animation-delay:0s;}
.ukp-akcii-title > span:nth-child(2){transform-origin:center center;animation-delay:1s;}
.ukp-akcii-title > span:nth-child(3){transform-origin:right center;animation-delay:2s;}
@keyframes ukpAkFlash{
  0%{transform:scale(1);color:inherit}
  8%,25%{transform:scale(1.25);color:#b22222}
  33%,100%{transform:scale(1);color:inherit}
}
@media (max-width:760px){.ukp-akcii-title{font-size:1.25em;gap:4px;}}
@media (max-width:400px){.ukp-akcii-title{font-size:1.1em;}}
@media (prefers-reduced-motion:reduce){.ukp-akcii-title > span{animation:none;}}
/* ukapak 20261014c: меню каталога — один слой, без внутренней прокрутки, плотные колонки */
@media (min-width: 761px){
header ul.flyout-nav li.category-btn-item > .flyout{max-height:none!important;overflow:visible!important;height:auto!important;}
header ul.flyout-nav li.category-btn-item > .flyout .container,
header ul.flyout-nav li.category-btn-item > .flyout .departments{background:transparent!important;box-shadow:none!important;border:0!important;padding:0!important;margin:0!important;max-height:none!important;overflow:visible!important;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v{display:block!important;column-count:4;column-gap:32px;padding:24px 32px!important;margin:0!important;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li{display:block!important;break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 18px 0!important;width:auto!important;}
header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li ul.menu-v li a{padding-top:3px;padding-bottom:3px;}
}
@media (min-width:761px) and (max-width:1024px){header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v{column-count:3;}}

/* ukapak 20261014: на телефоне плитки каталога как раньше, слева */
@media (max-width:760px){ul.ukp-cats:not([aria-label]){justify-content:flex-start;}}
/* ukapak 20261014d: каталог на всю ширину окна, от низа шапки до низа окна */
header.globalheader #header-container{position:static!important;}
header.globalheader ul.flyout-nav li.category-btn-item{position:static!important;}
header.globalheader ul.flyout-nav li.category-btn-item > .flyout{position:absolute!important;left:0!important;right:0!important;top:100%!important;width:auto!important;max-width:none!important;margin:0!important;max-height:none!important;height:auto!important;min-height:calc(100vh - var(--ukp-hb,300px));overflow:visible!important;background:#fff!important;box-shadow:0 10px 24px rgba(0,0,0,.12);border-top:1px solid #eee;z-index:2000!important;box-sizing:border-box;transform:none!important;}
header.globalheader ul.flyout-nav li.category-btn-item > .flyout > .container{max-width:1160px;margin:0 auto!important;padding:0 16px!important;box-sizing:border-box;}
@media (max-width:760px){header.globalheader ul.flyout-nav li.category-btn-item > .flyout > .container{padding:0!important;}}
/* ukapak 20261014b: вспышка — слово растягивается до трети строки (коэффициент --sx из JS) */
.ukp-akcii-title > span{animation-name:ukpAkFlash2!important;animation-duration:3s!important;animation-timing-function:ease-out!important;animation-iteration-count:infinite!important;white-space:nowrap;}
@keyframes ukpAkFlash2{
  0%{transform:scale(1,1);color:inherit}
  6%,24%{transform:scale(var(--sx,1.25),1.25);color:#b22222}
  30%,100%{transform:scale(1,1);color:inherit}
}
@media (prefers-reduced-motion:reduce){.ukp-akcii-title > span{animation:none!important;}}