/**
 * Dark Mode - Component Rules
 * Scoped to .psfa-dark-mode for component-level overrides.
 */

/* ───── Search + Filters (shadcn React components) ───── */

/* Text inputs (search box, price range) */
.psfa-dark-mode input {
  color: hsl(var(--foreground)) !important;
  background-color: hsl(var(--muted)) !important;
  border-color: hsl(0 0% 25%) !important;
}

.psfa-dark-mode input::placeholder {
  color: hsl(var(--muted-foreground)) !important;
}

/* Select triggers (Radix renders as button role="combobox") */
.psfa-dark-mode button[role="combobox"] {
  color: hsl(var(--foreground)) !important;
  background-color: hsl(var(--muted)) !important;
  border-color: hsl(0 0% 25%) !important;
}

/* Select dropdown content (rendered via disablePortal inside .psfa-dark-mode) */
.psfa-dark-mode [role="listbox"] {
  background-color: hsl(var(--card)) !important;
  border-color: hsl(var(--border)) !important;
  color: hsl(var(--foreground)) !important;
}

.psfa-dark-mode [role="option"] {
  color: hsl(var(--foreground)) !important;
}

.psfa-dark-mode [role="option"]:hover,
.psfa-dark-mode [role="option"][data-highlighted] {
  background-color: hsl(var(--primary) / 0.15) !important;
}

/* Autocomplete suggestions dropdown */
.psfa-dark-mode .psfa-autocomplete-suggestions {
  background: hsl(var(--card)) !important;
  border-color: hsl(var(--border)) !important;
}

.psfa-dark-mode .psfa-autocomplete-suggestions button {
  color: hsl(var(--foreground)) !important;
}

.psfa-dark-mode .psfa-autocomplete-suggestions button:hover,
.psfa-dark-mode .psfa-autocomplete-suggestions button:focus {
  background: hsl(var(--primary) / 0.15) !important;
}

/* Filters divider */
.psfa-dark-mode .psfa-filters {
  border-color: hsl(var(--border)) !important;
}

/* Filters toggle button */
.psfa-dark-mode button[aria-label="Toggle filters"] {
  background: hsl(var(--card)) !important;
  border-color: hsl(0 0% 25%) !important;
  color: hsl(var(--foreground)) !important;
}

.psfa-dark-mode button[aria-label="Toggle filters"][aria-expanded="true"] {
  background: hsl(var(--muted)) !important;
  border-color: hsl(var(--primary)) !important;
}

/* General text color overrides for gray hardcoded classes */
.psfa-dark-mode .psfa-frontend-app {
  color: hsl(var(--foreground));
}

/* Legacy selectors (PHP fallback) */
.psfa-dark-mode .psfa-filter-group select,
.psfa-dark-mode .psfa-filter-group input,
.psfa-dark-mode .psfa-search-form input {
  color: hsl(var(--foreground)) !important;
  background-color: hsl(var(--muted)) !important;
}

.psfa-dark-mode .psfa-filter-group select option {
  background-color: hsl(var(--card));
  color: hsl(var(--foreground));
}

.psfa-dark-mode .psfa-filters-toggle {
  background: hsl(var(--card)) !important;
  border-color: hsl(var(--border)) !important;
  color: hsl(var(--foreground)) !important;
}

.psfa-dark-mode .psfa-filters-toggle.active,
.psfa-dark-mode .psfa-filters-toggle:focus {
  background: hsl(var(--muted)) !important;
  border-color: hsl(var(--primary)) !important;
}

/* Product card base dark */
.psfa-dark-mode .psfa-product {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* Product card hover */
.psfa-dark-mode .psfa-product:hover {
  box-shadow: 0 4px 12px hsl(var(--primary) / 0.2);
  border-color: hsl(var(--primary));
}

/* List item: disable mix-blend-multiply on dark backgrounds (darkens images) */
.psfa-dark-mode .psfa-list-item img {
  mix-blend-mode: normal !important;
}

/* Badges */
.psfa-dark-mode .psfa-product .psfa-badge-deal,
.psfa-dark-mode .psfa-product .psfa-badge-discount,
.psfa-dark-mode .psfa-badges-stack .psfa-badge-deal,
.psfa-dark-mode .psfa-badges-stack .psfa-badge-discount {
  background: linear-gradient(135deg, hsl(var(--primary)) 0%, hsl(var(--primary) / 0.85) 100%) !important;
  box-shadow: 0 1px 4px hsl(var(--primary) / 0.3) !important;
}

.psfa-dark-mode .psfa-product .psfa-badge-countdown,
.psfa-dark-mode .psfa-badges-stack .psfa-badge-countdown {
  background: linear-gradient(135deg, hsl(var(--primary) / 0.85) 0%, hsl(var(--primary)) 100%) !important;
}

.psfa-dark-mode .psfa-product .psfa-badge-bestseller,
.psfa-dark-mode .psfa-badges-stack .psfa-badge-bestseller {
  background: var(--badge-bestseller-bg) !important;
  color: var(--badge-bestseller-text) !important;
}

.psfa-dark-mode .psfa-product .psfa-badge-lightning,
.psfa-dark-mode .psfa-badges-stack .psfa-badge-lightning {
  background: linear-gradient(135deg, hsl(var(--primary) / 0.85) 0%, hsl(var(--primary)) 100%) !important;
}

/* Product Box Carousel Dots */
.psfa-dark-mode .psfa-box-carousel-dot.active,
.psfa-dark-mode .psfa-box-carousel-dot:hover {
  background: hsl(var(--primary)) !important;
}

/* Product Boxes */
.psfa-dark-mode .psfa-product-box .psfa-buy-button,
.psfa-dark-mode .psfa-product-box .psfa-buy-button span {
  color: var(--button-buy-text) !important;
}

/* Comparison Tables */
.psfa-dark-mode .psfa-comparison-table {
  border-color: hsl(var(--border));
}

.psfa-dark-mode .psfa-comparison-table th {
  color: var(--table-header-text) !important;
  border-color: hsl(var(--border)) !important;
}

.psfa-dark-mode .psfa-comparison-table tbody,
.psfa-dark-mode .psfa-comparison-table thead {
  border-color: hsl(var(--border)) !important;
}

.psfa-dark-mode .psfa-comparison-table td {
  border-color: hsl(var(--border)) !important;
  color: hsl(var(--foreground)) !important;
  background: hsl(var(--card)) !important;
}

.psfa-dark-mode .psfa-comparison-table td a,
.psfa-dark-mode .psfa-comparison-table td span,
.psfa-dark-mode .psfa-comparison-table td div {
  color: inherit;
}

/* Winner cells */
.psfa-dark-mode .psfa-comparison-table .psfa-winner td,
.psfa-dark-mode .psfa-comparison-table td.psfa-winner-cell {
  background: hsl(var(--muted)) !important;
}

.psfa-dark-mode .psfa-vertical-table td.psfa-winner-col,
.psfa-dark-mode .psfa-vertical-table th.psfa-winner-col {
  background: hsl(var(--muted)) !important;
}

.psfa-dark-mode .psfa-comparison-title {
  color: hsl(var(--foreground));
}

.psfa-dark-mode .psfa-comparison-title:hover {
  color: hsl(var(--primary));
}

.psfa-dark-mode .psfa-comparison-brand {
  background: hsl(var(--muted));
  color: hsl(var(--muted-foreground));
}

.psfa-dark-mode .psfa-comparison-price {
  color: var(--price-color);
}

.psfa-dark-mode .psfa-comparison-original-price {
  color: hsl(var(--muted-foreground));
}

.psfa-dark-mode .psfa-table-btn {
  background: linear-gradient(135deg, hsl(var(--primary) / 0.85) 0%, hsl(var(--primary)) 100%);
  color: var(--button-buy-text) !important;
}

.psfa-dark-mode .psfa-table-btn span {
  color: var(--button-buy-text) !important;
}

.psfa-dark-mode .psfa-table-btn:hover {
  filter: brightness(1.1);
}

.psfa-dark-mode .psfa-winner-badge,
.psfa-dark-mode .psfa-mobile-card .psfa-winner-badge,
.psfa-dark-mode .psfa-vertical-table .psfa-winner-badge,
.psfa-dark-mode .psfa-responsive--stack .psfa-winner-badge {
  background: hsl(var(--primary)) !important;
  color: hsl(var(--primary-foreground)) !important;
}

.psfa-dark-mode .psfa-winner-cell,
.psfa-dark-mode tr.psfa-winner td,
.psfa-dark-mode .psfa-winner-col,
.psfa-dark-mode th.psfa-winner-col {
  background: hsl(var(--muted)) !important;
}

.psfa-dark-mode .psfa-comparison-table td.psfa-winner-border {
  border-left-color: hsl(var(--primary)) !important;
}

.psfa-dark-mode .psfa-comparison-discount {
  background: hsl(var(--primary));
}

.psfa-dark-mode .psfa-comparison-stars .psfa-star-full { color: hsl(var(--primary)); }
.psfa-dark-mode .psfa-comparison-stars .psfa-star-half { color: hsl(var(--primary)); }
.psfa-dark-mode .psfa-comparison-stars .psfa-star-empty { color: hsl(var(--muted-foreground)); }

/* Mobile card style */
@media (max-width: 600px) {
  .psfa-dark-mode .psfa-comparison-table tbody tr {
    background: hsl(var(--card)) !important;
    border-color: hsl(var(--border)) !important;
  }

  .psfa-dark-mode .psfa-comparison-table td {
    background: hsl(var(--card)) !important;
    border-color: hsl(var(--border)) !important;
  }

  .psfa-dark-mode .psfa-comparison-table td::before {
    color: hsl(var(--muted-foreground)) !important;
  }

  .psfa-dark-mode .psfa-comparison-table tr.psfa-winner {
    border-color: hsl(var(--primary)) !important;
  }

  .psfa-dark-mode .psfa-comparison-table tr.psfa-winner::before {
    background: hsl(var(--primary)) !important;
    color: hsl(var(--primary-foreground)) !important;
  }

  .psfa-dark-mode .psfa-winner-card-header,
  .psfa-dark-mode .psfa-mobile-card .psfa-winner-badge,
  .psfa-dark-mode .psfa-responsive--stack tr.psfa-winner::before {
    color: hsl(var(--primary-foreground)) !important;
  }

  .psfa-dark-mode .psfa-mobile-card {
    background: hsl(var(--card)) !important;
    border-color: hsl(var(--border)) !important;
  }

  .psfa-dark-mode .psfa-mobile-card-cell {
    border-color: hsl(var(--border)) !important;
  }

  .psfa-dark-mode .psfa-mobile-card .psfa-comparison-title {
    color: hsl(var(--foreground)) !important;
  }

  .psfa-dark-mode .psfa-mobile-card.psfa-winner-card {
    border-color: hsl(var(--primary)) !important;
    background: hsl(var(--muted)) !important;
  }
}