/* ===== PRODUCTS PAGE PREMIUM VINEYARD BACKGROUND ===== */
body.products-page {
  background-color: #faf8f5;
  position: relative;
}

body.products-page::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -2;
  background:
    /* Бочки — тёмные круги с текстурой дерева */
    radial-gradient(ellipse 60px 70px at 8% 75%, rgba(101, 67, 33, 0.06) 0%, transparent 70%),
    radial-gradient(ellipse 55px 65px at 92% 80%, rgba(101, 67, 33, 0.05) 0%, transparent 70%),
    radial-gradient(ellipse 50px 60px at 5% 30%, rgba(101, 67, 33, 0.04) 0%, transparent 70%),
    radial-gradient(ellipse 58px 68px at 95% 25%, rgba(101, 67, 33, 0.04) 0%, transparent 70%),
    /* Виноградные лозы — изогнутые линии */
    radial-gradient(ellipse 200px 8px at 15% 20%, rgba(90, 45, 74, 0.04) 0%, transparent 100%),
    radial-gradient(ellipse 180px 6px at 85% 40%, rgba(90, 45, 74, 0.03) 0%, transparent 100%),
    radial-gradient(ellipse 220px 7px at 10% 60%, rgba(114, 47, 55, 0.03) 0%, transparent 100%),
    radial-gradient(ellipse 190px 6px at 90% 70%, rgba(114, 47, 55, 0.03) 0%, transparent 100%),
    /* Виноградные гроздья */
    radial-gradient(circle 12px at 20% 22%, rgba(90, 45, 74, 0.06) 0%, transparent 100%),
    radial-gradient(circle 10px at 22% 24%, rgba(90, 45, 74, 0.05) 0%, transparent 100%),
    radial-gradient(circle 11px at 18% 25%, rgba(90, 45, 74, 0.05) 0%, transparent 100%),
    radial-gradient(circle 12px at 82% 42%, rgba(114, 47, 55, 0.06) 0%, transparent 100%),
    radial-gradient(circle 10px at 84% 44%, rgba(114, 47, 55, 0.05) 0%, transparent 100%),
    radial-gradient(circle 11px at 80% 45%, rgba(114, 47, 55, 0.05) 0%, transparent 100%),
    /* Листья винограда */
    radial-gradient(ellipse 40px 35px at 12% 18%, rgba(76, 112, 56, 0.04) 0%, transparent 100%),
    radial-gradient(ellipse 35px 30px at 88% 38%, rgba(76, 112, 56, 0.03) 0%, transparent 100%),
    radial-gradient(ellipse 38px 32px at 7% 55%, rgba(76, 112, 56, 0.03) 0%, transparent 100%),
    radial-gradient(ellipse 36px 30px at 93% 65%, rgba(76, 112, 56, 0.03) 0%, transparent 100%),
    /* Базовый фон */
    linear-gradient(180deg, #faf8f5 0%, #f5f0ea 30%, #faf8f5 60%, #f8f4ee 100%);
}

body.products-page::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background:
    /* Деревянные обручи бочек */
    radial-gradient(ellipse 65px 4px at 8% 70%, rgba(139, 90, 43, 0.06) 0%, transparent 100%),
    radial-gradient(ellipse 65px 4px at 8% 80%, rgba(139, 90, 43, 0.06) 0%, transparent 100%),
    radial-gradient(ellipse 60px 4px at 92% 75%, rgba(139, 90, 43, 0.05) 0%, transparent 100%),
    radial-gradient(ellipse 60px 4px at 92% 85%, rgba(139, 90, 43, 0.05) 0%, transparent 100%),
    /* Золотые акценты — солнечные лучи на виноградниках */
    radial-gradient(ellipse 300px 300px at 0% 0%, rgba(212, 175, 55, 0.03) 0%, transparent 60%),
    radial-gradient(ellipse 300px 300px at 100% 100%, rgba(212, 175, 55, 0.03) 0%, transparent 60%),
    /* Текстура погреба */
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 120px,
      rgba(139, 90, 60, 0.008) 120px,
      rgba(139, 90, 60, 0.008) 121px
    ),
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 120px,
      rgba(139, 90, 60, 0.008) 120px,
      rgba(139, 90, 60, 0.008) 121px
    );
  pointer-events: none;
}

/* ===== PRODUCTS FILTERS ===== */
.filters {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin: 50px 0;
  flex-wrap: wrap;
}

.filter-btn {
  padding: 10px 24px;
  border: 2px solid #9b8860;
  background: white;
  color: #9b8860;
  cursor: pointer;
  border-radius: 25px;
  font-weight: 500;
  font-size: 14px;
  font-family: 'Poppins', sans-serif;
  transition: all 0.3s ease;
  box-shadow: none;
}

.filter-btn:hover {
  background: #7d6d4d;
  color: white;
  border-color: #7d6d4d;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(155, 136, 96, 0.3);
}

.filter-btn.active {
  background: #9b8860;
  color: white;
  border-color: #9b8860;
  box-shadow: 0 4px 12px rgba(155, 136, 96, 0.4);
}

/* ===== PRODUCTS PRICING ===== */
.product-card__price {
  font-size: 24px;
  font-weight: 700;
  color: var(--accent-wine, #722f37);
  margin: 15px 0;
  font-family: 'Playfair Display', serif;
}

.add-to-cart-btn {
  width: 100%;
  padding: 14px;
  background: linear-gradient(135deg, var(--accent-wine, #722f37), var(--accent-plum, #6b3a52));
  color: white;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-family: 'Poppins', sans-serif;
  transition: all 0.3s;
  margin-top: 10px;
  box-shadow: 0 4px 10px rgba(114, 47, 55, 0.2);
}

.add-to-cart-btn:hover {
  background: linear-gradient(135deg, #1a1410, var(--accent-grape, #5a2d4a));
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(114, 47, 55, 0.35);
}

.add-to-cart-btn:disabled {
  background: #ccc;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

/* ===== PRODUCTS CART & STOCK ===== */
.cart-badge {
  background: #e74c3c;
  color: white;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
  margin-left: 5px;
}

.stock-info {
  display: none !important;
}

.stock-low {
  display: none !important;
}

/* ===== PRODUCTS DETAILS ===== */
.product-details {
  margin-top: 15px;
}

.product-details p {
  font-size: 13px;
  color: #666;
  margin: 6px 0;
  font-family: 'Poppins', sans-serif;
}

.product-details p strong {
  color: #2d2416;
}

/* ===== PRODUCTS PREMIUM LAYER ===== */
body.products-page .product-card {
  backdrop-filter: blur(5px);
  background: rgba(255, 255, 255, 0.95);
}

body.products-page .product-card:hover {
  background: #fff;
}