/**
 * PeptiderPro Dark Mode
 * System / Light / Dark via [data-theme] on html
 */

[data-theme="dark"],
:root.dark-mode {
  --pp-dark: #F8FAFC;
  --pp-gray: #CBD5E1;
  --pp-bg: #0B1220;
  --pp-white: #111827;
  --pp-surface: #111827;
  --pp-surface-muted: #0F172A;
  --pp-surface-elevated: #1E293B;
  --pp-border: rgba(255, 255, 255, 0.08);
  --pp-border-strong: rgba(255, 255, 255, 0.14);
  --pp-text: #F8FAFC;
  --pp-text-muted: #CBD5E1;
  --pp-header-bg: rgba(15, 23, 42, 0.92);
  --pp-input-bg: #0F172A;
  --pp-shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}

[data-theme="light"] {
  color-scheme: light;
}

[data-theme="dark"] body,
:root.dark-mode body {
  color: var(--pp-text);
  background: var(--pp-bg);
}

/* Smooth transitions after first paint */
html.pp-theme-ready body,
html.pp-theme-ready .pp-header,
html.pp-theme-ready .pp-card,
html.pp-theme-ready .pp-widget,
html.pp-theme-ready .pp-btn,
html.pp-theme-ready .pp-search-modal__panel,
html.pp-theme-ready .pp-nav__list,
html.pp-theme-ready .pp-lang-switcher,
html.pp-theme-ready .pp-dark-toggle,
html.pp-theme-ready .pp-search-toggle {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Header */
[data-theme="dark"] .pp-header,
:root.dark-mode .pp-header {
  background: var(--pp-header-bg);
  border-bottom-color: var(--pp-border);
}

[data-theme="dark"] .pp-logo__text,
[data-theme="dark"] .pp-nav__list a,
[data-theme="dark"] .pp-tagline,
:root.dark-mode .pp-logo__text,
:root.dark-mode .pp-nav__list a,
:root.dark-mode .pp-tagline {
  color: var(--pp-text);
}

[data-theme="dark"] .pp-nav__list a:hover,
:root.dark-mode .pp-nav__list a:hover {
  color: var(--pp-accent);
}

[data-theme="dark"] .pp-nav-toggle__bar,
:root.dark-mode .pp-nav-toggle__bar {
  background: var(--pp-text);
  box-shadow: 0 6px 0 var(--pp-text), 0 -6px 0 var(--pp-text);
}

[data-theme="dark"] .pp-nav.is-open .pp-nav__list,
:root.dark-mode .pp-nav.is-open .pp-nav__list {
  background: var(--pp-surface-elevated);
  border-top: 1px solid var(--pp-border);
}

/* Mega menu */
[data-theme="dark"] .pp-nav--mega .sub-menu,
:root.dark-mode .pp-nav--mega .sub-menu {
  background: var(--pp-surface-elevated);
  border: 1px solid var(--pp-border);
}

/* Toolbar controls */
[data-theme="dark"] .pp-search-toggle,
[data-theme="dark"] .pp-dark-toggle,
[data-theme="dark"] .pp-lang-switcher,
:root.dark-mode .pp-search-toggle,
:root.dark-mode .pp-dark-toggle,
:root.dark-mode .pp-lang-switcher {
  background: var(--pp-surface);
  color: var(--pp-text);
  border-color: var(--pp-border);
}

[data-theme="dark"] .pp-lang-switcher__item,
:root.dark-mode .pp-lang-switcher__item {
  color: var(--pp-text-muted);
}

[data-theme="dark"] .pp-lang-switcher__item.is-active,
:root.dark-mode .pp-lang-switcher__item.is-active {
  background: var(--pp-primary);
  color: #fff;
}

/* Cards & surfaces */
[data-theme="dark"] .pp-card,
[data-theme="dark"] .pp-widget,
[data-theme="dark"] .pp-toc,
[data-theme="dark"] .pp-reviewer-card,
[data-theme="dark"] .pp-accordion__item,
[data-theme="dark"] .pp-demo-card,
[data-theme="dark"] .pp-sticky-share,
[data-theme="dark"] .pp-payment-list li,
:root.dark-mode .pp-card,
:root.dark-mode .pp-widget,
:root.dark-mode .pp-toc,
:root.dark-mode .pp-reviewer-card,
:root.dark-mode .pp-accordion__item,
:root.dark-mode .pp-demo-card,
:root.dark-mode .pp-sticky-share,
:root.dark-mode .pp-payment-list li {
  background: var(--pp-surface);
  border-color: var(--pp-border);
}

[data-theme="dark"] .pp-card__title a,
[data-theme="dark"] .pp-hero__title a,
:root.dark-mode .pp-card__title a,
:root.dark-mode .pp-hero__title a {
  color: var(--pp-text);
}

[data-theme="dark"] .pp-card__excerpt,
[data-theme="dark"] .pp-meta,
[data-theme="dark"] .pp-hero__excerpt,
:root.dark-mode .pp-card__excerpt,
:root.dark-mode .pp-meta,
:root.dark-mode .pp-hero__excerpt {
  color: var(--pp-text-muted);
}

[data-theme="dark"] .pp-card:hover,
:root.dark-mode .pp-card:hover {
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

/* Hero */
[data-theme="dark"] .pp-hero__card,
:root.dark-mode .pp-hero__card {
  background: var(--pp-surface);
  border-color: var(--pp-border);
}

[data-theme="dark"] .pp-hero__placeholder,
:root.dark-mode .pp-hero__placeholder {
  background: var(--pp-surface);
  border-color: var(--pp-border);
}

/* Chips & badges */
[data-theme="dark"] .pp-chip,
:root.dark-mode .pp-chip {
  background: var(--pp-surface);
  color: var(--pp-text);
  border-color: var(--pp-border);
}

[data-theme="dark"] .pp-score-badge,
:root.dark-mode .pp-score-badge {
  background: var(--pp-surface-elevated);
  color: var(--pp-text);
}

/* Forms & inputs */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
:root.dark-mode input,
:root.dark-mode select,
:root.dark-mode textarea {
  background: var(--pp-input-bg);
  color: var(--pp-text);
  border-color: var(--pp-border-strong);
}

[data-theme="dark"] .pp-btn--ghost,
:root.dark-mode .pp-btn--ghost {
  color: var(--pp-text);
  border-color: var(--pp-border-strong);
}

[data-theme="dark"] .pp-btn--ghost:hover,
:root.dark-mode .pp-btn--ghost:hover {
  background: var(--pp-surface-elevated);
}

/* Newsletter / sponsor / about */
[data-theme="dark"] .pp-newsletter-card,
[data-theme="dark"] .pp-sponsor-card,
[data-theme="dark"] .pp-about-card,
:root.dark-mode .pp-newsletter-card,
:root.dark-mode .pp-sponsor-card,
:root.dark-mode .pp-about-card {
  background: linear-gradient(135deg, rgba(43, 182, 115, 0.08), rgba(11, 110, 79, 0.12));
  border-color: var(--pp-border);
}

/* Search */
[data-theme="dark"] .pp-search-modal__backdrop,
:root.dark-mode .pp-search-modal__backdrop {
  background: rgba(0, 0, 0, 0.65);
}

[data-theme="dark"] .pp-search-modal__panel,
:root.dark-mode .pp-search-modal__panel {
  background: var(--pp-surface-elevated);
}

[data-theme="dark"] .pp-search-results__list li a,
:root.dark-mode .pp-search-results__list li a {
  border-bottom-color: var(--pp-border);
  color: var(--pp-text);
}

[data-theme="dark"] .pp-search-filters select,
:root.dark-mode .pp-search-filters select {
  background: var(--pp-input-bg);
  color: var(--pp-text);
  border-color: var(--pp-border-strong);
}

/* Breadcrumbs & pagination */
[data-theme="dark"] .pp-breadcrumbs,
:root.dark-mode .pp-breadcrumbs {
  color: var(--pp-text-muted);
}

[data-theme="dark"] .page-numbers,
:root.dark-mode .page-numbers {
  background: var(--pp-surface);
  color: var(--pp-text);
}

[data-theme="dark"] .page-numbers.current,
:root.dark-mode .page-numbers.current {
  background: var(--pp-primary);
  color: #fff;
}

/* Content blocks */
[data-theme="dark"] .pp-review-verdict,
[data-theme="dark"] .pp-methodology,
[data-theme="dark"] .pp-author-box,
:root.dark-mode .pp-review-verdict,
:root.dark-mode .pp-methodology,
:root.dark-mode .pp-author-box {
  background: rgba(43, 182, 115, 0.08);
}

[data-theme="dark"] .pp-pros-cons__col--pros,
:root.dark-mode .pp-pros-cons__col--pros {
  background: rgba(43, 182, 115, 0.1);
}

[data-theme="dark"] .pp-pros-cons__col--cons,
:root.dark-mode .pp-pros-cons__col--cons {
  background: rgba(239, 68, 68, 0.12);
}

[data-theme="dark"] .pp-rating-breakdown__bar,
:root.dark-mode .pp-rating-breakdown__bar {
  background: var(--pp-border);
}

[data-theme="dark"] .pp-ad-placeholder,
:root.dark-mode .pp-ad-placeholder {
  background: var(--pp-surface);
  border-color: var(--pp-border-strong);
  color: var(--pp-text-muted);
}

/* Footer stays dark in both modes — lighten text slightly */
[data-theme="dark"] .pp-footer,
:root.dark-mode .pp-footer {
  background: #020617;
}

[data-theme="dark"] .pp-footer__legal,
:root.dark-mode .pp-footer__legal {
  border-top-color: var(--pp-border);
}

/* 404 */
[data-theme="dark"] .pp-404,
[data-theme="dark"] .pp-empty,
:root.dark-mode .pp-404,
:root.dark-mode .pp-empty {
  color: var(--pp-text);
}

/* Tables (WP blocks) */
[data-theme="dark"] .pp-content table,
[data-theme="dark"] .pp-content th,
[data-theme="dark"] .pp-content td,
:root.dark-mode .pp-content table,
:root.dark-mode .pp-content th,
:root.dark-mode .pp-content td {
  border-color: var(--pp-border);
}

[data-theme="dark"] .pp-content th,
:root.dark-mode .pp-content th {
  background: var(--pp-surface-elevated);
}

@media (prefers-reduced-motion: reduce) {
  html.pp-theme-ready body,
  html.pp-theme-ready .pp-header,
  html.pp-theme-ready .pp-card {
    transition: none !important;
  }
}

/* Flagship demo — dark mode section surfaces */
[data-theme="dark"] .pp-demo-research .pp-section--surface,
:root.dark-mode .pp-demo-research .pp-section--surface {
  background: color-mix(in srgb, var(--pp-primary) 8%, var(--pp-bg));
  border-block-color: var(--pp-border);
}

[data-theme="dark"] .pp-demo-research .pp-hero__content,
:root.dark-mode .pp-demo-research .pp-hero__content {
  background: linear-gradient(180deg, var(--pp-surface) 0%, color-mix(in srgb, var(--pp-primary) 8%, var(--pp-surface)) 100%);
}

[data-theme="dark"] .pp-demo-research .pp-logo__svg,
:root.dark-mode .pp-demo-research .pp-logo__svg {
  color: var(--pp-accent);
}
