/*
Theme Name: Рослинам треба
Theme URI: https://roslynam-treba.com
Description: Дочірня тема для Blocksy — магазин аксесуарів для рослин на WooCommerce. Pink + green + cream палітра, Unbounded + Manrope типографіка, WPML-ready, Нова Пошта.
Author: Рослинам треба
Version: 1.1.20
Template: blocksy
Text Domain: roslynam-treba
Domain Path: /languages
License: GPL-2.0-or-later
Requires at least: 6.4
Requires PHP: 7.4
Tags: e-commerce, woocommerce, ukrainian, child-theme, wpml
*/

/* ==========================================================================
   DESIGN TOKENS — derived from Рослинам треба logo
   ========================================================================== */
:root {
  /* Brand palette */
  --rt-pink:        oklch(0.78 0.12 350);
  --rt-pink-deep:   oklch(0.68 0.16 350);
  --rt-pink-soft:   oklch(0.92 0.05 350);
  --rt-green:       oklch(0.58 0.14 145);
  --rt-green-deep:  oklch(0.48 0.15 145);
  --rt-green-soft:  oklch(0.93 0.04 145);
  --rt-cream:       oklch(0.95 0.04 85);
  --rt-cream-deep:  oklch(0.92 0.055 85);
  --rt-ink:         oklch(0.25 0.03 150);
  --rt-ink-soft:    oklch(0.45 0.02 150);
  --rt-line:        oklch(0.88 0.02 85);
  --rt-error:       oklch(0.55 0.18 25);

  /* Type */
  --rt-font-display: 'Unbounded', system-ui, sans-serif;
  --rt-font-body:    'Manrope', system-ui, sans-serif;
  --rt-font-mono:    'JetBrains Mono', monospace;

  /* Radii */
  --rt-radius-sm: 8px;
  --rt-radius:    14px;
  --rt-radius-lg: 24px;
  --rt-radius-xl: 36px;

  /* Fluid spacing & container
     Breakpoints (desktop-first):
       ≥1440  large desktop
       1024–1439 laptop/desktop (base)
       768–1023  tablet
       480–767   large phone
       <480      small phone                                               */
  --rt-container-max: 1400px;
  --rt-container-pad: clamp(1rem, 3.5vw, 1.5rem);
  --rt-section-gap:   clamp(2.5rem, 6vw, 4rem);
  --rt-card-pad:      clamp(1.5rem, 3vw, 2.5rem);
  --rt-tap:           44px; /* minimum touch target */

  /* Override Blocksy parent vars */
  --theme-palette-color-1: var(--rt-green);
  --theme-palette-color-2: var(--rt-green-deep);
  --theme-palette-color-3: var(--rt-ink);
  --theme-palette-color-4: var(--rt-ink-soft);
  --theme-palette-color-5: var(--rt-cream-deep);
  --theme-palette-color-6: var(--rt-cream);
  --theme-palette-color-7: #ffffff;
  --theme-palette-color-8: var(--rt-pink);

  /* Kill Blocksy's default cool-blue link/text tones */
  --theme-link-initial-color: var(--rt-green-deep);
  --theme-link-hover-color:   var(--rt-green);
  --theme-text-color:         var(--rt-ink);
  --theme-text-hover-color:   var(--rt-green-deep);
  --theme-headings-color:     var(--rt-ink);
  --theme-font-color:         var(--rt-ink);
  --theme-button-background-initial-color: var(--rt-green);
  --theme-button-background-hover-color:   var(--rt-green-deep);
  --theme-form-field-border-initial-color: var(--rt-line);
  --theme-form-field-border-active-color:  var(--rt-green);
}

/* Override any remaining Blocksy hardcoded blues / slate-blues */
.ct-dynamic-count-cart,
.ct-dynamic-count,
.ct-header-account .ct-dynamic-count {
  background: var(--rt-pink-deep) !important;
  color: #fff !important;
}
header.ct-header [data-id="menu"] > ul > li > a,
header.ct-header nav[class*="menu"] .ct-menu-link,
.ct-header [class*="ct-menu-link"],
.ct-header .ct-label,
.ct-header a {
  color: var(--rt-ink) !important;
  --theme-link-initial-color: var(--rt-ink);
}
header.ct-header [data-id="menu"] > ul > li > a:hover,
.ct-header a:hover { color: var(--rt-green-deep) !important; }
/* Current-page menu item stays visibly active */
.ct-header .current-menu-item > a,
.ct-header .current_page_item > a { color: var(--rt-green-deep) !important; }
.skip-link { background: var(--rt-green-deep) !important; color: #fff !important; }

/* ==========================================================================
   BASE
   ========================================================================== */
/* Overriding Blocksy's default palette-driven body background */
html body,
body.wp-theme-blocksy,
body.theme-blocksy {
  font-family: var(--rt-font-body);
  color: var(--rt-ink);
  background: var(--rt-cream) !important;
  background-color: var(--rt-cream) !important;
  -webkit-font-smoothing: antialiased;
}
/* Ensure content wrappers inherit the cream instead of painting white */
#main, .ct-main-container, .ct-container, [data-content] {
  background: transparent;
}

h1, h2, h3, h4, h5, h6,
.site-title, .page-title,
.product_title, .woocommerce-loop-product__title {
  font-family: var(--rt-font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* ==========================================================================
   ANNOUNCEMENT TOPBAR
   ========================================================================== */
.rt-topbar {
  background: var(--rt-green-deep);
  color: var(--rt-cream);
  font-size: 0.8rem;
  padding: 0.5rem 0;
}
.rt-topbar__inner {
  max-width: var(--rt-container-max);
  margin: 0 auto;
  padding: 0 var(--rt-container-pad);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}
.rt-topbar__item {
  font-family: var(--rt-font-body);
  font-weight: 500;
}

/* ==========================================================================
   HEADER
   ========================================================================== */
.ct-header {
  background: var(--rt-cream);
  border-bottom: 1px solid var(--rt-line);
}

.ct-header [data-id="text"] .ct-span {
  font-family: var(--rt-font-display);
  font-weight: 700;
}

.ct-header-cart .ct-cart-count {
  background: var(--rt-pink-deep);
  color: var(--rt-cream);
  font-family: var(--rt-font-mono);
  font-weight: 700;
}

/* Swap Blocksy's shopping-bag SVG for a classic cart glyph via CSS mask */
.ct-header-cart .ct-icon-container > svg { display: none; }
.ct-header-cart .ct-icon-container::before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2221%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2220%22%20cy%3D%2221%22%20r%3D%221%22%2F%3E%3Cpath%20d%3D%22M1%201h4l2.68%2013.39a2%202%200%200%200%202%201.61h9.72a2%202%200%200%200%202-1.61L23%206H6%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2221%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2220%22%20cy%3D%2221%22%20r%3D%221%22%2F%3E%3Cpath%20d%3D%22M1%201h4l2.68%2013.39a2%202%200%200%200%202%201.61h9.72a2%202%200%200%200%202-1.61L23%206H6%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}

/* Mini-cart dropdown (Blocksy) — anchor to right edge so it doesn't overflow viewport */
.ct-header-cart { position: relative; }
.ct-header-cart .ct-cart-content {
  left: auto !important;
  right: 0 !important;
  width: 340px;
  max-width: calc(100vw - 2rem);
  padding: 1rem;
  background: var(--rt-cream) !important;
  color: var(--rt-ink) !important;
  border: 1px solid var(--rt-line);
  border-radius: var(--rt-radius-lg);
  box-shadow: 0 16px 40px oklch(0.25 0.03 150 / 0.15);
}
.ct-header-cart .ct-cart-content,
.ct-header-cart .ct-cart-content * { color: var(--rt-ink); }
.ct-header-cart .ct-cart-content .woocommerce-mini-cart-item {
  border-bottom: 1px dashed var(--rt-line);
  padding-bottom: 0.6rem;
  margin-bottom: 0.6rem;
}
.ct-header-cart .ct-cart-content .woocommerce-mini-cart__total {
  color: var(--rt-ink);
  font-weight: 700;
  border-top: 1px solid var(--rt-line);
  padding-top: 0.75rem;
  margin-top: 0.5rem;
}
.ct-header-cart .ct-cart-content .woocommerce-mini-cart-item a:not(.remove) {
  color: var(--rt-ink);
  font-weight: 600;
}
.ct-header-cart .ct-cart-content .woocommerce-mini-cart-item a:not(.remove):hover {
  color: var(--rt-green-deep);
}
.ct-header-cart .ct-cart-content .quantity,
.ct-header-cart .ct-cart-content .woocommerce-Price-amount { color: var(--rt-ink-soft); }
/* Stack the two action buttons vertically, full width, single line */
.ct-header-cart .ct-cart-content .woocommerce-mini-cart__buttons {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.ct-header-cart .ct-cart-content .woocommerce-mini-cart__buttons .button {
  width: 100% !important;
  margin: 0 !important;
  white-space: nowrap;
  font-size: 0.8rem !important;
  padding: 0.7rem 1rem !important;
  text-align: center;
}

/* Announcement bar (Blocksy top row) */
.ct-topbar {
  background: var(--rt-green-deep);
  color: var(--rt-cream);
  font-size: 0.8rem;
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.button,
button[type="submit"],
.wp-block-button__link,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .button.alt,
.wc-block-components-button,
.wc-block-cart__submit-button,
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button {
  font-family: var(--rt-font-display) !important;
  font-weight: 600 !important;
  background: var(--rt-green) !important;
  background-color: var(--rt-green) !important;
  color: var(--rt-cream) !important;
  border-radius: 999px !important;
  padding: 0.875rem 1.5rem !important;
  border: none !important;
  transition: transform 0.15s ease, background 0.15s ease;
}
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button.alt:hover,
.wc-block-components-button:hover,
.wc-block-cart__submit-button:hover {
  background: var(--rt-green-deep) !important;
  background-color: var(--rt-green-deep) !important;
  transform: translateY(-1px);
}
/* WC Cart/Checkout block button wrapper text color */
.wc-block-components-button__text { color: inherit !important; }

/* Visible keyboard focus indicator (WCAG 2.4.7) */
.button:focus-visible,
button:focus-visible,
a:focus-visible,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.wc-block-components-button:focus-visible,
.rt-card__fav:focus-visible,
.ct-header-cart a:focus-visible,
.woocommerce-mini-cart__buttons .button:focus-visible {
  outline: 2px solid var(--rt-green-deep) !important;
  outline-offset: 2px !important;
}

.button.rt-accent,
.woocommerce .single_add_to_cart_button {
  background: var(--rt-pink) !important;
  color: var(--rt-ink) !important;
}
.woocommerce .single_add_to_cart_button:hover {
  background: var(--rt-pink-deep) !important;
  color: var(--rt-cream) !important;
}

/* Ghost */
.button.rt-ghost,
.woocommerce .button.rt-ghost {
  background: transparent !important;
  color: var(--rt-ink) !important;
  border: 1.5px solid var(--rt-line) !important;
}

/* ==========================================================================
   SHOP ARCHIVE LAYOUT
   ========================================================================== */
.rt-shop.container {
  max-width: var(--rt-container-max);
  margin: 2rem auto;
  padding: 0 var(--rt-container-pad);
}
.rt-shop .woocommerce-breadcrumb {
  font-size: 0.85rem;
  color: var(--rt-ink-soft);
  margin-bottom: 1rem;
}
.rt-shop .woocommerce-breadcrumb a { color: var(--rt-ink-soft); text-decoration: none; }
.rt-shop__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 2rem;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.rt-shop__header h1.page-title {
  font-family: var(--rt-font-display);
  font-size: clamp(2rem, 3.5vw, 2.5rem);
  margin: 0;
  line-height: 1.1;
}
.rt-shop__layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 2.5rem;
  align-items: start;
}
.rt-shop__sidebar .widget {
  background: #fff;
  border-radius: 24px;
  border: 1px solid var(--rt-line);
  padding: 1.5rem;
  margin-bottom: 1rem;
}
.rt-shop__sidebar .widgettitle {
  font-family: var(--rt-font-display);
  font-size: 0.95rem;
  margin: 0 0 0.75rem;
  text-transform: none;
  color: var(--rt-ink);
}
.rt-shop__sidebar ul { list-style: none; padding: 0; margin: 0; }
.rt-shop__sidebar ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.45rem 0.75rem;
  border-radius: 14px;
  font-size: 0.9rem;
}
.rt-shop__sidebar ul li a { color: var(--rt-ink); text-decoration: none; flex: 1; }
.rt-shop__sidebar ul li.current-cat,
.rt-shop__sidebar ul li:hover {
  background: var(--rt-green-soft);
  color: var(--rt-green-deep);
  font-weight: 600;
}
.rt-shop__sidebar ul li.current-cat a,
.rt-shop__sidebar ul li:hover a { color: var(--rt-green-deep); }
.rt-shop__sidebar .count {
  font-family: var(--rt-font-mono);
  font-size: 0.75rem;
  color: var(--rt-ink-soft);
}
.rt-shop__count { color: var(--rt-ink-soft); font-size: 0.9rem; margin-top: 0.25rem; }
.rt-shop__main .woocommerce-result-count { color: var(--rt-ink-soft); font-size: 0.85rem; }
.rt-shop__main .woocommerce-ordering select {
  padding: 0.55rem 0.9rem;
  border-radius: 999px;
  border: 1.5px solid var(--rt-line);
  background: #fff;
  font-size: 0.9rem;
  font-family: var(--rt-font-body);
}
.rt-shop__main ul.products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  margin: 1rem 0 0 !important;
  padding: 0 !important;
}
.rt-shop__main ul.products li.product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
}

/* ==========================================================================
   PRODUCT CARD — rt-card (content-product.php custom template)
   ========================================================================== */
.rt-card__media {
  position: relative;
}
.rt-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.rt-card__fav {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  background: #fff;
  border: 1px solid var(--rt-line);
  border-radius: 50%;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--rt-ink-soft);
  transition: color 0.15s ease, border-color 0.15s ease;
  padding: 0;
}
.rt-card__fav.is-fav,
.rt-card__fav:hover {
  color: var(--rt-pink-deep);
  border-color: var(--rt-pink-deep);
}
.rt-card__body {
  padding: 1rem 1.1rem 1.1rem;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 0.35rem;
  min-width: 0;
}
.rt-card__link {
  text-decoration: none;
  color: inherit;
}
.rt-card__link .woocommerce-loop-product__title {
  padding: 0 !important;
  font-size: 0.98rem !important;
  font-weight: 600 !important;
  font-family: var(--rt-font-body) !important;
}
.rt-card__sub {
  font-size: 0.8rem;
  color: var(--rt-ink-soft);
  margin-top: 0.2rem;
}
.rt-card__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: 0.75rem;
}
.rt-card__row .price {
  font-family: var(--rt-font-display) !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  padding: 0 !important;
}
.rt-card__row .star-rating { font-size: 0.8rem; }

/* ==========================================================================
   PRODUCT CARD (Shop archive)
   ========================================================================== */
.woocommerce ul.products li.product,
.products li.product {
  background: #fff;
  border: 1px solid var(--rt-line);
  border-radius: var(--rt-radius-lg);
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}
/* Image link sits at top; leave natural height */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
  flex: 0 0 auto;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 40px oklch(0.25 0.03 150 / 0.12);
}

.woocommerce ul.products li.product .woocommerce-loop-product__link {
  display: block;
  padding: 0;
}

.woocommerce ul.products li.product img {
  margin: 0 !important;
  border-radius: 0 !important;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* Title / price sit inside .rt-card__body which already has padding.
   Strip WC's own padding, let flex layout handle spacing. */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding: 0 !important;
  margin: 0 !important;
  font-size: 0.98rem !important;
  font-family: var(--rt-font-body) !important;
  font-weight: 600 !important;
}

.woocommerce ul.products li.product .price {
  padding: 0 !important;
  margin: 0 !important;
  font-family: var(--rt-font-display) !important;
  font-weight: 700 !important;
  color: var(--rt-ink) !important;
}
.woocommerce ul.products li.product .price del {
  color: var(--rt-ink-soft) !important;
  font-weight: 500 !important;
  margin-right: 0.4rem;
  opacity: 0.7;
}

/* Sale badge */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
  background: var(--rt-green) !important;
  color: var(--rt-cream) !important;
  border-radius: 999px !important;
  font-family: var(--rt-font-display) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  padding: 0.25rem 0.65rem !important;
  min-height: auto !important;
  line-height: 1.2 !important;
  top: 0.75rem !important;
  left: 0.75rem !important;
  right: auto !important;
}

/* Add to cart button on loop — margin-top:auto pushes it to bottom of flex body */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .rt-card__body .button {
  margin: auto 0 0 !important;
  width: 100% !important;
  padding: 0.7rem 1rem !important;
  font-size: 0.85rem !important;
  box-sizing: border-box;
}
/* Price+rating row sits just above the pushed-down button */
.rt-card__row { margin-top: 0.25rem; }
/* Short description / excerpt between price and button on some themes */
.woocommerce ul.products li.product .woocommerce-product-details__short-description {
  padding: 0 1.1rem;
  font-size: 0.85rem;
  color: var(--rt-ink-soft);
}

/* ==========================================================================
   SHOP ARCHIVE — filters sidebar
   ========================================================================== */
.woocommerce-ordering select {
  padding: 0.55rem 0.9rem;
  border-radius: 999px;
  border: 1.5px solid var(--rt-line);
  background: #fff;
  font-weight: 500;
  font-size: 0.9rem;
}

.widget-area .widget,
.sidebar .widget {
  background: #fff;
  border-radius: var(--rt-radius-lg);
  padding: 1.5rem;
  margin-bottom: 1.25rem;
  border: 1px solid var(--rt-line);
}
.widget-title {
  font-family: var(--rt-font-display);
  font-weight: 600;
  font-size: 0.95rem;
  margin-bottom: 0.75rem;
}

/* Price filter */
.price_slider_wrapper { padding: 0.5rem 0 0.25rem; }
.price_slider_wrapper .ui-slider {
  background: var(--rt-cream-deep);
  border-radius: 999px;
  height: 6px;
  border: none;
  position: relative;
  margin: 0.75rem 9px 1rem;
}
.price_slider_wrapper .ui-slider .ui-slider-range {
  background: var(--rt-green);
  position: absolute;
  top: 0; bottom: 0;
}
.price_slider_wrapper .ui-slider .ui-slider-handle {
  display: block;
  position: absolute;
  background: var(--rt-green);
  border: 2px solid #fff;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  margin-left: -9px;
  top: 50%;
  transform: translateY(-50%);
  box-shadow: 0 2px 6px oklch(0.25 0.03 150 / 0.18);
  cursor: grab;
  z-index: 2;
}
.price_slider_wrapper .ui-slider .ui-slider-handle:active { cursor: grabbing; }

/* Price filter amount: label on top, button full-width below */
.widget_price_filter .price_slider_amount {
  display: flex;
  flex-direction: column-reverse;
  align-items: stretch;
  gap: 0.75rem;
  margin-top: 0.5rem;
}
.widget_price_filter .price_slider_amount .button {
  float: none !important;
  width: 100% !important;
  padding: 0.7rem 1rem !important;
  font-size: 0.85rem !important;
}
.widget_price_filter .price_slider_amount .price_label {
  float: none !important;
  text-align: left;
  font-size: 0.9rem;
  color: var(--rt-ink-soft);
  padding: 0 !important;
  line-height: 1.4;
}
.widget_price_filter .price_slider_amount .price_label .from,
.widget_price_filter .price_slider_amount .price_label .to {
  font-family: var(--rt-font-mono);
  color: var(--rt-ink);
  font-weight: 600;
}
.widget_price_filter .price_slider_amount .clear { display: none; }

/* ==========================================================================
   SINGLE PRODUCT
   ========================================================================== */
.single-product div.product .product_title {
  font-size: 2.5rem;
  line-height: 1.1;
}

.single-product div.product .price {
  font-family: var(--rt-font-display);
  font-size: 2rem;
  font-weight: 700;
  color: var(--rt-ink);
}

.single-product div.product .woocommerce-product-gallery__image img {
  border-radius: var(--rt-radius-xl);
}

.single-product div.product form.cart {
  background: var(--rt-cream-deep);
  padding: 1.25rem;
  border-radius: var(--rt-radius-lg);
  margin-top: 1.5rem;
}


.woocommerce-tabs ul.tabs {
  border-bottom: 1px solid var(--rt-line);
  padding: 0 !important;
}
.woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  margin: 0 0.5rem 0 0 !important;
}
.woocommerce-tabs ul.tabs li.active {
  border-bottom-color: var(--rt-green) !important;
}
/* Blocksy paints an ::before indicator on the active WC tab in palette blue — repaint green */
.woocommerce-tabs ul.tabs li::before,
.woocommerce-tabs ul.tabs li.active::before {
  background: var(--rt-green) !important;
}

/* "View cart" link injected by WC after AJAX add-to-cart — match theme pill */
a.added_to_cart,
a.added_to_cart.wc-forward {
  display: inline-block;
  background: var(--rt-green) !important;
  color: #fff !important;
  padding: 0.6rem 1.25rem !important;
  border-radius: 999px !important;
  font-weight: 600;
  text-decoration: none !important;
  margin-top: 0.5rem;
}
a.added_to_cart:hover { background: var(--rt-green-deep) !important; }
.woocommerce-tabs ul.tabs li a {
  font-weight: 500 !important;
  color: var(--rt-ink-soft) !important;
  padding: 0.85rem 1.25rem !important;
}
.woocommerce-tabs ul.tabs li.active a {
  color: var(--rt-ink) !important;
}

/* ==========================================================================
   CART
   ========================================================================== */
.woocommerce table.shop_table {
  border: 1px solid var(--rt-line);
  border-radius: var(--rt-radius-lg);
  overflow: hidden;
  background: #fff;
}
.woocommerce table.shop_table th {
  font-family: var(--rt-font-display);
  font-weight: 600;
  background: var(--rt-cream-deep);
}

.cart_totals {
  background: #fff;
  border-radius: var(--rt-radius-lg);
  padding: 1.5rem;
  border: 1px solid var(--rt-line);
}

/* ==========================================================================
   CHECKOUT
   ========================================================================== */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  padding: 0.875rem 1rem;
  border: 1.5px solid var(--rt-line);
  border-radius: var(--rt-radius);
  background: #fff;
  font-size: 0.95rem;
  font-family: var(--rt-font-body);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
  border-color: var(--rt-green);
  outline: 2px solid var(--rt-green);
  outline-offset: 2px;
}
.woocommerce form .form-row label {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--rt-ink);
  margin-bottom: 0.35rem;
}
.woocommerce form .form-row.woocommerce-invalid input {
  border-color: var(--rt-error);
}

#payment {
  background: #fff;
  border-radius: var(--rt-radius-lg);
  padding: 1.5rem;
  border: 1px solid var(--rt-line);
}

/* ==========================================================================
   MY ACCOUNT
   ========================================================================== */
.woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  background: #fff;
  border-radius: var(--rt-radius-lg);
  border: 1px solid var(--rt-line);
  overflow: hidden;
}
.woocommerce-MyAccount-navigation ul li {
  border-bottom: 1px solid var(--rt-line);
}
.woocommerce-MyAccount-navigation ul li:last-child {
  border-bottom: none;
}
.woocommerce-MyAccount-navigation ul li a {
  display: block;
  padding: 1rem 1.25rem;
  font-weight: 500;
  color: var(--rt-ink);
}
.woocommerce-MyAccount-navigation ul li.is-active a {
  background: var(--rt-green-soft);
  color: var(--rt-green-deep);
  font-weight: 600;
}

/* ==========================================================================
   HOMEPAGE HERO (front-page)
   ========================================================================== */

/* Outer wrapper — same max-width/padding as other sections */
.rt-hero-wrap {
  max-width: var(--rt-container-max);
  margin: 0 auto;
  padding: 0 var(--rt-container-pad);
}

.rt-hero {
  background: var(--rt-cream-deep);
  border-radius: var(--rt-radius-xl);
  padding: clamp(1.75rem, 5vw, 3.5rem) clamp(1.5rem, 5vw, 4rem);
  margin: clamp(1rem, 3vw, 2.5rem) auto;
  max-width: var(--rt-container-max);
  display: grid;
  grid-template-columns: 1fr 0.85fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
  min-height: clamp(360px, 45vw, 460px);
}
.rt-hero h1 {
  font-size: clamp(1.9rem, 4vw + 0.5rem, 3.5rem);
  line-height: 1.1;
}
.rt-hero h1 em {
  color: var(--rt-green-deep);
  font-style: italic;
}
.rt-hero__img {
  height: 100%;
  min-height: clamp(280px, 40vw, 440px);
  max-height: 440px;
  background: repeating-linear-gradient(45deg, var(--rt-green-soft), var(--rt-green-soft) 8px, var(--rt-cream-deep) 8px, var(--rt-cream-deep) 16px);
  border-radius: var(--rt-radius-xl);
  align-self: stretch;
}

/* Section wrapper */
.rt-section { margin: var(--rt-section-gap) 0; }
.rt-section.container,
.rt-split.container { max-width: var(--rt-container-max); margin-left: auto; margin-right: auto; padding: 0 var(--rt-container-pad); }
.rt-section__head {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1.75rem;
}
.rt-section__head h2 {
  font-family: var(--rt-font-display);
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  margin: 0;
  line-height: 1.1;
}
.rt-eyebrow {
  font-family: var(--rt-font-mono);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--rt-green-deep);
  font-weight: 600;
}

/* Category grid — auto-fit keeps cards a reasonable size and fills only the columns actually needed */
.rt-cat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0.85rem;
  margin: 2rem 0;
}
.rt-cat-grid a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 1.5rem 1rem;
  text-align: center;
  background: #fff;
  border-radius: var(--rt-radius-lg);
  border: 1px solid var(--rt-line);
  text-decoration: none;
  color: var(--rt-ink);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rt-cat-grid a:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -16px rgba(0,0,0,0.2); }
.rt-cat-grid a:nth-child(even) { background: var(--rt-pink-soft); }
.rt-cat-grid__icon {
  font-size: 1.75rem;
  line-height: 1;
  color: var(--rt-green-deep);
}
.rt-cat-grid__label {
  font-family: var(--rt-font-display);
  font-size: 0.95rem;
  font-weight: 600;
}

/* Split promo (two-column) */
.rt-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1rem, 2.5vw, 1.5rem);
  margin: var(--rt-section-gap) auto;
}
.rt-split__card {
  border-radius: var(--rt-radius-xl);
  padding: var(--rt-card-pad);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: flex-start;
}
.rt-split__card h2 {
  font-family: var(--rt-font-display);
  font-size: clamp(1.5rem, 2.5vw, 2.1rem);
  margin: 0;
  line-height: 1.1;
}
.rt-split__card p { margin: 0.25rem 0 1rem; font-size: 1rem; opacity: 0.85; }
.rt-split__card .rt-eyebrow { color: inherit; opacity: 0.8; }
.rt-split__card--green {
  background: var(--rt-green-soft);
  color: var(--rt-ink);
}
.rt-split__card--pink {
  background: var(--rt-pink-soft);
  color: var(--rt-ink);
}
.rt-split__card .button {
  margin-top: auto;
  align-self: flex-start;
}

/* ==========================================================================
   PRODUCT DETAIL PAGE (PDP)
   ========================================================================== */
.rt-pdp.container {
  max-width: var(--rt-container-max);
  margin: 2rem auto 4rem;
  padding: 0 var(--rt-container-pad);
}
.rt-pdp .woocommerce-breadcrumb {
  font-size: 0.85rem;
  color: var(--rt-ink-soft);
  margin-bottom: 1.5rem;
}
.rt-pdp .woocommerce-breadcrumb a { color: var(--rt-ink-soft); text-decoration: none; }
/* Outer grid wrapper — keep for structure */
.rt-product__grid {
  margin-bottom: 3rem;
}
/* Blocksy puts both .product-entry-wrapper (gallery) and .summary inside .rt-product__gallery,
   so we make THIS div the actual 2-column grid */
.rt-product__gallery {
  display: grid !important;
  grid-template-columns: 1.1fr 1fr !important;
  gap: clamp(1.5rem, 3vw, 3rem) !important;
  align-items: start !important;
}
.rt-product__gallery .product-entry-wrapper {
  min-width: 0;
}
.rt-product__gallery .woocommerce-product-gallery {
  width: 100% !important;
  opacity: 1 !important;
}
.rt-product__gallery .woocommerce-product-gallery__image img,
.rt-product__gallery .woocommerce-product-gallery__wrapper img {
  border-radius: var(--rt-radius-xl) !important;
  background: var(--rt-cream-deep);
  width: 100% !important;
  height: auto;
  display: block;
}
/* Summary column — Blocksy renders it as sibling of product-entry-wrapper inside our gallery div */
.rt-product__summary,
.rt-product__gallery .summary {
  padding: 1rem 0;
  min-width: 0;
}
.rt-product__summary .product_title {
  font-family: var(--rt-font-display);
  font-size: clamp(2rem, 3vw, 2.75rem);
  margin: 0 0 1rem;
  line-height: 1.1;
}
.rt-product__summary .price {
  font-family: var(--rt-font-display);
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  color: var(--rt-ink) !important;
  margin: 0 0 1.5rem;
}
.rt-product__summary .price del { opacity: 0.5; font-size: 1.1rem; margin-right: 0.5rem; }
.rt-product__summary .price ins { text-decoration: none; color: var(--rt-green-deep) !important; }
.rt-product .summary form.cart {
  background: var(--rt-cream-deep);
  border-radius: var(--rt-radius-lg);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}
/* Quantity stepper — rebuilt as a proper flex row [−][input][+] */
.rt-product__summary .quantity,
.single-product div.product .quantity {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  border: 1.5px solid var(--rt-line);
  border-radius: 999px;
  background: #fff;
  overflow: hidden;
  height: 48px;
}
.rt-product__summary .quantity .qty,
.single-product div.product .quantity input.qty {
  width: 60px;
  padding: 0 0.25rem;
  border: 0;
  border-radius: 0;
  text-align: center;
  background: transparent;
  font-family: var(--rt-font-mono);
  font-size: 1rem;
  color: var(--rt-ink);
  appearance: textfield;
  -moz-appearance: textfield;
  order: 2;
}
.rt-product__summary .quantity input.qty::-webkit-outer-spin-button,
.rt-product__summary .quantity input.qty::-webkit-inner-spin-button,
.single-product div.product .quantity input.qty::-webkit-outer-spin-button,
.single-product div.product .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.rt-product__summary .quantity .ct-decrease,
.rt-product__summary .quantity .ct-increase,
.single-product div.product .quantity .ct-decrease,
.single-product div.product .quantity .ct-increase {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: auto;
  color: var(--rt-green-deep);
  background: transparent;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s ease, color 0.15s ease;
}
.rt-product__summary .quantity .ct-decrease,
.single-product div.product .quantity .ct-decrease { order: 1; }
.rt-product__summary .quantity .ct-increase,
.single-product div.product .quantity .ct-increase { order: 3; }
.rt-product__summary .quantity .ct-decrease:hover,
.rt-product__summary .quantity .ct-increase:hover,
.single-product div.product .quantity .ct-decrease:hover,
.single-product div.product .quantity .ct-increase:hover {
  background: var(--rt-green-soft);
  color: var(--rt-green-deep);
}
.rt-product__summary .quantity .ct-decrease::before,
.single-product div.product .quantity .ct-decrease::before {
  content: "−";
  font-size: 1.4rem;
  line-height: 1;
}
.rt-product__summary .quantity .ct-increase::before,
.single-product div.product .quantity .ct-increase::before {
  content: "+";
  font-size: 1.4rem;
  line-height: 1;
}
.rt-product__summary .product_meta {
  font-size: 0.85rem;
  color: var(--rt-ink-soft);
  margin-top: 1rem;
}
.rt-product__summary .product_meta a { color: var(--rt-green-deep); }

/* Trust badges under add-to-cart */
.rt-trust {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin: 0.75rem 0 0;
  font-size: 0.9rem;
  color: var(--rt-ink);
  width: 100%;
}
.rt-trust__item {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.rt-trust__item span { color: var(--rt-green-deep); font-size: 1.1rem; }

/* UA-only store: WooCommerce still renders the country row even with a single
   allowed country («Україна») — hide it; the value stays in the form data. */
.woocommerce-checkout #billing_country_field,
.woocommerce-checkout #shipping_country_field { display: none !important; }

/* Tabs */
.rt-pdp .woocommerce-tabs {
  background: #fff;
  border: 1px solid var(--rt-line);
  border-radius: var(--rt-radius-lg);
  padding: 1rem 1.5rem 2rem;
  margin-bottom: 3rem;
}
.rt-pdp .woocommerce-tabs .tabs {
  display: flex;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  border-bottom: 1px solid var(--rt-line);
}
.rt-pdp .woocommerce-tabs .tabs li {
  padding: 0.75rem 1rem;
  font-family: var(--rt-font-display);
  font-size: 0.85rem !important;
  font-weight: 600;
  text-transform: uppercase;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.rt-pdp .woocommerce-tabs .tabs li.active {
  border-bottom-color: var(--rt-green-deep);
  color: var(--rt-green-deep);
}
.rt-pdp .woocommerce-tabs .tabs li a { color: inherit; text-decoration: none; }

/* Related products */
.rt-pdp .related.products,
.rt-pdp .upsells.products {
  margin-top: 3rem;
}
.rt-pdp .related.products > h2,
.rt-pdp .upsells.products > h2 {
  font-family: var(--rt-font-display);
  font-size: 1.75rem;
  margin-bottom: 1.5rem;
}
.rt-pdp .related.products ul.products,
.rt-pdp .upsells.products ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  padding: 0;
  margin: 0;
}
.rt-pdp .related.products ul.products li.product,
.rt-pdp .upsells.products ul.products li.product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
}

/* Footer */
.ct-footer {
  background: var(--rt-ink);
  color: var(--rt-cream);
}

/* ==========================================================================
   RESPONSIVE — single consolidated block (desktop-first)
   Breakpoints:
     ≥1440   large desktop (enhancements)
     1024–1439  laptop/desktop (base styles target this)
     768–1023   tablet
     480–767    large phone
     <480       small phone
   ========================================================================== */

/* Large desktop — tighten max width cap is already 1400, add generous breathing room */
@media (min-width: 1440px) {
  :root { --rt-container-pad: 2rem; }
  .rt-hero { gap: 4rem; }
  .rt-cat-grid { gap: 1.25rem; }
}

/* Tablet (768–1023) */
@media (max-width: 1023px) {
  .rt-shop__layout {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .rt-shop__main ul.products { grid-template-columns: repeat(2, 1fr); }
  .rt-hero { grid-template-columns: 1fr 0.75fr; gap: 2rem; }
  .rt-product__gallery {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
  .rt-pdp .related.products ul.products,
  .rt-pdp .upsells.products ul.products {
    grid-template-columns: repeat(3, 1fr);
  }
  .rt-shop__header {
    align-items: flex-start;
  }
}

/* Large phone & small tablet portrait (up to 767) */
@media (max-width: 767px) {
  .rt-topbar__inner { justify-content: center; }
  .rt-topbar__item:last-child { display: none; }

  /* Hero collapses to single column, image hidden */
  .rt-hero {
    grid-template-columns: 1fr;
    padding: clamp(1.5rem, 5vw, 2rem) clamp(1.25rem, 4vw, 1.75rem);
    margin: 1rem auto;
    min-height: auto;
    gap: 1rem;
  }
  .rt-hero__img { display: none; }
  .rt-hero h1 { font-size: clamp(1.75rem, 7vw, 2.25rem); }

  .rt-cat-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.75rem; }
  .rt-cat-grid a { padding: 1.15rem 0.75rem; }

  .rt-split { grid-template-columns: 1fr; }
  .rt-split__card { padding: 1.5rem; }

  /* Product cards two-up */
  .rt-shop__main ul.products { grid-template-columns: repeat(2, 1fr); gap: 0.85rem; }
  .rt-pdp .related.products ul.products,
  .rt-pdp .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.85rem;
  }

  .rt-card__body { padding: 0.85rem; gap: 0.3rem; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 0.9rem !important;
  }
  .woocommerce ul.products li.product .price {
    font-size: 0.95rem !important;
  }
  .woocommerce ul.products li.product .button {
    font-size: 0.8rem !important;
    padding: 0.65rem 0.85rem !important;
  }

  /* Shop header stacks */
  .rt-shop__header {
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }
  .rt-shop__header h1.page-title { font-size: clamp(1.6rem, 6vw, 2rem); }

  /* Single product title & price scale down */
  .single-product div.product .product_title { font-size: clamp(1.6rem, 6vw, 2.1rem); }
  .single-product div.product .price { font-size: 1.5rem; }

  /* Tabs scroll horizontally instead of wrapping */
  .rt-pdp .woocommerce-tabs .tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .rt-pdp .woocommerce-tabs .tabs::-webkit-scrollbar { display: none; }
  .rt-pdp .woocommerce-tabs .tabs li { white-space: nowrap; flex: 0 0 auto; }

  /* Touch targets — ensure minimum 44px tap height */
  .button,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce .button.alt,
  .wc-block-components-button {
    min-height: var(--rt-tap);
    padding: 0.75rem 1.25rem !important;
  }
  .woocommerce form .form-row input.input-text,
  .woocommerce form .form-row textarea,
  .woocommerce form .form-row select,
  .woocommerce-ordering select {
    min-height: var(--rt-tap);
    font-size: 16px; /* prevents iOS zoom on focus */
  }
  .rt-shop__sidebar ul li { padding: 0.65rem 0.75rem; }
  .rt-shop__sidebar ul li a { min-height: var(--rt-tap); display: flex; align-items: center; }
}

/* Small phone (<480) — tightest layout, single-column cards */
@media (max-width: 479px) {
  .rt-hero { border-radius: var(--rt-radius-lg); padding: 1.25rem; }
  .rt-hero h1 { font-size: 1.6rem; }
  .rt-section__head h2 { font-size: 1.5rem; }

  .rt-cat-grid { gap: 0.6rem; }
  .rt-cat-grid a { padding: 1rem 0.5rem; border-radius: var(--rt-radius); }
  .rt-cat-grid__label { font-size: 0.85rem; }
  .rt-cat-grid__icon { font-size: 1.4rem; }

  /* Products go single-column for readability */
  .rt-shop__main ul.products,
  .rt-pdp .related.products ul.products,
  .rt-pdp .upsells.products ul.products {
    grid-template-columns: 1fr;
  }

  .rt-split__card { padding: 1.25rem; border-radius: var(--rt-radius-lg); }
  .rt-split__card h2 { font-size: 1.35rem; }

  /* PDP form cart stacks vertically with full-width add-to-cart */
  .rt-product .summary form.cart { flex-direction: column; align-items: stretch; }
  .rt-product__summary .quantity .qty { width: 100%; }
  .rt-product .summary form.cart .single_add_to_cart_button { width: 100%; }
}

/* Reduced-motion respects user preference */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
  .woocommerce ul.products li.product:hover,
  .rt-cat-grid a:hover,
  .button:hover {
    transform: none !important;
  }
}

/* ===========================================================================
   Mobile tap-target accessibility — minimum 44×44px touch targets (WCAG 2.5.5).
   Surfaced by the read-only UI audit suite (tests/e2e). Scoped to touch widths
   so desktop pointer layouts are unchanged. !important is used on the block /
   parent-theme controls to win specificity against WooCommerce-block and
   Blocksy core stylesheets.
   =========================================================================== */
@media (max-width: 1023px) {
  /* Favorites heart on product cards (was 36×36) */
  .rt-card__fav {
    width: 44px;
    height: 44px;
  }

  /* Blocksy mobile menu trigger (icon was 18×18 with no hit padding) */
  .ct-header-trigger {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }

  /* PDP gallery fullscreen trigger (was 40×40) */
  .woocommerce-product-gallery__trigger {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* WooCommerce block cart: quantity steppers (was 30×40) and remove (24×24) */
  .wc-block-components-quantity-selector__button {
    min-width: 44px !important;
    min-height: 44px !important;
  }
  .wc-block-cart-item__remove-link {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 10px !important;
  }

  /* Catalog pagination links (were ~41×40) */
  .woocommerce-pagination .page-numbers,
  a.page-numbers,
  span.page-numbers {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}