/* uv-set-v2.css (UV-SET, 13.10.2026; v2: підпис і заблокована кількість біля товарів набору в кошику) - блок «Акційний набір» на картці пода і сторінка «Акційні набори» uvape.com.ua.
   Сітка, рамка й шрифти з дизайн-системи uv-ux (8 px, рамка 16 px, Mont). Пара до uv-set-v3.js; нова версія = нова назва файла.
   Скрипт викладки: uvape-dyzain/deploy/nabir.py. */

/* --- підказка в блоці «Купити» --- */
.uvn-teaser { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; margin: 12px 0 0; padding: 8px 12px;
  border: 0; border-radius: 12px; background: #fff4ec; color: #111; text-align: left; cursor: pointer;
  font-family: "Mont Regular", sans-serif; font-size: 14px; line-height: 1.3; }
.uvn-teaser b { font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-weight: 700; }
.uvn-teaser b, .uvn-teaser s { white-space: nowrap; }
.uvn-teaser s { color: #6b6b6b; }
.uvn-teaser__ico { flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%; background: #ec5500; display: grid; place-items: center; }
.uvn-teaser__ico svg { width: 16px; height: 16px; stroke: #fff; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.uvn-teaser__txt { flex: 1 1 auto; }
.uvn-teaser__arr { flex: 0 0 auto; width: 16px; height: 16px; stroke: #111; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.uvn-teaser:focus-visible, .uvn-slot:focus-visible, .uvn-buy:focus-visible, .uvn-opt:focus-visible, .uvn-chip:focus-visible, .uvn-x:focus-visible {
  outline: 2px solid #111; outline-offset: 2px; }

/* --- сам блок --- */
.uvn-set { order: -1; margin: 0 0 12px; padding: 14px; border: 1px solid var(--uv-border, #e6e6e6); border-radius: var(--uv-r, 16px);
  background: #fff; color: var(--uv-ink, #111); font-family: "Mont Regular", sans-serif; font-size: 15px; line-height: 1.35; scroll-margin-top: 96px; }
.uvn-set__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.uvn-set__title { margin: 0; font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 18px; line-height: 1.25; font-weight: 700; }
.uvn-set__sub { margin: 4px 0 0; font-size: 13px; color: #5c5c5c; }
.uvn-badge { flex: 0 0 auto; padding: 6px 10px; border-radius: 999px; background: #fff1e8; color: #a83c00; white-space: nowrap;
  font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 14px; line-height: 1.2; font-weight: 700; }

.uvn-rows { margin: 8px 0 0; }
.uvn-row, .uvn-slot { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; padding: 12px 0;
  border: 0; border-top: 1px solid #efefef; background: none; color: inherit; text-align: left; font: inherit; }
.uvn-rows > :first-child { border-top: 0; }
.uvn-slot { cursor: pointer; min-height: 80px; }
.uvn-pic { width: 56px; height: 56px; border-radius: 10px; object-fit: contain; background: #fff; }
.uvn-lbl { display: block; font-size: 12px; line-height: 1.3; color: #5c5c5c; }
.uvn-name { display: block; font-family: "Mont SemiBold", sans-serif; font-size: 14px; line-height: 1.3; font-weight: 600;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.uvn-desc { display: block; font-size: 13px; line-height: 1.3; color: #5c5c5c; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.uvn-chg { display: inline-flex; align-items: center; gap: 2px; margin-top: 4px; font-family: "Mont SemiBold", sans-serif; font-size: 13px; color: #a83c00; }
.uvn-chg svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.uvn-price { text-align: right; white-space: nowrap; font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 15px; font-weight: 700; }
.uvn-price s { display: block; font-family: "Mont Regular", sans-serif; font-size: 12px; font-weight: 400; color: #6b6b6b; }

.uvn-total { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 4px 0 0; padding: 12px 0 0; border-top: 1px solid #efefef; }
.uvn-total__l { font-size: 14px; color: #5c5c5c; }
.uvn-total__l b { display: block; margin-top: 2px; font-family: "Mont SemiBold", sans-serif; font-size: 13px; font-weight: 600; color: #1f6f43; }
.uvn-total__r { text-align: right; white-space: nowrap; }
.uvn-total__r s { display: block; font-size: 13px; color: #6b6b6b; }
.uvn-total__r strong { font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 24px; line-height: 1.1; font-weight: 700; }
.uvn-buy { display: block; width: 100%; height: 52px; margin: 12px 0 0; border: 0; border-radius: 26px; background: #111; color: #fff; cursor: pointer;
  font-family: "Mont SemiBold", sans-serif; font-size: 17px; font-weight: 600; transition: background-color .15s ease; }
.uvn-buy:hover { background: #2b2b2b; }
.uvn-note { margin: 10px 0 0; font-size: 12px; line-height: 1.4; color: #5c5c5c; text-align: center; }

/* --- вибір смаку: панель знизу на телефоні, вікно на ПК --- */
.uvn-sheet { position: fixed; inset: 0; z-index: 2147482000; display: none; }
.uvn-sheet.is-open { display: block; }
.uvn-sheet__back { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); }
.uvn-sheet__panel { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; max-height: 86vh; max-height: 86dvh;
  border-radius: 16px 16px 0 0; background: #fff; color: #111; font-family: "Mont Regular", sans-serif; animation: uvn-up .2s ease-out; }
@keyframes uvn-up { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.uvn-sheet__head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 8px 6px 16px; }
.uvn-sheet__title { margin: 0; font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 18px; line-height: 1.25; font-weight: 700; }
.uvn-x { flex: 0 0 44px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: none; cursor: pointer; display: grid; place-items: center; }
.uvn-x svg { width: 20px; height: 20px; stroke: #111; fill: none; stroke-width: 2; stroke-linecap: round; }
.uvn-chips { flex: 0 0 auto; display: flex; gap: 8px; padding: 4px 16px 12px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.uvn-chips::-webkit-scrollbar { display: none; }
.uvn-chip { flex: 0 0 auto; min-height: 40px; padding: 0 14px; border: 1px solid #d9d9d9; border-radius: 20px; background: #fff; color: #111; cursor: pointer;
  font-family: "Mont SemiBold", sans-serif; font-size: 14px; white-space: nowrap; }
.uvn-chip.is-on { border-color: #111; background: #111; color: #fff; }
.uvn-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 16px calc(16px + env(safe-area-inset-bottom)); overscroll-behavior: contain; }
.uvn-opt { display: grid; grid-template-columns: 48px minmax(0, 1fr) 24px; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 8px 0;
  border: 0; border-top: 1px solid #efefef; background: none; color: inherit; text-align: left; font: inherit; cursor: pointer; }
.uvn-opt:first-child { border-top: 0; }
.uvn-opt img { width: 48px; height: 48px; border-radius: 8px; object-fit: contain; }
.uvn-opt .uvn-name { -webkit-line-clamp: 1; }
.uvn-opt__mark { width: 24px; height: 24px; border: 2px solid #c9c9c9; border-radius: 50%; display: grid; place-items: center; }
.uvn-opt__mark svg { width: 14px; height: 14px; stroke: #fff; fill: none; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.uvn-opt.is-on .uvn-opt__mark { border-color: #ec5500; background: #ec5500; }
.uvn-opt.is-on .uvn-opt__mark svg { opacity: 1; }
.uvn-opt[disabled] { opacity: .45; cursor: default; }
html.uvn-lock, html.uvn-lock body { overflow: hidden !important; }

.uvn-toast { position: fixed; left: 12px; right: 12px; bottom: 84px; z-index: 2147482500; padding: 12px 14px; border-radius: 12px; background: #111; color: #fff;
  font-family: "Mont Regular", sans-serif; font-size: 14px; line-height: 1.35; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); }

/* --- сторінка «Акційні набори» --- */
.uvn-pg { padding: 0 0 24px; color: #111; font-family: "Mont Regular", sans-serif; }
.uvn-pg .uvn-pg__h1 { margin: 0 0 8px; font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 24px; line-height: 1.25; font-weight: 700; text-align: left; }
.uvn-pg__lead { max-width: 640px; margin: 0 0 16px; font-size: 15px; line-height: 1.45; color: #3d3d3d; }
/* кроки: на телефоні списком (номер ліворуч, текст в один рядок), на ПК в один рядок зі стрілками */
.uvn-pg .uvn-steps { display: flex; flex-direction: column; gap: 10px; margin: 0 0 16px; padding: 14px 16px; list-style: none; border-radius: 16px; background: #fff4ec; }
.uvn-pg .uvn-steps li { display: flex; flex-direction: row; align-items: center; gap: 12px; margin: 0; padding: 0; text-align: left; font-size: 15px; line-height: 1.3; }
.uvn-pg .uvn-steps li::before, .uvn-pg .uvn-steps li::marker { content: none; }
.uvn-pg .uvn-steps b { flex: 0 0 28px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #111; color: #fff; font-family: "Mont Bold", sans-serif; font-size: 14px; line-height: 1; }
.uvn-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.uvn-pg a.uvn-tile { position: relative; display: flex; flex-direction: column; padding: 12px; border: 1px solid #e6e6e6; border-radius: 16px; background: #fff; color: #111; text-decoration: none; }
.uvn-pg a.uvn-tile:hover, .uvn-pg a.uvn-tile:focus-visible { border-color: #111; color: #111; text-decoration: none; }
.uvn-tile .uvn-badge { position: absolute; top: 10px; left: 10px; z-index: 1; padding: 4px 8px; font-size: 12px; }
.uvn-tile__img { width: 100%; height: auto; aspect-ratio: 1 / 1; margin: 0 0 8px; object-fit: contain; }
.uvn-tile__name { font-family: "Mont SemiBold", sans-serif; font-size: 14px; line-height: 1.3; font-weight: 600;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.uvn-tile__sub { margin-top: 2px; font-size: 12px; line-height: 1.35; color: #5c5c5c; }
.uvn-tile__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin-top: auto; padding-top: 8px; }   /* ціна й кнопка притиснуті донизу, щоб плитки в ряду були рівні */
.uvn-tile__price strong { font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 18px; line-height: 1.2; font-weight: 700; white-space: nowrap; }
.uvn-tile__price s { font-size: 13px; color: #6b6b6b; white-space: nowrap; }
.uvn-tile__btn { display: grid; place-items: center; height: 44px; margin-top: auto; border-radius: 22px; background: #111; color: #fff; font-family: "Mont SemiBold", sans-serif; font-size: 14px; }
.uvn-tile__price + .uvn-tile__btn { margin-top: 10px; }
.uvn-how { margin: 24px 0 0; padding: 16px; border: 1px solid #e6e6e6; border-radius: 16px; }
.uvn-pg .uvn-how h2 { margin: 0 0 8px; font-family: "Mont Bold", "Mont SemiBold", sans-serif; font-size: 20px; line-height: 1.25; font-weight: 700; text-align: left; }
.uvn-pg .uvn-how ul { margin: 0; padding: 0 0 0 20px; font-size: 15px; line-height: 1.5; list-style: disc; }
.uvn-pg .uvn-how li + li { margin-top: 4px; }

@media (min-width: 768px) {
  .uvn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .uvn-pg .uvn-steps { flex-direction: row; align-items: center; gap: 12px; width: fit-content; max-width: 100%; padding: 12px 20px; }
  .uvn-pg .uvn-steps li { white-space: nowrap; }
  .uvn-pg .uvn-steps li + li::before { content: ""; flex: 0 0 8px; width: 8px; height: 8px; margin: 0 8px 0 0; border-top: 2px solid #111; border-right: 2px solid #111; transform: rotate(45deg); opacity: .45; }
  .uvn-pg .uvn-pg__h1 { font-size: 28px; }
  .uvn-sheet__panel { left: 50%; right: auto; top: 50%; bottom: auto; width: 520px; max-height: 80vh; border-radius: 16px; transform: translate(-50%, -50%); animation: none; }
  .uvn-list { padding-bottom: 16px; }
  .uvn-toast { left: auto; right: 24px; bottom: 24px; max-width: 380px; }
}
@media (min-width: 1200px) { .uvn-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 992px) {
  .uvn-set { margin-bottom: 16px; padding: 20px; }
  .uvn-teaser { margin-top: 16px; }
  .uvn-slot:hover .uvn-chg { text-decoration: underline; }
  .uvn-opt:hover { background: #fafafa; }
}
@media (prefers-reduced-motion: reduce) { .uvn-sheet__panel { animation: none; } .uvn-buy { transition: none; } }

/* --- товари набору в кошику, вікні «товар додано» і на оформленні: позначка і без зміни кількості --- */
.uvn-tag { display: inline-block; margin: 4px 0 0; padding: 3px 8px; border-radius: 999px; background: #fff1e8; color: #a83c00; white-space: nowrap;
  font-family: "Mont SemiBold", sans-serif; font-size: 12px; line-height: 1.3; font-weight: 600; vertical-align: middle; }
.input-group.uvn-qlock .input-group-btn, .input-group.uvn-qlock .btn-minus, .input-group.uvn-qlock .btn-plus { display: none !important; }
.input-group.uvn-qlock input { pointer-events: none; border-color: transparent !important; background: transparent !important; box-shadow: none !important; }
.uvco-item.uvn-qlock .uvco-qty [data-q] { display: none !important; }
