/* ─────────────────────────────────────────────────────────────────────────
   Цілі дотику ≥ 44×44 на мобільному · задача №2327 · 27.10.2026
   Поріг 44 px — WCAG 2.5.5 / гайдлайни Android і Apple.

   Підключається ПОСЛІДНИМ у app.blade.php, тому за рівної специфічності
   перемагає site.css / tema-odyn.css / shapka-04.css.

   Усе всередині @media (max-width:768px): десктоп (1920) не чіпаємо
   взагалі. Дві причини знято не тут, а в джерелі (там класи вже були 44,
   їх різав мобільний медіа-запит):
     site.css      @media(max-width:400px) .pcard-add{38×38}  — прибрано
     tema-odyn.css @media(max-width:640px) .zv-kr{38×38}      — прибрано

   Приймання правки: `padding-block` і `min-height` піднімають саму
   клікабельну площу (getBoundingClientRect = padding-box), а не лише
   вигляд. Де сусідній вузол не має права поїхати (шапка, підпис автора,
   крихти) — висота компенсована відʼємним `margin-block`, тобто ціль
   росте, а сітка лишається на місці.

   🔴 Де `padding-block` НЕ годиться: inline-посилання всередині вузла, що
   обрізає текст (`.pcard-title`). Ціль такого посилання і без правки вища
   за 44, бо rect inline-елемента складається з усіх рядків, у тому числі
   обрізаних; padding лише зіштовхує її на сусідню кнопку. Там приймом є
   `display:block` + `min-height` — росте тільки те, чому не хватає.
   ───────────────────────────────────────────────────────────────────── */

@media (max-width: 768px) {

  /* ── кнопки й поля загального призначення ───────────────────────── */
  .btn { min-height: 44px }
  .toolbar select { min-height: 44px }

  /* пошук у шапці: контейнер 44 px різав поле зсередини (44 − 3 border
     = 41), тому піднімаємо і коробку, і те, що в ній */
  .hd4 .search { height: 50px }
  .search input,
  .search button { min-height: 44px }

  /* ── шапка: висота мусить лишитись тією самою ────────────────────── */
  .hd4-tel {
    display: flex;
    align-items: center;
    min-height: 44px;
    margin-block: -12px;      /* 44 − 24 = 20 ≈ попередні 19.2 */
  }
  .hd4-r .lang-switch a {
    min-height: 44px;
    min-width: 44px;
    justify-content: center;
    margin-block: -13px;      /* 44 − 26 = 18 ≈ попередні 19.4 */
  }
  .hd4-cart {
    min-width: 44px;
    min-height: 44px;
  }
  .logo { min-height: 44px }

  /* ── картка товару в сітці ───────────────────────────────────────── */
  /* Назва товару. Перший варіант (`padding-block: 13px`) ВІДКИНУТО після
     переміру: `a` тут inline, і його rect = всі рядки НЕобрізаного тексту,
     а контейнер `.pcard-title` обрізає текст висотою 56.16 px + overflow.
     Тому довгі назви вже мали ціль 74–100 px (лікувати нічого), а padding
     додавав їм 26 px униз — і ціль налазила на `button.pcard-add`
     (переміряно: +1 перекриття 352 px² на головній @360, 541 px² у ru;
     без правки низ довгої назви рівно ДОТОРКАВСЯ до кнопки).

     `display: block` + `min-height` піднімає лише те, чому не хватає:
     короткій назві дає 44, довгій лишає її власну висоту. Перевірено в
     живому рендері на 8 замірах (360/390 × головна/каталог × uk/ru):
     цілей < 44 — 0, перекриттів — 0, число видимих рядків тексту і висоти
     карток ті самі, що й без правки. Обрізку тексту прилад бачити здатен —
     доведено канаркою (inline height:19px → видимих рядків меншає). */
  .pcard-title > a {
    display: block;
    min-height: 44px;
  }

  /* ── каталог ─────────────────────────────────────────────────────── */
  .amp-chip,
  .brand-chip,
  .oe-kat-chip {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .pagination a,
  .pagination span {
    min-width: 44px;
    height: 44px;
  }
  .vyd-perem a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  /* крихти: ціль 44, а рядок лишається 18.6 */
  .breadcrumbs a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-block: -13px;
  }
  /* Посилання «→» у шапці секції: текст — один символ, тому висоти 44 px
     мало, ціль лишалась 12.5 px по ширині (перемір після викату, 2 цілі
     на головній). Ширину додаю теж, текст центрую. */
  .section-head a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
  }

  /* ── сторінка товару ─────────────────────────────────────────────── */
  .qty button { min-width: 44px }
  .prod-trust a { min-height: 44px }

  /* ── головна: підбір, калькулятор, хіти ──────────────────────────── */
  .kalk select,
  .kalk input,
  .kalk-knopka { min-height: 44px }
  .oe-hit .oe-dodaty { min-height: 44px }
  .oe-hit-t a { min-height: 44px }
  .oe-zv-kn {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
  }
  .pv2-mes .oe-zv-kn { display: inline-flex }

  /* ── липка панель знизу ──────────────────────────────────────────── */
  .lypka-panel .lp-tel,
  .lypka-panel .lp-koshyk { min-height: 44px }

  /* ── підвал ──────────────────────────────────────────────────────── */
  /* колонки посилань: тут ціль РОСТЕ по-справжньому. Приймом
     «padding + відʼємний margin» сусідні пункти списку перекрили б одне
     одного на 19 px (крок рядка 25 px), і палець бив би не туди —
     гірше за малу ціль. Підвал на мобільному стає вищим, і це правильно. */
  .pv2-kol a {
    display: flex;
    align-items: center;
    min-height: 44px;
  }
  .pv2-vse {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .pv2-tel {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .pv2-storinky a { min-height: 44px }
  /* підпис автора — один рядок дрібним, росте лише ціль */
  .pv2-avtor a { padding-block: 14px }

}