/* ── WooCommerce у стилістиці Scribara ──────────────────────────────────
   Підключається лише коли WooCommerce активний. Мета — щоб магазин ключів
   виглядав частиною лендінгу, а не окремим плагіном. */

.woo-page { padding: 56px 0 72px; }
.woo-page .woocommerce-products-header { text-align: center; margin-bottom: 34px; }
.woo-page .woocommerce-products-header__title {
  font-size: clamp(30px, 4.5vw, 44px); letter-spacing: -0.02em;
}
.woocommerce .page-title { text-align: center; }

/* Каталог товарів */
.woocommerce ul.products {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px; margin: 0; list-style: none;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none; }
.woocommerce ul.products li.product {
  width: auto !important; float: none !important; margin: 0 !important;
  background: var(--surface); border: 1px solid var(--border); border-radius: 16px;
  padding: 22px; text-align: left; display: flex; flex-direction: column;
}
.woocommerce ul.products li.product a img { border-radius: 12px; margin-bottom: 14px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 15.5px !important; font-weight: 600; padding: 0 !important; color: var(--text);
}
.woocommerce ul.products li.product .price {
  color: var(--brand-2) !important; font-weight: 700; font-size: 15px; margin: 8px 0 0;
}
.woocommerce ul.products li.product .price del { color: var(--muted); font-weight: 500; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }
.woocommerce ul.products li.product .button { margin-top: 14px; align-self: flex-start; }
.woocommerce span.onsale {
  background: var(--brand); color: #fff; border-radius: 999px;
  min-width: auto; min-height: auto; padding: 3px 12px; font-size: 11px; font-weight: 700;
  line-height: 1.6; top: 14px; left: 14px; margin: 0;
}

/* Сторінка товару */
.woocommerce div.product { display: grid; grid-template-columns: minmax(0, 1fr); gap: 26px; }
@media (min-width: 900px) {
  .woocommerce div.product .woocommerce-product-gallery { width: 44%; }
  .woocommerce div.product .summary { width: 52%; }
}
.woocommerce div.product .product_title { font-size: clamp(26px, 3.6vw, 38px); letter-spacing: -0.02em; }
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--brand-2); font-size: 24px; font-weight: 700; }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0 0 18px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--border); }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px 10px 0 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--text-2); font-weight: 600; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--text); }

/* Кнопки Woo → кнопки теми */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--brand); color: #fff; border-radius: 12px; font-weight: 600;
  padding: 12px 22px; font-size: 14.5px; line-height: 1.2; border: none;
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover { background: var(--brand-2); color: #fff; }
.woocommerce a.button.btn-sm { padding: 9px 16px; font-size: 13.5px; border-radius: 10px; }

/* Кошик, оформлення, акаунт */
.woocommerce table.shop_table {
  background: var(--surface); border: 1px solid var(--border); border-radius: 16px;
  border-collapse: separate; overflow: hidden;
}
.woocommerce table.shop_table th { background: var(--surface-2); color: var(--text); }
.woocommerce table.shop_table td,
.woocommerce table.shop_table th { border-color: var(--border) !important; color: var(--text-2); }
.woocommerce .cart_totals h2,
.woocommerce-checkout h3 { font-size: 19px; margin-bottom: 14px; }
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-checkout #payment {
  background: var(--surface) !important; border: 1px solid var(--border); border-radius: 16px;
}
.woocommerce-checkout #payment div.payment_box { background: var(--surface-2); color: var(--text-2); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--surface-2); }
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error {
  background: var(--surface); border-top: 3px solid var(--brand); border-radius: 12px;
  color: var(--text-2); list-style: none;
}
.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before { color: var(--brand); }
.woocommerce .woocommerce-error { border-top-color: #f87171; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li {
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
  margin-bottom: 6px; padding: 9px 14px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active { border-color: var(--brand); }

/* Ліцензійні ключі в замовленні (плагіни на кшталт License Manager for WooCommerce) */
.woocommerce table.licenses,
.woocommerce .lmfwc-myaccount-licenses,
.woocommerce .license-keys {
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 13.5px;
}

/* Хлібні крихти */
.woocommerce .woocommerce-breadcrumb { color: var(--muted); font-size: 13px; margin-bottom: 18px; }
.woocommerce .woocommerce-breadcrumb a { color: var(--text-2); }

/* Сортування / кількість результатів */
.woocommerce .woocommerce-result-count { color: var(--muted); font-size: 13px; }
.woocommerce .woocommerce-ordering select { max-width: 260px; }