/* ============================================
   SOPHISTICATED DARK THEME - ABRALION
   Premium Elevation System Design
   Based on #252626 - Warm Dark Palette
   ============================================ */

/* Dark Theme Variables - Professional Elevation System */
html.dark-theme body {
  /* Primary Colors - Mature & Professional */
  --color-primary: #dc2626;
  --color-primary-light: #ef4444;
  --color-primary-dark: #b91c1c;
  --color-primary-glow: rgba(220, 38, 38, 0.15);
  
  /* Background Layers - Elevation System (Warm Dark) */
  --color-background-base: #1a1a1b;        /* Deepest layer */
  --color-background: #1f1f20;             /* Base layer */
  --color-background-elevated: #252626;    /* Cards, panels (your suggestion!) */
  --color-background-card: #2a2a2b;        /* Elevated cards */
  --color-background-hover: #2f2f30;       /* Hover state */
  --color-background-input: #323233;       /* Input fields */
  
  /* Text Colors - Professional Hierarchy */
  --color-text-primary: #e4e4e7;           /* Off-white, easy on eyes */
  --color-text-secondary: #a1a1aa;         /* Medium gray */
  --color-text-tertiary: #71717a;          /* Light gray */
  --color-text-muted: #52525b;             /* Very light gray */
  --color-text-disabled: #3f3f46;          /* Disabled state */
  
  /* Accent Colors - Desaturated & Elegant */
  --color-accent-success: #10b981;
  --color-accent-warning: #f59e0b;
  --color-accent-info: #3b82f6;
  
  /* Borders & Dividers - Subtle Elevation */
  --color-border-subtle: #3a3a3b;          /* Very subtle */
  --color-border-medium: #404041;          /* Medium */
  --color-border-strong: #4a4a4b;          /* Strong */
  
  /* Shadows - Soft & Natural */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 16px 40px rgba(0, 0, 0, 0.55);
  
  /* Glows - Subtle & Professional */
  --glow-red: 0 0 20px rgba(220, 38, 38, 0.15);
  --glow-red-strong: 0 0 30px rgba(220, 38, 38, 0.25);
  
  /* Gradients - Smooth Transitions */
  --gradient-base: linear-gradient(180deg, #1f1f20 0%, #1a1a1b 100%);
  --gradient-card: linear-gradient(135deg, #2a2a2b 0%, #252626 100%);
  
  background: var(--gradient-base);
  color: var(--color-text-primary);
}

/* Smooth Transitions - Professional Feel */
html.dark-theme body * {
  transition: background-color 0.25s ease, 
              border-color 0.25s ease, 
              color 0.25s ease, 
              box-shadow 0.25s ease,
              transform 0.25s ease;
}

/* ============================================
   HEADER - Professional Elevation
   ============================================ */
html.dark-theme body .header {
  background: rgba(37, 38, 38, 0.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--color-border-subtle);
  box-shadow: var(--shadow-md);
}

html.dark-theme body .header-logo {
  filter: drop-shadow(0 0 16px rgba(220, 38, 38, 0.3));
}

html.dark-theme body .header-nav-link {
  color: var(--color-text-secondary);
  position: relative;
  font-weight: 600;
  letter-spacing: 0.3px;
  border-bottom: 2px solid transparent;
  transition: all 0.25s ease;
}

html.dark-theme body .header-nav-link::after {
  display: none;
}

html.dark-theme body .header-nav-link:hover,
html.dark-theme body .header-nav-link.active {
  color: var(--color-text-primary);
  border-bottom-color: var(--color-primary);
  background: transparent;
}

html.dark-theme body .header-search-input {
  background: var(--color-background-input);
  border: 1px solid var(--color-border-subtle);
  color: var(--color-text-primary);
  border-radius: 10px;
  padding: 10px 16px;
}

html.dark-theme body .header-search-input:focus {
  border-color: var(--color-primary);
  box-shadow: var(--glow-red);
  background: var(--color-background-card);
}

html.dark-theme body .header-search-input::placeholder {
  color: var(--color-text-muted);
}

html.dark-theme body .header-search-btn {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  border-radius: 10px;
  box-shadow: var(--glow-red);
  transition: all 0.25s ease;
}

html.dark-theme body .header-search-btn:hover {
  background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-primary) 100%);
  box-shadow: var(--glow-red-strong);
  transform: translateY(-1px);
}

/* ============================================
   MEGA MENU - Premium Dropdown
   ============================================ */
html.dark-theme body .dropdown-menu,
html.dark-theme body .mega-menu {
  background: rgba(37, 37, 37, 0.98);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  border: 1px solid var(--color-border-medium);
  box-shadow: var(--shadow-xl);
  border-radius: 12px;
}

html.dark-theme body .mega-menu-header {
  border-bottom: 1px solid var(--color-border-subtle);
  padding-bottom: 8px;
  margin-bottom: 8px;
}

html.dark-theme body .mega-menu-header a {
  color: var(--color-text-primary);
  font-weight: 600;
  letter-spacing: 0.3px;
}

html.dark-theme body .mega-menu-list a {
  color: var(--color-text-secondary);
  padding: 10px 0;
  position: relative;
  padding-left: 12px;
  transition: all 0.2s ease;
}

html.dark-theme body .mega-menu-list a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 2px;
  background: var(--color-primary);
  transition: width 0.2s ease;
}

html.dark-theme body .mega-menu-list a:hover::before {
  width: 6px;
}

html.dark-theme body .mega-menu-list a:hover {
  color: var(--color-primary);
  background: transparent;
  padding-left: 16px;
}

html.dark-theme body .mega-menu-tabs {
  background: #1e1e1e;
  border-bottom-color: var(--color-border-subtle);
}

html.dark-theme body .mega-menu-tab {
  color: var(--color-text-secondary);
}

html.dark-theme body .mega-menu-tab:hover {
  color: var(--color-primary);
  background: rgba(255, 255, 255, 0.04);
}

html.dark-theme body .mega-menu-tab.is-active {
  background: var(--color-background-card);
  color: var(--color-primary);
  border-bottom-color: var(--color-primary);
}

html.dark-theme body .mega-menu-panels {
  background: var(--color-background-card);
}

html.dark-theme body .mega-menu-product-link {
  color: var(--color-text-secondary);
}

html.dark-theme body .mega-menu-product-link:hover {
  background: #2a2a2a;
  color: var(--color-primary);
}

html.dark-theme body .mega-menu-product-thumb {
  background: #252525;
  border-color: var(--color-border-subtle);
}

html.dark-theme body .mega-menu-feature {
  background: linear-gradient(135deg, rgba(227, 30, 36, 0.12) 0%, #252525 50%, #1a1a1a 100%);
  border-color: var(--color-border-subtle);
}

/* ============================================
   HERO - Premium & Inviting
   ============================================ */
html.dark-theme body .hero {
  background: var(--gradient-base);
  position: relative;
  overflow: hidden;
}

html.dark-theme body .hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 
    radial-gradient(circle at 20% 50%, rgba(220, 38, 38, 0.08) 0%, transparent 50%),
    radial-gradient(circle at 80% 80%, rgba(220, 38, 38, 0.05) 0%, transparent 50%);
  pointer-events: none;
}

html.dark-theme body .hero h1 {
  color: var(--color-text-primary);
  font-weight: 700;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
}

html.dark-theme body .hero .highlight {
  color: var(--color-primary-light);
  text-shadow: 0 0 24px rgba(220, 38, 38, 0.4);
}

html.dark-theme body .hero p {
  color: var(--color-text-secondary);
  font-size: 1.1rem;
  line-height: 1.8;
}

html.dark-theme body .hero-logo {
  filter: drop-shadow(0 8px 32px rgba(220, 38, 38, 0.3));
}

/* ============================================
   BUTTONS - Premium & Professional
   ============================================ */
html.dark-theme body .btn-primary {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  border: none;
  box-shadow: 0 4px 14px rgba(220, 38, 38, 0.3);
  font-weight: 600;
  letter-spacing: 0.5px;
  position: relative;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

html.dark-theme body .btn-primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.6s ease;
}

html.dark-theme body .btn-primary:hover::before {
  left: 100%;
}

html.dark-theme body .btn-primary:hover {
  background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-primary) 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(220, 38, 38, 0.4);
}

html.dark-theme body .btn-primary:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.3);
}

html.dark-theme body .btn-secondary {
  background: #3a3a3b;
  border: 1.5px solid #5a5a5b;
  color: #d0d0d0;
  font-weight: 500;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}

html.dark-theme body .btn-secondary:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(227, 30, 36, 0.4);
}

html.dark-theme body .btn-secondary:active {
  transform: translateY(0);
}

/* ============================================
   PRODUCT CARDS - Premium Elevation
   ============================================ */
html.dark-theme body .product-card {
  background: var(--gradient-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  overflow: hidden;
  position: relative;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

html.dark-theme body .product-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light));
  opacity: 0;
  transition: opacity 0.3s ease;
}

html.dark-theme body .product-card:hover::before {
  opacity: 1;
}

html.dark-theme body .product-card:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-lg), 0 0 0 1px var(--color-border-medium);
  transform: translateY(-8px);
  background: var(--color-background-card);
}

html.dark-theme body .product-card-image-container {
  background: var(--color-background);
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--color-border-subtle);
}

html.dark-theme body .product-card-image-container--static-hero {
  background: var(--color-background);
}

html.dark-theme body .product-card:hover .product-card-image--hero {
  transform: scale(1.08);
}

html.dark-theme body .product-card-image {
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

html.dark-theme body .product-card:hover .product-card-image {
  transform: scale(1.08);
}

html.dark-theme body .product-card-content {
  background: transparent;
  padding: var(--spacing-md);
}

/* Fix for white space under product cards */
html.dark-theme body .product-card-image-container img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

html.dark-theme body .product-card-body {
  background: transparent;
}

html.dark-theme body .product-card-footer {
  background: transparent;
}

html.dark-theme body .product-card-title {
  color: var(--color-text-primary);
  font-weight: 600;
  font-size: 1.1rem;
}

html.dark-theme body .product-card-category {
  color: var(--color-primary);
  font-weight: 600;
  font-size: 0.7rem;
  letter-spacing: 1px;
  text-transform: uppercase;
}

html.dark-theme body .product-card-description {
  color: var(--color-text-secondary);
  line-height: 1.6;
  font-size: 0.9rem;
}

html.dark-theme body .product-card-actions {
  display: flex;
  gap: 10px;
  margin-top: var(--spacing-sm);
}

/* ============================================
   TYPOGRAPHY - All Headings
   ============================================ */
html.dark-theme body h1,
html.dark-theme body h2,
html.dark-theme body h3,
html.dark-theme body h4,
html.dark-theme body h5,
html.dark-theme body h6 {
  color: var(--color-text-primary);
}

/* ============================================
   SECTIONS - Soft & Comfortable
   ============================================ */
html.dark-theme body .section {
  background: var(--color-background);
  position: relative;
}

html.dark-theme body .section-header h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .section-header p {
  color: var(--color-text-secondary);
}

html.dark-theme body .featured-products {
  background: var(--color-background);
}

html.dark-theme body .about-preview {
  background: var(--color-background-card);
  border-radius: 12px;
  border: 1px solid var(--color-border-subtle);
  box-shadow: var(--shadow-md);
}

html.dark-theme body .about-preview-content {
  display: flex;
  gap: var(--spacing-lg);
}

html.dark-theme body .about-preview-text h2 {
  color: var(--color-text-primary);
}

html.dark-theme body .about-preview-text p {
  color: var(--color-text-secondary);
}

html.dark-theme body .about-preview-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

html.dark-theme body .feature-item {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  transition: all 0.3s ease;
  padding: var(--spacing-md);
}

html.dark-theme body .feature-item:hover {
  border-color: var(--color-border-medium);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  transform: translateY(-6px);
}

html.dark-theme body .feature-item h3 {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .feature-item p {
  color: var(--color-text-secondary);
}

html.dark-theme body .feature-icon {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  box-shadow: 0 0 16px rgba(232, 93, 103, 0.3);
  font-size: 2rem;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  color: #FFFFFF;
}

/* ============================================
   FOOTER - Elegant & Minimal
   ============================================ */
html.dark-theme body .footer {
  background: #1a1a1a;
  border-top: 1px solid var(--color-border-subtle);
  position: relative;
}

html.dark-theme body .footer::before {
  display: none;
}

html.dark-theme body .footer h3 {
  color: var(--color-text-primary);
  font-weight: 600;
  letter-spacing: 0.5px;
}

html.dark-theme body .footer-description,
html.dark-theme body .footer-links a {
  color: var(--color-text-secondary);
  position: relative;
  padding-left: 0;
  transition: all 0.3s ease;
}

html.dark-theme body .footer-links a::before {
  display: none;
}

html.dark-theme body .footer-links a:hover {
  color: var(--color-primary);
  padding-left: 0;
}

html.dark-theme body .footer-bottom {
  border-top-color: var(--color-border-subtle);
  color: var(--color-text-muted);
}

/* ============================================
   FORMS - Modern & Clean
   ============================================ */
html.dark-theme body .form-control {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  color: var(--color-text-primary);
  border-radius: 8px;
  padding: 12px 16px;
}

html.dark-theme body .form-control:focus {
  border-color: var(--color-primary);
  box-shadow: var(--glow-red);
  background: var(--color-background-elevated);
}

html.dark-theme body .form-control::placeholder {
  color: var(--color-text-muted);
}

html.dark-theme body .form-group label {
  color: var(--color-text-secondary);
  font-weight: 500;
  letter-spacing: 0.3px;
}

/* ============================================
   TABLES - Elegant Data Display
   ============================================ */
html.dark-theme body .compare-table-wrapper,
html.dark-theme body .specifications-table {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  overflow: hidden;
}

html.dark-theme body .compare-table th,
html.dark-theme body .specifications-table th {
  background: var(--color-background-elevated);
  color: var(--color-text-primary);
  font-weight: 600;
  letter-spacing: 0.3px;
  border-color: var(--color-border-subtle);
}

html.dark-theme body .compare-table td,
html.dark-theme body .specifications-table td {
  border-color: var(--color-border-subtle);
  color: var(--color-text-secondary);
}

html.dark-theme body .compare-label-col {
  background: var(--color-background-elevated);
  color: var(--color-text-primary);
  font-weight: 600;
}

/* ============================================
   THEME TOGGLE - Elegant Button
   ============================================ */
html.dark-theme body .theme-toggle-btn {
  background: var(--color-background-card);
  border: 2px solid var(--color-border-medium);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(10px);
}

html.dark-theme body .theme-toggle-btn:hover {
  border-color: var(--color-primary);
  box-shadow: 0 6px 20px rgba(232, 93, 103, 0.3);
  background: var(--color-background-elevated);
  transform: translateY(-2px);
}

/* ============================================
   SCROLLBAR - Sophisticated
   ============================================ */
html.dark-theme body ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html.dark-theme body ::-webkit-scrollbar-track {
  background: var(--color-background);
}

html.dark-theme body ::-webkit-scrollbar-thumb {
  background: var(--color-border-strong);
  border-radius: 5px;
  border: 2px solid var(--color-background);
}

html.dark-theme body ::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary);
  box-shadow: var(--glow-red);
}

/* ============================================
   ANIMATIONS & MICRO-INTERACTIONS
   ============================================ */
@keyframes glow-pulse {
  0%, 100% { box-shadow: var(--glow-red); }
  50% { box-shadow: var(--glow-red-strong); }
}

html.dark-theme body .btn-primary:active {
  animation: glow-pulse 0.3s ease;
}

/* Selection */
html.dark-theme body ::selection {
  background: var(--color-primary);
  color: #fff;
}

html.dark-theme body ::-moz-selection {
  background: var(--color-primary);
  color: #fff;
}


/* Header Dark Theme */
html.dark-theme body .header {
  background: #1a1a1a;
  border-bottom: 1px solid #2a2a2a;
}

html.dark-theme body .header-nav-link {
  color: #e0e0e0;
}

html.dark-theme body .header-nav-link:hover,
html.dark-theme body .header-nav-link.active {
  color: #E31E24;
}

html.dark-theme body .header-search-input {
  background: #0f0f0f;
  border-color: #2a2a2a;
  color: #e0e0e0;
}

html.dark-theme body .header-search-input::placeholder {
  color: #666;
}

html.dark-theme body .header-search-btn {
  background: #E31E24;
  color: #fff;
}

html.dark-theme body .mobile-menu-toggle span {
  background: #e0e0e0;
}

/* Dropdown Menu Dark */
html.dark-theme body .dropdown-menu,
html.dark-theme body .mega-menu {
  background: #1a1a1a;
  border-color: #2a2a2a;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

html.dark-theme body .dropdown-menu a,
html.dark-theme body .mega-menu-header a,
html.dark-theme body .mega-menu-list a {
  color: #e0e0e0;
}

html.dark-theme body .dropdown-menu a:hover,
html.dark-theme body .mega-menu-header a:hover,
html.dark-theme body .mega-menu-list a:hover {
  background: #0f0f0f;
  color: #E31E24;
}

html.dark-theme body .mega-menu-header {
  border-bottom-color: #E31E24;
}

html.dark-theme body .mega-menu-footer {
  border-top-color: #2a2a2a;
  background: #1a1a1a;
}

html.dark-theme body .dropdown-divider {
  background: #2a2a2a;
}

/* Hero Section Dark */
html.dark-theme body .hero {
  background: linear-gradient(135deg, #1a1a1a 0%, #0f0f0f 100%);
}

html.dark-theme body .hero h1 {
  color: #fff;
}

html.dark-theme body .hero p {
  color: #b0b0b0;
}

html.dark-theme body .highlight {
  color: #E31E24;
}

/* Sections Dark */
html.dark-theme body .section {
  background: #0f0f0f;
}

html.dark-theme body .about-preview {
  background: #1a1a1a;
}

html.dark-theme body .about-preview h2,
html.dark-theme body .about-preview h3 {
  color: #fff;
}

html.dark-theme body .about-preview p {
  color: #b0b0b0;
}

html.dark-theme body .feature-item {
  background: #0f0f0f;
  border-color: #2a2a2a;
}

html.dark-theme body .feature-icon {
  background: #E31E24;
  color: #fff;
}

/* Product Cards Dark */
html.dark-theme body .product-card {
  background: #1a1a1a;
  border-color: #2a2a2a;
}

html.dark-theme body .product-card:hover {
  border-color: #E31E24;
  box-shadow: 0 4px 12px rgba(227, 30, 36, 0.2);
}

html.dark-theme body .product-card-title {
  color: #fff;
}

html.dark-theme body .product-card-category {
  color: #888;
}

html.dark-theme body .product-card-description {
  color: #b0b0b0;
}

/* Buttons Dark */
html.dark-theme body .btn-primary {
  background: #E31E24;
  color: #fff;
  border-color: #E31E24;
}

html.dark-theme body .btn-primary:hover {
  background: #c01a1f;
  border-color: #c01a1f;
}

/* Page Header Dark */
html.dark-theme body .page-header {
  background: #1a1a1a;
  border-bottom: 1px solid #2a2a2a;
}

html.dark-theme body .page-header h1 {
  color: #fff;
}

html.dark-theme body .page-header p {
  color: #b0b0b0;
}

/* Sidebar Dark */
html.dark-theme body .sidebar {
  background: #1a1a1a;
  border-color: #2a2a2a;
}

html.dark-theme body .sidebar h3 {
  color: #fff;
  border-bottom-color: #2a2a2a;
}

html.dark-theme body .products-sidebar {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 16px;
  padding: var(--spacing-md);
}

html.dark-theme body .products-sidebar h2 {
  color: var(--color-text-primary);
  border-bottom: 2px solid var(--color-border-medium);
  padding-bottom: var(--spacing-xs);
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .sidebar-section {
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .sidebar-search {
  display: flex;
  gap: var(--spacing-xs);
}

html.dark-theme body .products-page-header h1 {
  color: var(--color-text-primary);
}

html.dark-theme body .products-page-header p {
  color: var(--color-text-secondary);
}

html.dark-theme body .products-info {
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .products-info p {
  color: var(--color-text-secondary);
}

html.dark-theme body .no-products-message {
  text-align: center;
  padding: var(--spacing-xl);
  color: var(--color-text-secondary);
}

html.dark-theme body .no-products-message p {
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .category-btn {
  background: #0f0f0f;
  color: #e0e0e0;
  border-color: #2a2a2a;
}

html.dark-theme body .category-btn:hover,
html.dark-theme body .category-btn.active {
  background: #E31E24;
  color: #fff;
  border-color: #E31E24;
}

/* Product Detail Dark - Legacy Styles (Deprecated, use new styles above) */
html.dark-theme body .product-detail-container {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-lg);
}

html.dark-theme body .product-detail-title {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .product-detail-category {
  color: var(--color-primary);
  font-weight: 600;
  text-transform: uppercase;
}

html.dark-theme body .product-detail-description {
  color: var(--color-text-secondary);
  line-height: 1.7;
}

html.dark-theme body .specifications-table {
  border-color: #2a2a2a;
}

html.dark-theme body .specifications-table th {
  background: #0f0f0f;
  color: #fff;
  border-color: #2a2a2a;
}

html.dark-theme body .specifications-table td {
  border-color: #2a2a2a;
  color: #e0e0e0;
}

html.dark-theme body .features-list li {
  color: #e0e0e0;
}

/* Compare Page Dark */
html.dark-theme body .compare-page {
  background: var(--color-background);
}

html.dark-theme body .compare-header h1 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .compare-header p {
  color: var(--color-text-secondary);
}

html.dark-theme body .compare-table-wrapper {
  border-color: var(--color-border-subtle);
  background: var(--color-background-card);
  border-radius: 12px;
  overflow: hidden;
}

html.dark-theme body .compare-table th,
html.dark-theme body .compare-table td {
  border-color: var(--color-border-subtle);
  color: var(--color-text-secondary);
}

html.dark-theme body .compare-table thead th {
  background: var(--color-background-elevated);
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .compare-label-col {
  background: var(--color-background-elevated);
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .compare-product-header h3 {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .compare-product-header .product-category {
  color: var(--color-primary);
}

html.dark-theme body .empty-state h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .empty-state p {
  color: var(--color-text-secondary);
}

/* Form Dark */
html.dark-theme body .form-group label {
  color: #e0e0e0;
}

html.dark-theme body .form-control {
  background: #0f0f0f;
  border-color: #2a2a2a;
  color: #e0e0e0;
}

html.dark-theme body .form-control:focus {
  border-color: #E31E24;
  background: #1a1a1a;
}

html.dark-theme body .form-control::placeholder {
  color: #666;
}

html.dark-theme body .error-message {
  color: #ff6b6b;
}

html.dark-theme body .success-message {
  background: #1a4d1a;
  color: #4ade80;
  border-color: #2a6b2a;
}

/* Contact Page */
html.dark-theme body .contact-header {
  background: transparent;
}

html.dark-theme body .contact-header h1 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .contact-header p {
  color: var(--color-text-secondary);
}

html.dark-theme body .contact-info {
  background: #2a2a2b;
  border: 1px solid #3a3a3b;
}

html.dark-theme body .contact-info h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .contact-intro {
  color: var(--color-text-secondary);
}

html.dark-theme body .contact-item {
  border-bottom-color: #3a3a3b;
}

html.dark-theme body .contact-details h3 {
  color: var(--color-text-primary);
}

html.dark-theme body .contact-details p,
html.dark-theme body .contact-details a {
  color: var(--color-text-secondary);
}

html.dark-theme body .contact-details a:hover {
  color: var(--color-primary);
}

html.dark-theme body .contact-form-container {
  background: #2a2a2b;
  border: 1px solid #3a3a3b;
}

html.dark-theme body .contact-form-container h2 {
  color: var(--color-text-primary);
}

html.dark-theme body .form-intro {
  color: var(--color-text-secondary);
}

html.dark-theme body .contact-info-item {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-lg);
  transition: all 0.25s ease;
}

html.dark-theme body .contact-info-item:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-md);
}

html.dark-theme body .contact-info-item h3 {
  color: var(--color-text-primary);
  font-weight: 600;
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .contact-info-item p {
  color: var(--color-text-secondary);
}

/* About Page */
html.dark-theme body .about-hero {
  background: var(--gradient-base);
}

html.dark-theme body .about-hero h1 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .about-hero p {
  color: var(--color-text-secondary);
}

html.dark-theme body .about-text h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .about-text p {
  color: var(--color-text-secondary);
}

html.dark-theme body .vision-mission {
  background: transparent;
}

html.dark-theme body .about-section {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-xl);
  margin-bottom: var(--spacing-lg);
}

html.dark-theme body .about-section h2,
html.dark-theme body .about-section h3 {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .about-section p {
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .vm-card {
  background: var(--color-background);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  padding: var(--spacing-lg);
}

html.dark-theme body .vm-icon {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
}

html.dark-theme body .vm-card:hover .vm-icon {
  box-shadow: 0 6px 16px rgba(220, 38, 38, 0.4);
}

html.dark-theme body .vm-icon svg {
  stroke: #ffffff;
}

html.dark-theme body .vm-card h2 {
  color: var(--color-primary);
  font-weight: 700;
}

html.dark-theme body .vm-card p {
  color: var(--color-text-secondary);
}

html.dark-theme body .sector-card,
html.dark-theme body .value-card {
  background: var(--color-background);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  padding: var(--spacing-md);
  transition: all 0.25s ease;
}

html.dark-theme body .sector-card:hover,
html.dark-theme body .value-card:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-sm);
}

html.dark-theme body .sector-icon {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.3);
}

html.dark-theme body .sector-card:hover .sector-icon {
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4);
}

html.dark-theme body .sector-icon svg {
  stroke: #ffffff;
}

html.dark-theme body .sector-card h3,
html.dark-theme body .value-card h3 {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .sector-card p,
html.dark-theme body .value-card p {
  color: var(--color-text-secondary);
}

html.dark-theme body .emphasis-text {
  background: var(--gradient-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-xl);
}

html.dark-theme body .emphasis-text h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .emphasis-text p {
  color: var(--color-text-secondary);
}

html.dark-theme body .about-cta {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-xl);
  text-align: center;
}

html.dark-theme body .about-cta h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .about-cta p {
  color: var(--color-text-secondary);
}

html.dark-theme body .vision-mission-card {
  background: var(--color-background);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  padding: var(--spacing-lg);
}

html.dark-theme body .sector-item,
html.dark-theme body .value-item {
  background: var(--color-background);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  padding: var(--spacing-md);
  transition: all 0.25s ease;
}

html.dark-theme body .sector-item:hover,
html.dark-theme body .value-item:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-sm);
}

html.dark-theme body .logo-emphasis {
  background: var(--gradient-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-xl);
}

/* Footer Dark */
html.dark-theme body .footer {
  background: #1a1a1a;
  border-top: 1px solid #2a2a2a;
}

html.dark-theme body .footer h3 {
  color: #fff;
}

html.dark-theme body .footer-description,
html.dark-theme body .footer-links a {
  color: #b0b0b0;
}

html.dark-theme body .footer-links a:hover {
  color: #E31E24;
}

html.dark-theme body .footer-bottom {
  border-top-color: #2a2a2a;
  color: #888;
}

/* Breadcrumb Dark */
html.dark-theme body .breadcrumb {
  background: #1a1a1a;
}

html.dark-theme body .breadcrumb a {
  color: #b0b0b0;
}

html.dark-theme body .breadcrumb a:hover {
  color: #E31E24;
}

html.dark-theme body .breadcrumb-separator {
  color: #666;
}

/* Toast Dark */
html.dark-theme body .toast-notification {
  background: #1a1a1a;
  color: #e0e0e0;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

/* Badge Dark */
html.dark-theme body .compare-badge {
  background: #E31E24;
  color: #fff;
}

/* Loading Dark */
html.dark-theme body .loading-message {
  color: #b0b0b0;
}

/* No Products Dark */
html.dark-theme body .no-products {
  color: #b0b0b0;
}

/* Scrollbar Dark */
html.dark-theme body ::-webkit-scrollbar {
  width: 12px;
  background: #0f0f0f;
}

html.dark-theme body ::-webkit-scrollbar-track {
  background: #0f0f0f;
}

html.dark-theme body ::-webkit-scrollbar-thumb {
  background: #2a2a2a;
  border-radius: 6px;
}

html.dark-theme body ::-webkit-scrollbar-thumb:hover {
  background: #E31E24;
}


/* ============================================
   ADDITIONAL ELEMENTS - Complete Coverage
   ============================================ */

/* Mega Menu Footer */
html.dark-theme body .mega-menu-footer {
  border-top: 1px solid var(--color-border-subtle);
  padding-top: var(--spacing-sm);
  margin-top: var(--spacing-sm);
}

/* Mobile Menu */
html.dark-theme body .mobile-menu-toggle span {
  background: var(--color-text-secondary);
}

html.dark-theme body .mobile-menu-toggle:hover span {
  background: var(--color-primary);
}

/* About Preview */
html.dark-theme body .about-preview-content {
  display: flex;
  gap: var(--spacing-lg);
}

html.dark-theme body .about-preview-text h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .about-preview-text h3 {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .about-preview-text p {
  color: var(--color-text-secondary);
  line-height: 1.7;
}

html.dark-theme body .about-preview-features {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

/* Products Page */
html.dark-theme body .products-page {
  background: var(--color-background);
}

html.dark-theme body .products-layout {
  background: transparent;
}

html.dark-theme body .products-main {
  background: transparent;
}

html.dark-theme body .products-page-header h1 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .products-page-header p {
  color: var(--color-text-secondary);
}

html.dark-theme body .products-sidebar {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-md);
}

html.dark-theme body .products-sidebar h2,
html.dark-theme body .sidebar-section h2 {
  color: var(--color-text-primary);
  border-bottom: 1px solid var(--color-border-subtle);
  padding-bottom: var(--spacing-xs);
  margin-bottom: var(--spacing-sm);
  font-weight: 600;
}

html.dark-theme body .sidebar-section {
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .sidebar-search {
  display: flex;
  gap: var(--spacing-xs);
}

html.dark-theme body .products-info {
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .products-info p {
  color: var(--color-text-secondary);
}

html.dark-theme body .no-products-message {
  text-align: center;
  padding: var(--spacing-xl);
  color: var(--color-text-secondary);
  background: transparent;
}

html.dark-theme body .no-products-message p {
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .category-btn {
  background: var(--color-background-input);
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border-subtle);
  border-radius: 8px;
  padding: 10px 16px;
  transition: all 0.25s ease;
}

html.dark-theme body .category-btn:hover,
html.dark-theme body .category-btn.active {
  background: var(--color-primary);
  color: #ffffff;
  border-color: var(--color-primary);
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.3);
}

/* Product Detail */
html.dark-theme body .product-detail {
  background: var(--color-background);
}

html.dark-theme body .product-detail-content {
  background: transparent;
}

html.dark-theme body .product-detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: 0;
  box-shadow: var(--shadow-md);
  overflow: hidden;
}

@media screen and (min-width: 769px) {
  html.dark-theme body .product-detail-grid {
    grid-template-columns: 1fr 1fr;
    padding: var(--spacing-lg);
  }
}

html.dark-theme body .product-detail-image {
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
  padding: var(--spacing-lg);
  min-width: 0;
}

@media screen and (min-width: 769px) {
  html.dark-theme body .product-detail-image {
    padding-right: var(--spacing-md);
  }
}

html.dark-theme body .product-detail-info {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: var(--spacing-lg);
  min-width: 0;
}

@media screen and (min-width: 769px) {
  html.dark-theme body .product-detail-info {
    padding-left: var(--spacing-md);
  }
}

html.dark-theme body .product-detail-title,
html.dark-theme body .product-detail-info h1 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .product-category {
  color: var(--color-primary);
  font-weight: 600;
  font-size: 0.75rem;
  letter-spacing: 1px;
  text-transform: uppercase;
}

html.dark-theme body .product-description {
  color: var(--color-text-secondary);
  line-height: 1.7;
}

html.dark-theme body .product-features {
  background: transparent;
}

html.dark-theme body .product-features h3 {
  color: var(--color-text-primary);
  font-weight: 600;
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .product-features ul {
  color: var(--color-text-secondary);
}

html.dark-theme body .product-features li {
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-xs);
}

html.dark-theme body .product-actions {
  background: transparent;
}

html.dark-theme body .product-specifications {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-lg);
  margin-top: var(--spacing-xl);
}

html.dark-theme body .product-specifications h2 {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .specs-table {
  width: 100%;
  border-collapse: collapse;
}

html.dark-theme body .specs-table th,
html.dark-theme body .specs-table td {
  padding: 12px 16px;
  border: 1px solid var(--color-border-subtle);
  text-align: left;
  background: transparent;
}

html.dark-theme body .specs-table th {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .specs-table td {
  color: var(--color-text-secondary);
}

/* Related Products */
html.dark-theme body .related-products {
  background: transparent;
  margin-top: var(--spacing-xl);
}

html.dark-theme body .related-products h2 {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: var(--spacing-md);
}

/* Breadcrumb */
html.dark-theme body .breadcrumb {
  background: transparent;
  padding: var(--spacing-sm) 0;
}

html.dark-theme body .breadcrumb a {
  color: var(--color-text-secondary);
  transition: color 0.25s ease;
}

html.dark-theme body .breadcrumb a:hover {
  color: var(--color-primary);
}

html.dark-theme body .breadcrumb-separator {
  color: var(--color-text-muted);
}

/* Toast Notification */
html.dark-theme body .toast-notification {
  background: var(--color-background-card);
  color: var(--color-text-primary);
  box-shadow: var(--shadow-lg);
  border: 1px solid var(--color-border-subtle);
}

/* Compare Badge */
html.dark-theme body .compare-badge {
  background: var(--color-primary);
  color: #ffffff;
  font-weight: 600;
}

/* Loading Message */
html.dark-theme body .loading-message {
  color: var(--color-text-secondary);
  text-align: center;
  padding: var(--spacing-xl);
}

/* Empty State */
html.dark-theme body .empty-state {
  text-align: center;
  padding: var(--spacing-xl);
}

html.dark-theme body .empty-state h2 {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .empty-state p {
  color: var(--color-text-secondary);
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .empty-state-icon {
  font-size: 4rem;
  margin-bottom: var(--spacing-md);
  opacity: 0.5;
}

/* Contact Info */
html.dark-theme body .contact-info-item {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-lg);
  transition: all 0.25s ease;
}

html.dark-theme body .contact-info-item:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-md);
}

html.dark-theme body .contact-info-item h3 {
  color: var(--color-text-primary);
  font-weight: 600;
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .contact-info-item p {
  color: var(--color-text-secondary);
}

/* About Page */
html.dark-theme body .about-section {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-xl);
  margin-bottom: var(--spacing-lg);
}

html.dark-theme body .about-section h2,
html.dark-theme body .about-section h3 {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: var(--spacing-md);
}

html.dark-theme body .about-section p {
  color: var(--color-text-secondary);
  line-height: 1.7;
  margin-bottom: var(--spacing-sm);
}

html.dark-theme body .vision-mission-card {
  background: var(--color-background);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  padding: var(--spacing-lg);
}

html.dark-theme body .sector-item,
html.dark-theme body .value-item {
  background: var(--color-background);
  border: 1px solid var(--color-border-subtle);
  border-radius: 12px;
  padding: var(--spacing-md);
  transition: all 0.25s ease;
}

html.dark-theme body .sector-item:hover,
html.dark-theme body .value-item:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-sm);
}

html.dark-theme body .logo-emphasis {
  background: var(--gradient-card);
  border: 1px solid var(--color-border-subtle);
  border-radius: 14px;
  padding: var(--spacing-xl);
}

/* Page Header */
html.dark-theme body .page-header {
  background: var(--color-background-card);
  border-bottom: 1px solid var(--color-border-subtle);
  padding: var(--spacing-xl) 0;
  margin-bottom: var(--spacing-lg);
}

html.dark-theme body .page-header h1 {
  color: var(--color-text-primary);
  font-weight: 700;
  margin-bottom: var(--spacing-xs);
}

html.dark-theme body .page-header p {
  color: var(--color-text-secondary);
}

/* Success Message */
html.dark-theme body .success-message {
  background: rgba(16, 185, 129, 0.1);
  color: var(--color-accent-success);
  border: 1px solid rgba(16, 185, 129, 0.3);
  border-radius: 8px;
  padding: var(--spacing-md);
}

/* Error Message */
html.dark-theme body .error-message {
  color: #ef4444;
  font-size: 0.875rem;
  margin-top: var(--spacing-xs);
}

/* Scrollbar - Professional */
html.dark-theme body ::-webkit-scrollbar {
  width: 12px;
  background: var(--color-background);
}

html.dark-theme body ::-webkit-scrollbar-track {
  background: var(--color-background);
}

html.dark-theme body ::-webkit-scrollbar-thumb {
  background: var(--color-border-strong);
  border-radius: 6px;
  border: 2px solid var(--color-background);
}

html.dark-theme body ::-webkit-scrollbar-thumb:hover {
  background: var(--color-primary);
}

/* Selection */
html.dark-theme body ::selection {
  background: var(--color-primary);
  color: #ffffff;
}

html.dark-theme body ::-moz-selection {
  background: var(--color-primary);
  color: #ffffff;
}


/* ============================================
   DOCUMENTS PAGE
   ============================================ */
html.dark-theme body .documents-section {
  background: var(--color-background);
}

html.dark-theme body .documents-category h2 {
  color: var(--color-text-primary);
  font-weight: 700;
}

html.dark-theme body .category-description {
  color: var(--color-text-secondary);
}

html.dark-theme body .document-card {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

html.dark-theme body .document-card:hover {
  border-color: var(--color-border-medium);
  box-shadow: var(--shadow-lg);
  transform: translateY(-8px);
}

html.dark-theme body .document-icon {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  box-shadow: 0 0 16px rgba(220, 38, 38, 0.3);
}

html.dark-theme body .document-icon-safety {
  background: linear-gradient(135deg, #f59e0b, #d97706);
  box-shadow: 0 0 16px rgba(245, 158, 11, 0.3);
}

html.dark-theme body .document-info h3 {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .document-info p {
  color: var(--color-text-secondary);
}

html.dark-theme body .document-size,
html.dark-theme body .document-lang {
  color: var(--color-text-tertiary);
}

html.dark-theme body .documents-info-box {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-subtle);
}

html.dark-theme body .info-icon {
  background: var(--color-primary);
  box-shadow: 0 0 16px rgba(220, 38, 38, 0.3);
}

html.dark-theme body .info-content h3 {
  color: var(--color-text-primary);
  font-weight: 600;
}

html.dark-theme body .info-content p {
  color: var(--color-text-secondary);
}

html.dark-theme body .info-content a {
  color: var(--color-primary-light);
}

html.dark-theme body .document-card-actions .btn-open-browser {
  background: transparent;
  color: var(--color-text-secondary);
  border-color: var(--color-border-subtle);
}

html.dark-theme body .document-card-actions .btn-open-browser:hover {
  color: var(--color-primary-light);
  border-color: var(--color-primary);
  background: rgba(220, 38, 38, 0.08);
}

html.dark-theme body .info-content a:hover {
  color: var(--color-primary);
}

/* Contact Page - SVG Icons */
html.dark-theme body .contact-icon {
  background: linear-gradient(135deg, #E31E24, #C41820);
  box-shadow: 0 2px 8px rgba(227, 30, 36, 0.3);
}

html.dark-theme body .contact-item:hover .contact-icon {
  box-shadow: 0 4px 12px rgba(227, 30, 36, 0.4);
}

html.dark-theme body .contact-icon svg {
  stroke: #ffffff;
}

/* Category Page */
html.dark-theme body .category-page {
  background: transparent;
}

html.dark-theme body .category-header h1 {
  color: var(--color-text-primary);
}

html.dark-theme body .category-header p {
  color: var(--color-text-secondary);
}

html.dark-theme body .subcategories {
  background: #2a2a2b;
  border: 1px solid #3a3a3b;
}

html.dark-theme body .subcategories h2 {
  color: var(--color-text-primary);
}