/* Products Page Dark Mode Styles */

[data-theme="dark"] .products-page {
  background-color: #121212;
  color: #e0e0e0;
}

[data-theme="dark"] .products-hero {
  background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)), url('../images/products-hero.jpg');
}

[data-theme="dark"] .hero-content h1,
[data-theme="dark"] .hero-content p {
  color: #f0f0f0;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .why-products-section {
  background-color: #121212;
  color: #e0e0e0;
}

[data-theme="dark"] .why-products-section h2 {
  color: #f0f0f0;
  text-shadow: 0 0 5px rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .why-product-item h3 {
  color: #aaa;
}

[data-theme="dark"] .why-product-item p {
  color: #bbb;
}

[data-theme="dark"] .center-image {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
  border: 1px solid #333;
}

/* CTA Section Dark Mode Improved */
[data-theme="dark"] .cta-box {
  background-color: #1e1e1e;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
  border: 1px solid #333;
}

[data-theme="dark"] .cta-box h3 {
  color: #f0f0f0;
}

[data-theme="dark"] .cta-box p {
  color: #bbb;
}

[data-theme="dark"] .cta-button {
  background-color: #4a4a4a;
  color: white;
  border: 1px solid #555;
  transition: all 0.3s ease;
}

[data-theme="dark"] .cta-button:hover {
  background-color: #666;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .filter-section {
  background-color: #2d2d2d;
}

[data-theme="dark"] .category-btn {
  background-color: #1e1e1e;
  color: #e0e0e0;
  border: 2px solid #444;
}

[data-theme="dark"] .category-btn:hover,
[data-theme="dark"] .category-btn.active {
  background-color: #4a4a4a;
  border-color: #666;
  color: #fff;
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.1);
}

/* Vertical Products Section */
[data-theme="dark"] .vertical-product-card {
  background-color: #1e1e1e;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  border: 1px solid #333;
}

[data-theme="dark"] .product-info-box {
  background-color: rgba(30, 30, 30, 0.8);
  border-top: 1px solid #333;
}

[data-theme="dark"] .price-label,
[data-theme="dark"] .state-label {
  color: #bbb;
}

[data-theme="dark"] .price-value,
[data-theme="dark"] .state-value {
  color: #f0f0f0;
}

[data-theme="dark"] .in-stock {
  color: #4caf50;
}

[data-theme="dark"] .low-stock {
  color: #ff9800;
}

[data-theme="dark"] .out-stock {
  color: #f44336;
}

[data-theme="dark"] .vertical-product-overlay {
  background: linear-gradient(to top, rgba(25, 25, 25, 0.95), rgba(30, 30, 30, 0.8));
}

[data-theme="dark"] .vertical-product-title {
  color: #f0f0f0;
}

[data-theme="dark"] .vertical-product-description {
  color: #bbb;
}

[data-theme="dark"] .trend {
  color: #f0f0f0;
  background-color: #333;
}

[data-theme="dark"] .trend.up {
  background-color: rgba(76, 175, 80, 0.2);
  color: #4caf50;
}

[data-theme="dark"] .trend.down {
  background-color: rgba(244, 67, 54, 0.2);
  color: #f44336;
}

[data-theme="dark"] .trend.neutral {
  background-color: rgba(255, 152, 0, 0.2);
  color: #ff9800;
}

[data-theme="dark"] .vertical-product-button {
  background-color: #4a4a4a;
  color: white;
  border: 1px solid #555;
}

[data-theme="dark"] .vertical-product-button:hover {
  background-color: #666;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
}

/* Product Popup */
[data-theme="dark"] .product-popup-overlay {
  background-color: rgba(0, 0, 0, 0.85);
}

[data-theme="dark"] .product-popup {
  background-color: #1e1e1e;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  border: 1px solid #333;
}

[data-theme="dark"] .product-popup-header {
  border-bottom: 1px solid #333;
}

[data-theme="dark"] .product-popup-close {
  color: #e0e0e0;
  background-color: rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .product-popup-close:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff;
}

[data-theme="dark"] .product-popup-title {
  color: #f0f0f0;
}

[data-theme="dark"] .product-popup-description {
  color: #bbb;
}

[data-theme="dark"] .product-popup-specs h4 {
  color: #ccc;
  border-bottom: 1px solid #333;
}

[data-theme="dark"] .product-popup-specs p {
  color: #bbb;
}

[data-theme="dark"] .product-popup-details h3 {
  color: #f0f0f0;
  border-bottom: 1px solid #333;
}

[data-theme="dark"] .product-popup-details ul li {
  color: #bbb;
}

[data-theme="dark"] .availability-chart {
  background-color: #252525;
  border: 1px solid #333;
}

[data-theme="dark"] .month {
  color: #e0e0e0;
}

[data-theme="dark"] .status-bar {
  background-color: #333;
}

[data-theme="dark"] .high .status-bar {
  background-color: #4caf50;
}

[data-theme="dark"] .medium .status-bar {
  background-color: #ff9800;
}

[data-theme="dark"] .low .status-bar {
  background-color: #f44336;
}

[data-theme="dark"] .status-label {
  color: #bbb;
}

[data-theme="dark"] .product-popup-button {
  background-color: #4a4a4a;
  color: white;
  border: 1px solid #555;
}

[data-theme="dark"] .product-popup-button:hover {
  background-color: #666;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
}

/* Responsive styles */
@media (max-width: 768px) {
  [data-theme="dark"] .cta-box {
    background-color: #1a1a1a;
  }
  
  [data-theme="dark"] .vertical-product-card {
    background-color: #1a1a1a;
  }
  
  [data-theme="dark"] .product-popup {
    background-color: #1a1a1a;
  }
}

@media (max-width: 576px) {
  [data-theme="dark"] .month-status {
    border-color: #333;
  }
}