/* MotorHub experimental theme — day/night palette */

/* GeneratePress dynamic CSS uses these vars on body, header, cards, etc. */
html[data-mh-theme="dark"] {
  color-scheme: dark;
  --contrast: #e6e6e6;
  --contrast-2: #a8a8a8;
  --contrast-3: #6a6a6a;
  --base: #121212;
  --base-2: #1e1e1e;
  --base-3: #2a2a2a;
  --accent: #5eb3ff;
  --mh-bg: #121212;
  --mh-surface: #1e1e1e;
  --mh-surface-2: #2a2a2a;
  --mh-text: #e6e6e6;
  --mh-text-muted: #a8a8a8;
  --mh-border: #3a3a3a;
  --mh-accent: #5eb3ff;
  --mh-link: #7ec8ff;
  --mh-cta-bg: #1a2836;
  --mh-cta-border: #5eb3ff;
}

/* OS dark (Safari/macOS): works even if inline script is blocked or delayed */
@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) {
    color-scheme: dark;
    --contrast: #e6e6e6;
    --contrast-2: #a8a8a8;
    --contrast-3: #6a6a6a;
    --base: #121212;
    --base-2: #1e1e1e;
    --base-3: #2a2a2a;
    --accent: #5eb3ff;
    --mh-bg: #121212;
    --mh-surface: #1e1e1e;
    --mh-surface-2: #2a2a2a;
    --mh-text: #e6e6e6;
    --mh-text-muted: #a8a8a8;
    --mh-border: #3a3a3a;
    --mh-accent: #5eb3ff;
    --mh-link: #7ec8ff;
    --mh-cta-bg: #1a2836;
    --mh-cta-border: #5eb3ff;
  }
}

html[data-mh-theme="dark"] body {
  background-color: var(--mh-bg);
  color: var(--mh-text);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) body {
    background-color: var(--mh-bg);
    color: var(--mh-text);
  }
}

html[data-mh-theme="dark"] a {
  color: var(--mh-link);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) a {
    color: var(--mh-link);
  }
}

html[data-mh-theme="dark"] a:hover,
html[data-mh-theme="dark"] a:focus {
  color: var(--mh-text);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) a:hover,
  html:not([data-mh-theme="light"]) a:focus {
    color: var(--mh-text);
  }
}

html[data-mh-theme="dark"] .site-header,
html[data-mh-theme="dark"] .main-navigation,
html[data-mh-theme="dark"] .main-navigation ul ul,
html[data-mh-theme="dark"] .separate-containers .inside-article,
html[data-mh-theme="dark"] .separate-containers .comments-area,
html[data-mh-theme="dark"] .separate-containers .page-header,
html[data-mh-theme="dark"] .inside-page-header,
html[data-mh-theme="dark"] .sidebar .widget,
html[data-mh-theme="dark"] .footer-widgets,
html[data-mh-theme="dark"] .site-info,
html[data-mh-theme="dark"] .paging-navigation {
  background-color: var(--mh-surface) !important;
  color: var(--mh-text);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .site-header,
  html:not([data-mh-theme="light"]) .main-navigation,
  html:not([data-mh-theme="light"]) .main-navigation ul ul,
  html:not([data-mh-theme="light"]) .separate-containers .inside-article,
  html:not([data-mh-theme="light"]) .separate-containers .comments-area,
  html:not([data-mh-theme="light"]) .separate-containers .page-header,
  html:not([data-mh-theme="light"]) .inside-page-header,
  html:not([data-mh-theme="light"]) .sidebar .widget,
  html:not([data-mh-theme="light"]) .footer-widgets,
  html:not([data-mh-theme="light"]) .site-info,
  html:not([data-mh-theme="light"]) .paging-navigation {
    background-color: var(--mh-surface) !important;
    color: var(--mh-text);
  }
}

html[data-mh-theme="dark"] .main-title a,
html[data-mh-theme="dark"] .entry-title a,
html[data-mh-theme="dark"] .main-navigation a {
  color: var(--mh-text);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .main-title a,
  html:not([data-mh-theme="light"]) .entry-title a,
  html:not([data-mh-theme="light"]) .main-navigation a {
    color: var(--mh-text);
  }
}

html[data-mh-theme="dark"] .entry-meta,
html[data-mh-theme="dark"] .site-description,
html[data-mh-theme="dark"] .motorhub-source {
  color: var(--mh-text-muted) !important;
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .entry-meta,
  html:not([data-mh-theme="light"]) .site-description,
  html:not([data-mh-theme="light"]) .motorhub-source {
    color: var(--mh-text-muted) !important;
  }
}

html[data-mh-theme="dark"] input[type="text"],
html[data-mh-theme="dark"] input[type="search"],
html[data-mh-theme="dark"] input[type="email"],
html[data-mh-theme="dark"] textarea,
html[data-mh-theme="dark"] select {
  background-color: var(--mh-surface-2);
  border-color: var(--mh-border);
  color: var(--mh-text);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) input[type="text"],
  html:not([data-mh-theme="light"]) input[type="search"],
  html:not([data-mh-theme="light"]) input[type="email"],
  html:not([data-mh-theme="light"]) textarea,
  html:not([data-mh-theme="light"]) select {
    background-color: var(--mh-surface-2);
    border-color: var(--mh-border);
    color: var(--mh-text);
  }
}

html[data-mh-theme="dark"] .motorhub-cta {
  background: var(--mh-cta-bg) !important;
  border-left-color: var(--mh-cta-border) !important;
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .motorhub-cta {
    background: var(--mh-cta-bg) !important;
    border-left-color: var(--mh-cta-border) !important;
  }
}

html[data-mh-theme="dark"] .mh-theme-toggle {
  background: var(--mh-surface-2);
  border-color: var(--mh-border);
  color: var(--mh-text);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-theme-toggle {
    background: var(--mh-surface-2);
    border-color: var(--mh-border);
    color: var(--mh-text);
  }
}

html[data-mh-theme="dark"] .mh-theme-toggle:hover,
html[data-mh-theme="dark"] .mh-theme-toggle:focus {
  background: var(--mh-surface);
  border-color: var(--mh-accent);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-theme-toggle:hover,
  html:not([data-mh-theme="light"]) .mh-theme-toggle:focus {
    background: var(--mh-surface);
    border-color: var(--mh-accent);
  }
}

html[data-mh-theme="dark"] #mh-lang-banner {
  background: var(--mh-surface);
  color: var(--mh-text);
  border-color: var(--mh-border);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) #mh-lang-banner {
    background: var(--mh-surface);
    color: var(--mh-text);
    border-color: var(--mh-border);
  }
}

/* Lang switcher uses hardcoded #fff in mu-plugin inline CSS */
html[data-mh-theme="dark"] .mh-lang-switcher__toggle,
html[data-mh-theme="dark"] .mh-lang-switcher__menu {
  background: #1e1e2e;
  border-color: rgba(255, 255, 255, 0.14);
  color: #eee;
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-lang-switcher__toggle,
  html:not([data-mh-theme="light"]) .mh-lang-switcher__menu {
    background: #1e1e2e;
    border-color: rgba(255, 255, 255, 0.14);
    color: #eee;
  }
}

html[data-mh-theme="dark"] .mh-lang-switcher__item a:hover,
html[data-mh-theme="dark"] .mh-lang-switcher__item a:focus-visible {
  background: rgba(96, 165, 250, 0.12);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-lang-switcher__item a:hover,
  html:not([data-mh-theme="light"]) .mh-lang-switcher__item a:focus-visible {
    background: rgba(96, 165, 250, 0.12);
  }
}

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

/* Smooth day/night switch (toggle + OS preference); skipped when reduced motion. */
@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-duration: 0.42s;
    animation-timing-function: ease-in-out;
  }

  html.mh-theme-animate body,
  html.mh-theme-animate .site-header,
  html.mh-theme-animate .main-navigation,
  html.mh-theme-animate .main-navigation ul ul,
  html.mh-theme-animate .inside-article,
  html.mh-theme-animate .comments-area,
  html.mh-theme-animate .page-header,
  html.mh-theme-animate .inside-page-header,
  html.mh-theme-animate .sidebar .widget,
  html.mh-theme-animate .footer-widgets,
  html.mh-theme-animate .site-info,
  html.mh-theme-animate .paging-navigation,
  html.mh-theme-animate .motorhub-cta,
  html.mh-theme-animate #mh-lang-banner,
  html.mh-theme-animate a {
    transition:
      background-color 0.42s ease,
      color 0.42s ease,
      border-color 0.42s ease,
      box-shadow 0.42s ease;
  }
}

.mh-theme-toggle {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 9999;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid #ccc;
  border-radius: 999px;
  background: #fff;
  color: #222;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
  font-size: 1.25rem;
  line-height: 1;
}

.mh-theme-toggle__icon {
  transition: opacity 0.28s ease, transform 0.38s ease;
}

html[data-mh-theme="light"] .mh-theme-toggle__icon--light {
  transform: rotate(0deg);
}

html[data-mh-theme="dark"] .mh-theme-toggle__icon--dark {
  transform: rotate(0deg);
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-theme-toggle__icon--dark {
    transform: rotate(0deg);
  }
}

.mh-theme-toggle .mh-theme-toggle__icon--dark {
  display: none;
}

html[data-mh-theme="dark"] .mh-theme-toggle .mh-theme-toggle__icon--light {
  display: none;
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-theme-toggle .mh-theme-toggle__icon--light {
    display: none;
  }
}

html[data-mh-theme="dark"] .mh-theme-toggle .mh-theme-toggle__icon--dark {
  display: inline;
}

@media (prefers-color-scheme: dark) {
  html:not([data-mh-theme="light"]) .mh-theme-toggle .mh-theme-toggle__icon--dark {
    display: inline;
  }
}

@media (max-width: 768px) {
  .mh-theme-toggle {
    right: 0.75rem;
    bottom: 0.75rem;
  }
}