/* ============================================================================
   Эффорт Групп — СТРОКА ТОВАРА: действия в одну линию.  Вариант 2, 12.09.2026
   ----------------------------------------------------------------------------
   Только шаблон `effort`, только список раздела. Подключать ПОСЛЕ effort-design.css.
   Откат: снять одну строку подключения. Разметка НЕ меняется — только стили.

   ЧТО БЫЛО НЕ ТАК (замер живого раздела на 1440):
     строка `.single-item-pd`                    1039 × 238 px
     сетка `.eg-product-row`        116px minmax(0,1fr) 177px, gap 0 25px
     вложенная сетка действий       94px minmax(0,1fr)      ⇒ вычислилось 94 + 75
     «Избранное» словом                          75 × 46 px, тексту нужно 77 px
     ⇒ слово рвалось на «Избранно / е» во ВСЕХ 22 кнопках страницы
       (замер Range.getClientRects(): 2 строки, 68,9 + 8,2 px)
     при этом центр строки пустовал: 721 px под именем и двумя чипами

   ЧТО ДЕЛАЕМ:
     • колонка действий 177 → 286 px за счёт пустующего центра (только ≥1200)
     • количество, кнопка и сердце встают в ОДНУ строку вместо двух
     • «Избранное» словом → контурное сердце 44 × 44 (цель нажатия дотягивает до нормы;
       текст остаётся в разметке и читается скринридером, спрятан только визуально)
     • строка 238 → ~190 px ⇒ на 24 строках это около −1 150 px прокрутки

   ЧЕГО НЕ ТРОГАЕМ:
     цвет контура #AF3C0B (выбор владельца 12.09), радиус 10 px и кегль 13/600 у кнопки
     (решение 10.09), зелёную «Новинку», мобильную ветку темы (max-width: 700px).

   ГРАДАЦИЯ ПО ШИРИНЕ — сознательная:
     ≥1200  вариант 2: всё в одну линию, колонка 286 px
     701…1199  вариант 1: кнопка сверху, под ней количество и сердце — на 610-пиксельной
               строке 286 px под действия оставили бы имени 158 px, это слишком тесно
     ≤700   мобильная ветка темы, не касаемся
   ========================================================================== */

/* --- 1. Сердце вместо слова. Работает на всех ширинах выше мобильной ------- */
@media (min-width: 701px) {
  .eg-catalog-list .eg-row-buy .favorite_button {
    width: 44px;
    height: 44px;
    min-width: 0;
    padding: 0;
    background: #FFFFFF;
    border: 1px solid #E3E5E6;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  /* текст остаётся в DOM — скринридер его прочитает, глазами не видно */
  .eg-catalog-list .eg-row-buy .favorite_button span {
    font-size: 0;
    line-height: 0;
    letter-spacing: 0;
  }

  .eg-catalog-list .eg-row-buy .favorite_button::after {
    content: "";
    flex: 0 0 auto;
    width: 19px;
    height: 19px;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A9093' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.4A4.1 4.1 0 0 1 12 8a4.1 4.1 0 0 1 7 2.6C19 15.4 12 20 12 20z'/%3E%3C/svg%3E") no-repeat center / contain;
  }

  /* наведение: рамка и сердце в акцент выбранного контура */
  .eg-catalog-list .eg-row-buy .favorite_button:hover {
    border-color: #AF3C0B;
  }
  .eg-catalog-list .eg-row-buy .favorite_button:hover::after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23AF3C0B' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.6-7-9.4A4.1 4.1 0 0 1 12 8a4.1 4.1 0 0 1 7 2.6C19 15.4 12 20 12 20z'/%3E%3C/svg%3E");
  }
}

/* --- 2. Вариант 1 на средних ширинах: сетка 94 + 44, ничего не рвётся ----- */
@media (min-width: 701px) and (max-width: 1199px) {
  .eg-catalog-list .eg-row-buy .stock-btn__link-wrap,
  .eg-page .eg-row-buy .stock-btn__link-wrap {
    grid-template-columns: 94px 44px;
  }
}

/* --- 3. Вариант 2 на широких: действия в одну линию ----------------------- */
@media (min-width: 1200px) {
  /* Колонка действий шире за счёт пустующего центра — но ТОЛЬКО в строках,
     где есть поле количества. Замер показал побочный эффект: в 23 строках из 24
     на странице раздела кнопка одна («Узнать цену», класс `cart-btn eg-action`,
     без количества и без избранного), и она занимает всю колонку — расширение
     растянуло бы её с 177 до 286 px, то есть добавило бы 23 широкие контурные
     плиты. `:has()` оставляет такие строки ровно как сегодня.
     Если браузер не знает `:has()`, правило просто отбрасывается и колонка
     остаётся 177 px — при этом сердце из §1 всё равно работает и слово не рвётся. */
  .eg-catalog-list .eg-product-row:has(.stock-btn__cnt-cont),
  .eg-page .eg-product-row:has(.stock-btn__cnt-cont) {
    grid-template-columns: 116px minmax(0, 1fr) 286px;
  }

  /* количество, кнопка, сердце — один ряд */
  .eg-catalog-list .eg-row-buy .stock-btn__link-wrap,
  .eg-page .eg-row-buy .stock-btn__link-wrap {
    grid-template-columns: 94px minmax(0, 1fr) 44px;
    grid-template-rows: auto;
    align-items: center;
  }

  .eg-catalog-list .eg-row-buy .stock-btn__link-wrap .stock-btn__cnt-cont,
  .eg-page .eg-row-buy .stock-btn__link-wrap .stock-btn__cnt-cont {
    grid-column: 1;
    grid-row: 1;
  }

  /* кнопка занимала обе колонки первой строки — переносим в середину ряда */
  .eg-catalog-list .eg-row-buy .stock-btn__link-wrap .stock-btn__link,
  .eg-page .eg-row-buy .stock-btn__link-wrap .stock-btn__link {
    grid-column: 2;
    grid-row: 1;
    width: auto;
    min-width: 0;
  }

  .eg-catalog-list .eg-row-buy .stock-btn__link-wrap .favorite_button,
  .eg-page .eg-row-buy .stock-btn__link-wrap .favorite_button {
    grid-column: 3;
    grid-row: 1;
  }
}