/* ==========================================================================
   Bartenders — «Замовити» у блоці «Склад» (сторінка рецепта)
   Макет: «Партнерський перехід - v2 (моб + десктоп).dc.html», секції 7a / 7b.

   Додається в кінець assets/css/... плагіна bartenders-redesign
   (або підключається окремо ПІСЛЯ стилів шаблону WPRM chic-bartenders).

   Стиль CTA обирає JS, виставляючи на контейнері один із класів:
     .brt-buy-quiet   — 3+ партнерських посилань у блоці → тихий рядок (7a)
     .brt-buy-outline — 1–2 посилання                    → контурна кнопка (7b)

   Порожній алоулист хостів → CTA не з'являється, блок виглядає як зараз.

   Дельти від файла хендоффа позначені коментарями "delta vs handoff".
   ========================================================================== */

/* --- спільне ------------------------------------------------------------- */

/* delta vs handoff: базові правила скоуплені до .wprm-recipe-container —
   голий .brt-buy (0,1,0) програвав би правилу шаблону
   .wprm-recipe-template-chic-bartenders a (0,1,1), яке друкується ПІСЛЯ
   цього файла (inline-CSS шаблону WPRM іде на wp_head:10 / wp_footer:99),
   і CTA ставав би синім підкресленим. box-sizing зафіксовано, щоб
   min-height тап-зони не залежав від глобального border-box теми. */

.wprm-recipe-container .brt-buy {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  line-height: 1.45;
  color: #1f6e54;
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.wprm-recipe-container .brt-buy:visited { color: #1f6e54; }
.brt-buy .brt-buy-arrow { flex: none; }

/* delta vs handoff: явний скидач підкреслення в усіх станах — a:hover
   шаблону (0,2,1) інакше повертав би underline на hover. */
.wprm-recipe-container .brt-buy,
.wprm-recipe-container .brt-buy:hover,
.wprm-recipe-container .brt-buy:focus,
.wprm-recipe-container .brt-buy:active,
.wprm-recipe-container .brt-buy:visited {
  text-decoration: none;
}

.wprm-recipe-container .brt-buy:focus-visible {
  outline: 2px solid #1f6e54;
  outline-offset: 2px;
  border-radius: 9px;
}

/* --- 7a · тихий рядок: 3+ посилань --------------------------------------
   Тап-зона 44px набирається padding'ом, негативний margin поглинає власний
   нижній padding картки (15px у шаблоні chic-bartenders), тому картка
   виростає на ~30px, а не на 45px. */

.brt-buy-quiet .brt-buy {
  margin: 1px -15px -15px;
  padding: 12px 0 15px;
  /* delta vs handoff: самих padding'ів (12+15+рядок 16.7 ≈ 43.7px) на 44px
     не вистачало; min-height гарантує тап-зону на обох брейкпоінтах,
     приріст картки лишається ~30px (44 − 15 поглинутих + 1 margin). */
  min-height: 44px;
}

/* delta vs handoff: hover-зміни прибрані повністю (запит автора) — на ховері
   CTA не змінюється; лишається тільки :active як фідбек тапу. */
.brt-buy-quiet .brt-buy:active { color: #185a44; }

/* --- 7b · контурна кнопка: 1–2 посилання -------------------------------
   Рамка лишається 31px — довга назва інгредієнта не отримує ще й високу
   кнопку. Тап-зона 45px додається прозорим ::after ПОЗА рамкою. */

.brt-buy-outline .brt-buy {
  position: relative;
  margin-top: 11px;
  padding: 7px 8px;
  background: #fff;
  border: 1px solid #cfe5dc;
  border-radius: 9px;
  /* delta vs handoff: із успадкованим line-height 1.45 кнопка виходила
     ≈32.7px; 15px дає рівно заявлені 31px (15+7+7+1+1), а ::after-зона
     -7px/-7px — рівно 45px. Не залежить від box-sizing. */
  line-height: 15px;
}

.brt-buy-outline .brt-buy::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -7px;
  bottom: -7px;
}

/* delta vs handoff: hover-зміни прибрані повністю (запит автора), тільки :active. */
.brt-buy-outline .brt-buy:active {
  background: #eef5f2;
  border-color: #1f6e54;
}

/* Кнопка тримається низу картки, щоб у рядку вони стояли на одній лінії.
   Картки без партнерського посилання не отримують ні кнопки, ні заглушки. */
.brt-buy-outline li.wprm-recipe-ingredient:has(.brt-buy) {
  display: flex;
  flex-direction: column;
}
.brt-buy-outline .wprm-recipe-ingredient-details-container:has(.brt-buy) {
  flex: 1;
  justify-content: flex-start;
}
/* delta vs handoff: голий "margin-top: auto" (0,2,0) перебивав margin-top: 11px
   і в найвищій картці ряду клеїв кнопку до тексту впритул (auto → 0). Тепер
   auto діє тільки в :has-гілці, а мінімальні 11px гарантує margin-bottom
   останнього елемента перед кнопкою; браузери без :has лишаються на
   margin-top: 11px. row-gap на контейнері не підходить — розсунув би й
   name/notes/amount, і тільки в картках із CTA. */
.brt-buy-outline li.wprm-recipe-ingredient:has(.brt-buy) .brt-buy { margin-top: auto; }
.brt-buy-outline .wprm-recipe-ingredient-details-container > :has(+ .brt-buy) {
  margin-bottom: 11px;
}

/* --- позначення партнера (один рядок під усім блоком) ------------------- */

.brt-buy-note {
  margin-top: 12px;
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 10.5px;
  line-height: 1.5;
  color: #a9b0b8;
  text-align: center;
}

/* --- десктоп ------------------------------------------------------------ */
/* Сітка шаблону: 5 карток у рядку від 1076px, 3 — від 642px, 2 — до 641px.
   Геометрія CTA не змінюється, лише трохи щільніший рядок на широких. */

@media (min-width: 642px) {
  .brt-buy-quiet .brt-buy { padding: 11px 0 15px; }
}
