/* Volt Tech UX — шар довіри v5.22.1 (сучасний компактний футер)
   ─────────────────────────────────────────────────────────────
   v5.22.1: повний редизайн секції під три класи екранів:
     · мобільний  (<640px)  — 1–2 колонки, мінімум висоти прокрутки;
     · ноутбук/ПК (640–1599px) — 2–4 колонки залежно від ширини;
     · телевізор/великий монітор (≥1600px) — той самий макет, але з
       трохи більшим шрифтом і відступами, щоб читалось з відстані
       дивана, і з жорсткою стелею max-width, щоб рядки не
       розтягувались на весь 4K-екран.
   Реквізити продавця (назва ФОП/ТОВ, ЄДРПОУ, адреса) у розмітці
   PHP більше не виводяться в футері жодному відвідувачу — лише
   посилання на Публічну оферту, де ці дані вказані офіційно.
   Тому нижче немає стилів під .vtux-trust-legal з фактичними
   даними — лишився тільки варіант --hint (бачить адмін) та нова
   нижня смуга copyright / посилання на оферту. */

.vtux-trust-foot{
  --vt-tf-fs: 13px;
  --vt-tf-gap: 20px;
  --vt-tf-pad-x: 20px;
  --vt-tf-pad-y: 24px;
  --vt-tf-max: 1240px;

  margin:24px auto 0;
  max-width:var(--vt-tf-max);
  padding:var(--vt-tf-pad-y) var(--vt-tf-pad-x) calc(var(--vt-tf-pad-y) + var(--vt-buyfab-h, 0px) + var(--vt-chatfab-h, 0px));
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.86);
  background:transparent;
  font-size:var(--vt-tf-fs);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
/* На сторінці товару знизу є липка панель «Купити» — під неї потрібен
   додатковий запас, інакше футер ховається під нею. */
body.single-product .vtux-trust-foot{
  padding-bottom:calc(96px + var(--vt-buyfab-h, 0px) + var(--vt-chatfab-h, 0px));
}

.vtux-trust-foot__grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr 1fr;
  gap:var(--vt-tf-gap) 24px;
}

.vtux-trust-col h3{
  margin:0 0 10px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  color:#fff;
  text-transform:uppercase;
  opacity:.9;
}
.vtux-trust-col p{ margin:0 0 6px; color:rgba(255,255,255,.72); }
.vtux-trust-col p:last-child{ margin-bottom:0; }
.vtux-trust-city{ font-size:12px; color:rgba(255,255,255,.55) !important; }

/* — Контакти / Оплата та доставка: компактна стрічка пунктів через
     крапку-роздільник, що переноситься по кілька в рядок, замість
     стовпчика окремих рядків. — */
.vtux-trust-list{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  list-style:none;
  margin:0;
  padding:0;
  gap:4px 0;
}
.vtux-trust-list li{
  display:inline-flex;
  align-items:center;
  white-space:nowrap;
  color:rgba(255,255,255,.72);
}
.vtux-trust-list li:not(:last-child)::after{
  content:"·";
  margin:0 9px;
  opacity:.35;
}

/* — Покупцеві: юридичні посилання одним компактним блоком, що
     переноситься по кілька в рядок замість стовпчика. — */
.vtux-trust-links{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  gap:7px 16px;
}
.vtux-trust-links a,
.vtux-trust-list a{
  color:rgba(255,255,255,.86);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .15s ease, border-color .15s ease;
}
.vtux-trust-links a:hover,
.vtux-trust-list a:hover,
.vtux-trust-links a:focus-visible,
.vtux-trust-list a:focus-visible{
  color:#fff;
  border-bottom-color:currentColor;
}

/* Підказка адміну про незаповнену оферту — не показується покупцям */
.vtux-trust-legal--hint{
  display:inline-block;
  margin-top:8px;
  padding:6px 9px;
  font-size:11.5px;
  line-height:1.4;
  color:#fde68a;
  background:rgba(253,230,138,.08);
  border:1px dashed rgba(253,230,138,.35);
  border-radius:8px;
}
.vtux-trust-mini{
  margin-top:10px;
  font-size:11.5px;
  color:rgba(255,255,255,.55);
}

/* — Нижня смуга: copyright + одне посилання на оферту (де реквізити) — */
.vtux-trust-foot__bottom{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:6px 18px;
  margin-top:20px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:11.5px;
  color:rgba(255,255,255,.5);
}
.vtux-trust-copy{ margin:0; }
.vtux-trust-legal-mini{
  color:rgba(255,255,255,.5);
  text-decoration:none;
  border-bottom:1px solid transparent;
  white-space:nowrap;
  transition:color .15s ease, border-color .15s ease;
}
.vtux-trust-legal-mini:hover,
.vtux-trust-legal-mini:focus-visible{
  color:rgba(255,255,255,.85);
  border-bottom-color:currentColor;
}

/* — Смуга довіри на картці товару (без змін логіки, лише охайність) — */
.vtux-pdp-trust{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0 4px;
  padding:0;
  list-style:none;
}
.vtux-pdp-trust li{
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  border-radius:999px;
  padding:4px 10px;
  font-size:12px;
  font-weight:600;
}

/* — Юридичні сторінки (Оферта, Контакти, Про нас, Приватність) — */
.vtux-legal-page{
  max-width:760px;
  margin:0 auto 40px;
  padding:8px 16px 32px;
  color:#1f2937;
  line-height:1.65;
}
.vtux-legal-page h1{ font-size:28px; margin:12px 0 16px; }
.vtux-legal-page h2{ font-size:18px; margin:22px 0 8px; }
.vtux-legal-bullets{ padding-left:18px; }
.vtux-legal-cta{
  display:inline-block;
  margin-top:8px;
  background:#e0703a;
  color:#fff !important;
  text-decoration:none;
  border-radius:10px;
  padding:10px 16px;
  font-weight:600;
}

/* — Публічна оферта: розгорнутий юридичний документ (шапка, зміст,
     таблиця реквізитів). Використовує ту саму базу .vtux-legal-page. — */
.vtux-oferta-page{ max-width:820px; }

.vtux-oferta-head{
  margin:8px 0 24px;
  padding:20px 22px 22px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  border-radius:14px;
}
.vtux-oferta-badge{
  display:inline-block;
  padding:4px 10px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#9a3412;
  background:#fff;
  border:1px solid #fdba74;
  border-radius:999px;
}
.vtux-oferta-head h1{ margin:12px 0 6px; font-size:26px; line-height:1.25; }
.vtux-oferta-subtitle{
  margin:0 0 14px;
  color:#78716c;
  font-size:14.5px;
  line-height:1.5;
}
.vtux-oferta-lead{
  margin:0;
  padding-top:14px;
  border-top:1px dashed #fdba74;
  font-size:14px;
  font-weight:600;
  color:#9a3412;
}

.vtux-oferta-toc{
  margin:0 0 28px;
  padding:16px 20px;
  background:#f8fafc;
  border:1px solid #e5e7eb;
  border-radius:14px;
}
.vtux-oferta-toc__title{
  margin:0 0 8px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#6b7280;
}
.vtux-oferta-toc ol{
  margin:0;
  padding-left:18px;
  columns:2;
  column-gap:24px;
}
.vtux-oferta-toc li{ break-inside:avoid; margin:0 0 6px; font-size:13.5px; }
.vtux-oferta-toc a{
  color:#374151;
  text-decoration:none;
  border-bottom:1px solid transparent;
}
.vtux-oferta-toc a:hover,
.vtux-oferta-toc a:focus-visible{ color:#d95a12; border-bottom-color:currentColor; }

.vtux-oferta-body h2{
  scroll-margin-top:24px;
  padding-top:6px;
  border-top:1px solid #eef0f2;
}
.vtux-oferta-body h2:first-child{ border-top:0; }
.vtux-oferta-body p{ margin:0 0 12px; }
.vtux-oferta-body ul{ margin:0 0 14px; padding-left:20px; }
.vtux-oferta-body ul li{ margin:0 0 6px; }
.vtux-oferta-body hr{ margin:24px 0; border:0; border-top:1px solid #e5e7eb; }
.vtux-oferta-body strong{ color:#111827; }

/* — Таблиця реквізитів продавця: акцентована карткою, зебра-рядки,
     моноширинний IBAN, щоб цифри легко звірялись. — */
.vtux-oferta-req-table{
  width:100%;
  margin:8px 0 20px;
  border-collapse:collapse;
  font-size:14px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  overflow:hidden;
}
.vtux-oferta-req-table td{
  padding:10px 14px;
  border-bottom:1px solid #f1f5f9;
  vertical-align:top;
}
.vtux-oferta-req-table tr:last-child td{ border-bottom:0; }
.vtux-oferta-req-table tr:nth-child(odd){ background:#f8fafc; }
.vtux-oferta-req-table td:first-child{
  width:44%;
  color:#6b7280;
  font-weight:600;
}
.vtux-oferta-req-table td:last-child{ font-weight:600; color:#111827; }
.vtux-oferta-req-table tr:nth-child(4) td:last-child{ /* IBAN */
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing:.02em;
}

@media (max-width:600px){
  .vtux-oferta-head{ padding:16px; }
  .vtux-oferta-toc ol{ columns:1; }
}
.vtux-tm-empty{
  max-width:720px;
  margin:0 auto 8px;
  padding:18px 16px;
  text-align:center;
  color:#475569;
  background:#f8fafc;
  border:1px dashed #cbd5e1;
  border-radius:14px;
}

/* ═══════════════════════════════════════════════════════════════
   Планшет / вузький ноутбук: 2 колонки замість 4.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:960px){
  .vtux-trust-foot__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 22px; }
}

/* ═══════════════════════════════════════════════════════════════
   Мобільний: бренд-колонка на всю ширину, решта — компактна
   сітка 2×2. Один зменшений розмір шрифту й вужчі відступи, щоб
   футер не «з'їдав» екран телефону.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:640px){
  .vtux-trust-foot{
    --vt-tf-fs: 12.5px;
    --vt-tf-pad-x: 16px;
    --vt-tf-pad-y: 18px;
    margin-top:16px;
  }
  .vtux-trust-foot__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 14px; }
  .vtux-trust-col:first-child{ grid-column:1 / -1; }
  .vtux-trust-col:first-child p{ font-size:12px; }
  .vtux-trust-col h3{ margin-bottom:8px; }
  .vtux-pdp-trust{ gap:6px; }

  .vtux-trust-foot__bottom{
    justify-content:center;
    text-align:center;
    margin-top:16px;
    padding-top:12px;
  }
}

/* ═══════════════════════════════════════════════════════════════
   Дуже вузький мобільний (складані/старі телефони): бренд-колонка
   лишається зверху на всю ширину, решта 3 блоки стають одним
   стовпчиком — на екранах ~360px і менше 2 колонки вже занадто тісні.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:380px){
  .vtux-trust-foot__grid{ grid-template-columns:1fr; }
  .vtux-trust-col:first-child{ grid-column:auto; }
}

/* ═══════════════════════════════════════════════════════════════
   Великий монітор / ноутбук з Retina (≥1600px): трохи ширший
   контейнер і повітря між колонками — на дуже широких вікнах
   4 вузькі колонки виглядали загубленими в порожньому просторі.
   ═══════════════════════════════════════════════════════════════ */
@media (min-width:1600px){
  .vtux-trust-foot{
    --vt-tf-max: 1400px;
    --vt-tf-pad-y: 28px;
  }
  .vtux-trust-foot__grid{ gap:24px 32px; }
}

/* ═══════════════════════════════════════════════════════════════
   Телевізор / великий екран у 10-футовому інтерфейсі (≥1920px,
   типово Smart TV браузери й підключення ПК до ТВ): контент і так
   не розтягується завдяки max-width вище, але з дивана дрібний
   13px-текст читати важко. Трохи збільшуємо шрифт і міжряддя,
   не ламаючи саму сітку колонок.
   ═══════════════════════════════════════════════════════════════ */
@media (min-width:1920px){
  .vtux-trust-foot{
    --vt-tf-fs: 15px;
    --vt-tf-max: 1520px;
    --vt-tf-pad-y: 36px;
  }
  .vtux-trust-foot h3{ font-size:13px; }
  .vtux-trust-foot__bottom{ font-size:13px; }
}
