/* Easy Paw — сторінка товару; галерея — штатні FlexSlider + PhotoSwipe WooCommerce, тут лише стилізація */

.product-single { padding: 30px 0 60px; }

/* Штатний банер «додано до кошика» зайвий — стан показує сама кнопка (js/pages/product.js) */
.woocommerce-message { display: none; }

.product-single__layout {
    display: flex;
    align-items: flex-start;
    gap: var(--gap-2xl);
    margin-bottom: var(--gap-2xl);
}

/* ── Галерея ────────────────────────────────────────────────────────────── */
.product-single__gallery {
    flex: 1 1 50%;
    min-width: 0;
}

.woocommerce-product-gallery {
    position: relative;
}

/* max-width лише на «вікні»: __wrapper — «плівка» слайдів FlexSlider (inline width:1200%), обмежувати її не можна */
.flex-viewport { max-width: 460px; margin: 0 auto; }

/* Стрілки додає js/pages/product.js:galleryDirectionNav(); position:relative на viewport ставить FlexSlider */
.product-gallery-nav {
    position: absolute;
    top: 50%;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-top: -18px;
    border: 0;
    border-radius: var(--radius-circle);
    background: var(--color-white);
    box-shadow: var(--shadow-sm);
    color: var(--color-text);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: background var(--transition), color var(--transition);
}

.product-gallery-nav:hover { background: var(--color-primary); color: var(--color-white); }

.product-gallery-nav--prev { left: var(--gap-sm); }
.product-gallery-nav--next { right: var(--gap-sm); }

.woocommerce-product-gallery__image {
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--color-bg-alt);
    cursor: pointer;
}

.woocommerce-product-gallery__image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
}

/* Кнопка-лупа лишається в DOM (display:none) — її програмно клікає js/pages/product.js:openGalleryLightbox() */
.woocommerce-product-gallery__trigger { display: none; }

/* !important — PhotoSwipe анімує .pswp__bg власним inline-стилем */
.pswp__bg { opacity: .6 !important; }

/* Мініатюри: стрічка з прокруткою під фото; від 768px — колонка зліва (@media нижче) */
.flex-control-thumbs {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--gap-sm);
    margin-top: var(--gap-sm);
    padding-bottom: 4px;
    list-style: none;
    overflow-x: auto;
}

.flex-control-thumbs li { flex: 0 0 auto; width: 72px; }

.flex-control-thumbs img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 2px solid var(--color-border);
    border-radius: var(--radius-sm);
    object-fit: contain;
    background: var(--color-bg-alt);
    cursor: pointer;
    transition: border-color var(--transition);
}

.flex-control-thumbs img:hover,
.flex-control-thumbs img.flex-active { border-color: var(--color-primary); }

/* ── Інформаційна колонка ──────────────────────────────────────────────── */
.product-single__info {
    flex: 1 1 50%;
    min-width: 0;
}

/* Єдиний ритм відступів між блоками колонки замість розрізнених margin */
.product-single__info > * + * { margin-top: var(--gap-xl); }

.product-single__brand { flex: 0 0 auto; }

.product-single__brand img {
    display: block;
    height: 36px;
    width: auto;
    max-width: 140px;
    object-fit: contain;
}

.product-single__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--gap-md);
}

.product-single__title {
    font-size: 26px;
    line-height: 1.3;
    font-weight: var(--fw-bold);
}

/* База — .product-card__reviews (product-card.css); тут лише специфіка колонки товару */
.product-single__reviews {
    margin-bottom: var(--gap-md);
    font-size: var(--fs-body);
}

/* Клас, не голий span — інакше сірим фарбувався б і span заливки зірок */
.product-single__reviews-count { color: var(--color-text-muted); }

/* Зірки card-розміру (12px) губляться поруч із h1 — тут контекст більший. */
.product-single__reviews .star-rating { font-size: 16px; }

/* ── Buy box: наявність + ціна (і навпроти — обране) + форма кошика ─────── */
.product-single__buybox > * + * { margin-top: var(--gap-md); }

.product-single__price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gap-md);
}

/* Як product-card__wishlist, але більша і в потоці */
.product-single__wishlist {
    position: static;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
}

.product-single__stock {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-small);
    font-weight: var(--fw-bold);
}

.product-single__stock-dot {
    width: 8px;
    height: 8px;
    border-radius: var(--radius-circle);
}

.product-single__stock.is-in-stock { color: var(--color-primary); }
.product-single__stock.is-in-stock .product-single__stock-dot { background: var(--color-primary); }

.product-single__stock.is-out-of-stock { color: var(--color-sale); }
.product-single__stock.is-out-of-stock .product-single__stock-dot { background: var(--color-sale); }

.product-single__price {
    font-size: 32px;
    line-height: 1.2;
    font-weight: var(--fw-bold);
}

/* !important — woocommerce.css фарбує .woocommerce-Price-amount напряму; скоуп на весь buybox, щоб фарбувалась і ціна варіації */
.product-single__buybox .woocommerce-Price-amount.amount { color: var(--color-primary) !important; }

.product-single__price del {
    margin-right: var(--gap-sm);
    color: var(--color-text-muted);
    font-size: 20px;
    font-weight: var(--fw-normal);
    text-decoration: line-through;
}

/* Закреслена ціна лишається приглушеною — не кольором акценту */
.product-single__buybox del .woocommerce-Price-amount.amount { color: var(--color-text-muted) !important; }

.product-single__price ins { color: var(--color-sale); text-decoration: none; }

/* ── Форма «Додати в кошик» (варіації, кількість, кнопка) ──────────────── */

.product-single__cart table.variations {
    width: 100%;
    margin-bottom: var(--gap-lg);
    border-collapse: collapse;
}

.product-single__cart table.variations tr + tr { margin-top: var(--gap-md); }

.product-single__cart table.variations th,
.product-single__cart table.variations td {
    display: block;
    width: 100%;
    padding: 0;
    text-align: left;
}

.product-single__cart table.variations th.label {
    margin-bottom: var(--gap-xs);
    font-weight: var(--fw-bold);
}

.product-single__cart table.variations select {
    width: 100%;
    max-width: 320px;
    padding: 12px 18px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-bg);
    color: var(--color-text);
    font-family: inherit;
    font-size: var(--fs-body);
    cursor: pointer;
}

/* Свотчі (js/pages/product.js) підміняють select; !important — селектор woocommerce.css специфічніший, інакше select видно поверх свотчів */
.product-single__cart table.variations select.has-swatches { display: none !important; }

.variation-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-sm);
}

.variation-swatch {
    padding: 2px 16px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-bg);
    color: var(--color-text);
    font-family: inherit;
    font-size: var(--fs-body);
    cursor: pointer;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.variation-swatch:hover { border-color: var(--color-primary); }

.variation-swatch.is-selected {
    border-color: var(--color-primary);
    background: var(--color-primary);
    color: var(--color-white);
}

.variation-swatch.is-disabled,
.variation-swatch:disabled {
    border-color: var(--color-border);
    color: var(--color-text-soft);
    text-decoration: line-through;
    opacity: .6;
    cursor: not-allowed;
}

.product-single__cart .reset_variations {
    display: inline-block;
    margin-top: var(--gap-sm);
    color: var(--color-text-muted);
    font-size: var(--fs-small);
    text-decoration: underline;
}

.product-single__cart .woocommerce-variation-price .price { font-size: 24px; }

.product-single__cart .woocommerce-variation-availability .stock {
    margin-top: var(--gap-xs);
    color: var(--color-text-muted);
}

.product-single__cart .stock.out-of-stock,
.product-single__cart .woocommerce-variation-availability .out-of-stock {
    color: var(--color-sale);
}

/* Рядок кількість+кнопка: у варіативного товару flex — на .woocommerce-variation-add-to-cart, не на самій формі */
.product-single__cart form.cart:not(.variations_form),
.product-single__cart .woocommerce-variation-add-to-cart {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--gap-md);
}

.product-single__cart .woocommerce-variation-add-to-cart { margin-top: var(--gap-sm); }

.product-single__cart .quantity {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    height: 44px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    overflow: hidden;
}

.product-single__cart .qty {
    width: 48px;
    padding: 12px 0;
    border: 0;
    text-align: center;
    font-family: inherit;
    font-size: var(--fs-body);
    /* Ховаємо нативні стрілки — керуємо кількістю через qty-btn (JS). */
    appearance: textfield;
}

.product-single__cart .qty::-webkit-inner-spin-button,
.product-single__cart .qty::-webkit-outer-spin-button {
    appearance: none;
    margin: 0;
}

.product-single__cart .qty-btn {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 44px;
    border: 0;
    background: var(--color-bg-alt);
    color: var(--color-text);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    transition: background var(--transition), color var(--transition);
}

.product-single__cart .qty-btn:hover {
    background: var(--color-primary);
    color: var(--color-white);
}

/* !important (фон/колір/border-radius) — .woocommerce button.button.alt у woocommerce.css специфічніший */
.product-single__cart .single_add_to_cart_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    height: 44px;
    padding: 0 22px;
    border: 0;
    border-radius: var(--radius-pill) !important;
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    font-family: inherit;
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    text-align: center;
    cursor: pointer;
    transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
}

.product-single__cart .single_add_to_cart_button:hover {
    background: var(--color-accent) !important;
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.product-single__cart .single_add_to_cart_button:active { transform: translateY(0); }

/* Кеш-безпечний стан «в кошику» — js/pages/product.js:singleAddToCartSync() (Store API) */
.product-single__cart .single_add_to_cart_button.is-in-cart { background: var(--color-accent) !important; }

.product-single__cart .single_add_to_cart_button.disabled {
    background: var(--color-border) !important;
    color: var(--color-text-soft) !important;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* js/pages/product.js:ajaxAddToCart() — поки триває fetch. */
.product-single__cart .single_add_to_cart_button.is-loading {
    opacity: .6;
    pointer-events: none;
}

/* Помилку ajax-відповіді друкує сюди js/pages/product.js:ajaxAddToCart() */
.product-single__cart-error {
    width: 100%;
    margin-top: var(--gap-sm);
    color: var(--color-sale);
    font-size: var(--fs-small);
}

.product-single__cart p.stock {
    flex-basis: 100%;
    margin-top: var(--gap-xs);
    color: var(--color-text-muted);
}

.product-single__cart p.stock.out-of-stock { color: var(--color-sale); }

/* Наявність уже показує бейдж product-single__stock — рядок WC дублює */
.product-single__cart--simple p.stock { display: none; }

/* ── SKU / категорії / теги ─────────────────────────────────────────────── */
.product-single__meta {
    padding-top: var(--gap-lg);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-muted);
    font-size: var(--fs-small);
}

/* Кожен пункт product_meta окремим рядком */
.product-single__meta .product_meta {
    display: flex;
    flex-direction: column;
    gap: var(--gap-xs);
}

.product-single__meta a {
    color: var(--color-text-muted);
    text-decoration: underline;
    transition: color var(--transition);
}

.product-single__meta a:hover { color: var(--color-primary); }

/* ── Країна виробника ───────────────────────────────────────────────────── */
.product-single__country {
    display: flex;
    align-items: center;
    gap: var(--gap-xs);
    margin-top: var(--gap-sm);
    color: var(--color-text-muted);
    font-size: var(--fs-small);
}

.product-single__country img {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border-radius: var(--radius-circle);
    object-fit: cover;
}

/* ── Доставка / Оплата — акордеони ─────────────────────────────────────── */
/* Клас is-open вішає js/main.js:accordions() за data-accordion */
.product-single__info-blocks {
    margin-top: var(--gap-lg);
    border-top: 1px solid var(--color-border);
}

.product-single__accordion { border-bottom: 1px solid var(--color-border); }

.product-single__accordion-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gap-sm);
    width: 100%;
    padding: var(--gap-md) 0;
    border: 0;
    background: none;
    color: var(--color-text);
    font-family: inherit;
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    text-align: left;
    cursor: pointer;
}

/* Окрема обгортка іконка+назва — щоб space-between притискав шеврон праворуч */
.product-single__accordion-label {
    display: flex;
    align-items: center;
    gap: var(--gap-sm);
}

.product-single__accordion-title-icon {
    flex: 0 0 auto;
    color: var(--color-primary);
}

.product-single__accordion-icon {
    flex: 0 0 auto;
    color: var(--color-primary);
    transition: transform var(--transition);
}

.product-single__accordion.is-open .product-single__accordion-icon { transform: rotate(180deg); }

/* max-height, а не grid-rows 0fr→1fr як в info-sections.css — той перехід тут не програвався; 600px із запасом */
.product-single__accordion-body {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height .3s ease, opacity .25s ease;
}

.product-single__accordion.is-open .product-single__accordion-body {
    max-height: 600px;
    opacity: 1;
}

.product-single__accordion-inner {
    color: var(--color-text-muted);
    font-size: var(--fs-small);
    line-height: 1.6;
}

.product-single__accordion.is-open .product-single__accordion-inner { padding-bottom: var(--gap-md); }

.product-single__accordion-inner p { margin-bottom: var(--gap-sm); }
.product-single__accordion-inner p:last-child { margin-bottom: 0; }

/* Лого курʼєрів поза тілом акордеона — завжди видимі; кольори лого не перефарбовуємо */
.product-single__couriers {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-md);
    padding-bottom: var(--gap-md);
    color: var(--color-text);
    font-weight: var(--fw-bold);
}

.product-single__courier {
    display: inline-flex;
    align-items: center;
    gap: var(--gap-xs);
}

.product-single__courier svg { flex: 0 0 auto; width: 20px; height: 20px; }

/* ── Поділитись ─────────────────────────────────────────────────────────── */
.product-single__share {
    display: flex;
    align-items: center;
    gap: var(--gap-sm);
}

.product-single__share-label {
    margin-right: var(--gap-xs);
    color: var(--color-text-muted);
    font-size: var(--fs-small);
}

.product-single__share-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-circle);
    background: var(--color-bg-alt);
    color: var(--color-text);
    transition: background var(--transition), color var(--transition);
}

.product-single__share-btn:hover,
.product-single__share-btn.is-copied {
    background: var(--color-primary);
    color: var(--color-white);
}

/* Іконки — суцільні бейджі з fill=currentColor, тож досить color; на :hover перебивається білим правилом вище */
.product-single__share-btn--telegram { color: #3DA5F1; }
.product-single__share-btn--viber    { color: #8B628F; }
.product-single__share-btn--facebook { color: #0765FE; }
.product-single__share-btn--copy     { color: #FFC112; }

/* ── Таби (Опис/Додаткова інформація/Доставка/Оплата/Відгуки) ──────────── */
.product-tabs__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--gap-xs) var(--gap-xl);
    margin-bottom: var(--gap-xl);
}

.product-tabs__btn {
    padding: 0 0 var(--gap-sm);
    color: var(--color-accent);
    font-size: var(--fs-h4);
    font-weight: var(--fw-normal);
    cursor: pointer;
    transition: color var(--transition);
}

.product-tabs__btn:hover { color: var(--color-primary); }

.product-tabs__btn.is-active {
    color: var(--color-primary);
    font-weight: var(--fw-bold);
}

.product-tabs__panel {
    color: var(--color-text-muted);
}

.product-tabs__panel p { margin-bottom: var(--gap-md); }
.product-tabs__panel p:last-child { margin-bottom: 0; }

.product-tabs__panel ul,
.product-tabs__panel ol {
    margin: 0 0 var(--gap-md) 20px;
    padding-left: var(--gap-md);
}

.product-tabs__panel li { margin-bottom: var(--gap-xs); }

/* Заголовок панелі від WooCommerce дублює кнопку табу — ховаємо */
.product-tabs__panel[data-tab-panel="additional_information"] > h2:first-child { display: none; }

/* ── Додаткова інформація: таблиця атрибутів ─────────────────────────────── */
.woocommerce-product-attributes {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-product-attributes-item {
    border-bottom: 1px solid var(--color-border);
}

.woocommerce-product-attributes-item__label,
.woocommerce-product-attributes-item__value {
    padding: var(--gap-md) 0;
    text-align: left;
    vertical-align: top;
}

.woocommerce-product-attributes-item__label {
    width: 220px;
    color: var(--color-text);
    font-weight: var(--fw-bold);
}

.woocommerce-product-attributes-item__value p { margin: 0; }

/* ── Відгуки — штатна розмітка WooCommerce, тут лише стилізація ─────────── */
.woocommerce-Reviews-title {
    margin-bottom: var(--gap-lg);
    color: var(--color-text);
    font-size: var(--fs-h4);
    font-weight: var(--fw-bold);
}

.woocommerce-noreviews {
    margin-bottom: var(--gap-lg);
    color: var(--color-text-muted);
}

/* !important — ol.commentlist у woocommerce.css специфічніший (відступ і рамка li) */
.commentlist {
    padding-left: 0 !important;
    list-style: none;
}

.commentlist > li {
    padding-bottom: var(--gap-lg) !important;
    border-bottom: 1px solid var(--color-border) !important;
}

.commentlist > li + li { margin-top: var(--gap-lg); }

.comment_container {
    display: flex;
    align-items: flex-start;
    gap: var(--gap-md);
}

/* !important — woocommerce.css задає розмір img.avatar напряму */
.comment_container .avatar {
    flex: 0 0 auto;
    width: 48px !important;
    height: 48px !important;
    border-radius: var(--radius-circle) !important;
}

.comment-text { flex: 1 1 auto; min-width: 0; }

/* Той самий жовтий (--color-star), що й у решти зірок на сайті */
.comment-text .star-rating { margin-bottom: var(--gap-xs); color: var(--color-star); font-size: 14px; }

/* margin !important — .woocommerce p.meta у woocommerce.css специфічніший */
.comment-text .meta {
    margin: 0 0 var(--gap-sm) !important;
    color: var(--color-text-muted);
    font-size: var(--fs-small);
}

.woocommerce-review__author { color: var(--color-text); font-weight: var(--fw-bold); }
.woocommerce-review__dash { margin: 0 var(--gap-xs); }

.comment-text .description { color: var(--color-text); }
.comment-text .description p:last-child { margin-bottom: 0; }

/* ── Відгуки: форма ───────────────────────────────────────────────────── */
#review_form_wrapper {
    margin-top: var(--gap-xl);
    padding-top: var(--gap-xl);
    border-top: 1px solid var(--color-border);
}

.comment-reply-title {
    display: block;
    margin-bottom: var(--gap-lg);
    color: var(--color-text);
    font-size: var(--fs-h4);
    font-weight: var(--fw-bold);
}

.comment-reply-title small { display: block; margin-top: var(--gap-xs); font-size: var(--fs-small); font-weight: var(--fw-normal); }

.comment-notes { margin-bottom: var(--gap-md); color: var(--color-text-muted); font-size: var(--fs-small); }

.comment-form-rating,
.comment-form-comment,
.comment-form-author,
.comment-form-email { margin-bottom: var(--gap-md); }

/* Без цього зірки форми фарбувались би дефолтним кольором посилань теми */
.comment-form-rating .stars a,
.comment-form-rating .stars a:hover { color: var(--color-star); }

.comment-form-rating label,
.comment-form-comment label,
.comment-form-author label,
.comment-form-email label {
    display: block;
    margin-bottom: var(--gap-xs);
    color: var(--color-text);
    font-weight: var(--fw-bold);
}

#commentform textarea,
#commentform input[type="text"],
#commentform input[type="email"] {
    width: 100%;
    max-width: 460px;
    padding: 12px 18px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    background: var(--color-bg);
    color: var(--color-text);
    font-family: inherit;
    font-size: var(--fs-body);
}

#commentform textarea { max-width: 100%; resize: vertical; }

#commentform textarea:focus,
#commentform input[type="text"]:focus,
#commentform input[type="email"]:focus {
    border-color: var(--color-primary);
    outline: none;
}

.comment-form-cookies-consent {
    display: flex;
    align-items: flex-start;
    gap: var(--gap-xs);
    margin-bottom: var(--gap-md);
    color: var(--color-text-muted);
    font-size: var(--fs-small);
}

.comment-form-cookies-consent input { margin-top: 4px; }

/* !important — woocommerce.css стилізує input.submit напряму */
#commentform .form-submit input.submit {
    display: inline-flex;
    padding: 12px 28px !important;
    border: 0;
    border-radius: var(--radius-pill) !important;
    background: var(--color-primary) !important;
    color: var(--color-white) !important;
    font-family: inherit;
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    cursor: pointer;
    transition: background var(--transition), transform var(--transition);
}

#commentform .form-submit input.submit:hover { background: var(--color-accent) !important; transform: translateY(-1px); }

/* ── Галерея: мініатюри зліва (планшет і ширше) ────────────────────────── */
@media (min-width: 768px) {
    .woocommerce-product-gallery {
        display: flex;
        align-items: flex-start;
        gap: var(--gap-sm);
    }

    /* Базис 0, не auto — інакше FlexSlider замуровує зміряну ширину inline-стилем; лише в цьому @media (у колонці це був би height:0) */
    .flex-viewport {
        flex: 1 1 0;
        min-width: 0;
    }

    /* order: -1 виносить колонку мініатюр перед фото */
    .flex-control-thumbs {
        order: -1;
        flex-direction: column;
        flex-wrap: nowrap;
        flex: 0 0 auto;
        max-height: 460px;
        margin-top: 0;
        padding-right: 4px;
        padding-bottom: 0;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .flex-control-thumbs li { width: 64px; }
}

/* ── Tablet ─────────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    .product-single__layout { gap: var(--gap-xl); }

    .product-single__price { font-size: 26px; }
}

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .product-single { padding: 20px 0 40px; }

    .product-single__layout {
        flex-direction: column;
        margin-bottom: var(--gap-xl);
    }

    .product-single__gallery,
    .product-single__info { flex: 1 1 auto; width: 100%; }

    .flex-control-thumbs li { width: 60px; }

    .product-single__title { font-size: 22px; }

    .product-tabs__nav { gap: var(--gap-xs) var(--gap-lg); }

    /* Атрибути в стовпчик; display !important — table.shop_attributes tr у woocommerce.css специфічніший */
    .woocommerce-product-attributes-item {
        display: flex !important;
        flex-direction: column;
        gap: var(--gap-xs);
        padding: var(--gap-sm) 0;
    }

    .woocommerce-product-attributes-item__label,
    .woocommerce-product-attributes-item__value {
        width: auto;
        padding: 0;
        display: block;
    }
}

/* ── «Вам також може сподобатися» / «Останні переглянуті» ─────────────────
   «Останні переглянуті» (content/product-recently-viewed.php) навмисно перевикористовує класи .product-related__* — щоб не дублювати блок стилів */
.product-related,
.product-recently-viewed { padding: 20px 0 60px; }

.product-related__title {
    margin-bottom: var(--gap-lg);
    font-size: 30px;
    line-height: 1.2;
    text-align: center;
}

/* Поки Slick не ініціалізувався — показуємо перші картки в ряд, без стрибка */
.product-related__slider:not(.slick-initialized) {
    display: flex;
    gap: var(--gap-lg);
    overflow: hidden;
}

.product-related__slider:not(.slick-initialized) .product-related__item {
    flex: 0 0 calc((100% - var(--gap-lg) * 3) / 4);
}

.product-related__slider .slick-track {
    display: flex;
    align-items: stretch;
}

.product-related__slider .slick-slide {
    height: auto;
    margin: 0 10px;
}

.product-related__slider .slick-list { margin: 0 -10px; }

/* ── Стрілки ────────────────────────────────────────────────────────────── */
.product-related__slider .slick-arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    transform: translateY(-50%);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-circle);
    background: var(--color-bg);
    color: var(--color-primary);
    cursor: pointer;
    transition: background var(--transition), color var(--transition);
}

.product-related__slider .slick-arrow:hover {
    background: var(--color-primary);
    color: var(--color-white);
}

.product-related__slider .slick-prev { left: -22px; }
.product-related__slider .slick-next { right: -22px; }

.product-related__slider .slick-arrow svg { display: block; width: 20px; height: 20px; }
.product-related__slider .slick-prev svg { transform: rotate(180deg); }

.product-related__slider .slick-disabled { opacity: .4; cursor: default; }

/* ── Tablet ─────────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    .product-related,
    .product-recently-viewed { padding: 10px 0 40px; }

    .product-related__title { font-size: 24px; }

    .product-related__slider .slick-prev { left: -8px; }
    .product-related__slider .slick-next { right: -8px; }
}

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    .product-related,
    .product-recently-viewed { padding: 0 0 30px; }

    .product-related__title { font-size: 20px; }

    .product-related__slider .slick-arrow { width: 36px; height: 36px; }
}
