/* AIVE shared day/night theme layer · 2026-07-05
   One switch, one localStorage key, all public AIVE pages. */
:root,
html[data-theme="dark"] {
  color-scheme: dark;
}
html[data-theme="light"] {
  color-scheme: light;
  --bg: #f5f8ff;
  --bg-secondary: #eaf0fb;
  --card-bg: rgba(255,255,255,.86);
  --glass-bg: rgba(255,255,255,.78);
  --glass-border: rgba(15,23,42,.10);
  --text: #0f172a;
  --text-secondary: #475569;
  --text-muted: #64748b;
  --border: #d7e0ee;
  --border-light: #e8eef7;
  --shadow-sm: 0 1px 3px rgba(15,23,42,.06);
  --shadow: 0 10px 34px rgba(15,23,42,.08);
  --shadow-lg: 0 22px 70px rgba(15,23,42,.12);
  --aive-bg-0: #f6f9ff;
  --aive-bg-1: #e9f1fb;
  --aive-panel: rgba(255,255,255,.78);
  --aive-panel-strong: rgba(255,255,255,.92);
  --aive-line: rgba(15,23,42,.12);
  --aive-line-strong: rgba(37,99,235,.26);
  --aive-text: #0f172a;
  --aive-muted: #475569;
  --aive-soft: #64748b;
  --auth-bg-0: #f6f9ff;
  --auth-bg-1: #edf4ff;
  --auth-panel: rgba(255,255,255,.82);
  --auth-panel-2: rgba(255,255,255,.64);
  --auth-line: rgba(15,23,42,.12);
  --auth-line-strong: rgba(37,99,235,.28);
  --auth-text: #0f172a;
  --auth-dim: #52647a;
}
.theme-toggle,
.theme-toggle:button {
  appearance: none;
}
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  padding: 8px 13px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,.18);
  background: rgba(255,255,255,.045);
  color: #dbeafe;
  font: 700 13px/1 Inter, 'Noto Sans SC', system-ui, sans-serif;
  letter-spacing: .02em;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
  white-space: nowrap;
}
.theme-toggle:hover { transform: translateY(-1px); border-color: rgba(103,232,249,.36); color: #fff; }
.theme-toggle-mark {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: linear-gradient(135deg,#dfe4ff,#47d5ff);
  color: #020617;
  font-size: 12px;
  font-weight: 900;
}
.theme-menu-item { display: none; }
.theme-menu-item .theme-toggle { width: 100%; justify-content: flex-start; }
html[data-theme="light"] .theme-toggle {
  background: rgba(255,255,255,.82);
  border-color: rgba(15,23,42,.12);
  color: #0f172a;
  box-shadow: 0 8px 26px rgba(15,23,42,.08);
}
html[data-theme="light"] .theme-toggle:hover { border-color: rgba(37,99,235,.26); color: #020617; }
html[data-theme="light"] .theme-toggle-mark { background: linear-gradient(135deg,#111827,#2563eb); color: #fff; }
html[data-theme="light"] body,
html[data-theme="light"] body.aive-image-page,
html[data-theme="light"] body.aive-auth-page {
  background:
    radial-gradient(circle at 12% 0%, rgba(59,130,246,.14), transparent 32%),
    radial-gradient(circle at 88% 2%, rgba(6,182,212,.12), transparent 30%),
    linear-gradient(135deg,#f7fbff,#edf4ff 48%,#f8fbff) !important;
  color: #0f172a !important;
}
html[data-theme="light"] body::before,
html[data-theme="light"] body.aive-auth-page::before {
  background:
    linear-gradient(rgba(15,23,42,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,23,42,.045) 1px, transparent 1px),
    radial-gradient(circle at 50% 0, rgba(37,99,235,.08), transparent 42%) !important;
  opacity: .78 !important;
}
html[data-theme="light"] #main-header,
html[data-theme="light"] body.aive-image-page header {
  background: rgba(255,255,255,.78) !important;
  border-bottom-color: rgba(15,23,42,.10) !important;
  box-shadow: 0 12px 36px rgba(15,23,42,.08) !important;
}
html[data-theme="light"] #main-header.scrolled { background: rgba(255,255,255,.94) !important; }
html[data-theme="light"] .nav-logo,
html[data-theme="light"] .nav-brand-text strong,
html[data-theme="light"] .nav-menu > li > a:hover,
html[data-theme="light"] .nav-menu > li > a.active,
html[data-theme="light"] body.aive-image-page .nav-links a:hover,
html[data-theme="light"] body.aive-image-page .nav-links a.active { color: #0f172a !important; }
html[data-theme="light"] .nav-menu > li > a,
html[data-theme="light"] body.aive-image-page .nav-links a,
html[data-theme="light"] .nav-brand-text small { color: #52647a !important; }
html[data-theme="light"] .nav-mobile-toggle span { background: #0f172a !important; }
html[data-theme="light"] .hero-fullscreen,
html[data-theme="light"] .aive-hero {
  background:
    radial-gradient(circle at 50% 14%, rgba(37,99,235,.13), transparent 38%),
    radial-gradient(circle at 35% 55%, rgba(6,182,212,.10), transparent 32%),
    #f7fbff !important;
}
html[data-theme="light"] .hero-title,
html[data-theme="light"] .hero-stat-num,
html[data-theme="light"] .section-title,
html[data-theme="light"] .workspace-section > .container > h2,
html[data-theme="light"] .workspace-section > h2,
html[data-theme="light"] .tools-page h1,
html[data-theme="light"] .blog-page h1,
html[data-theme="light"] .mp-page h1,
html[data-theme="light"] .mp-info h2,
html[data-theme="light"] .mp-section-title,
html[data-theme="light"] .mp-service-card strong,
html[data-theme="light"] .page-header h1,
html[data-theme="light"] .tool-item h3,
html[data-theme="light"] .blog-card h2,
html[data-theme="light"] .tutorial-card h3,
html[data-theme="light"] .feature-card h3,
html[data-theme="light"] .bridge-copy h2,
html[data-theme="light"] .bridge-card strong,
html[data-theme="light"] .wechat-profile-card h2,
html[data-theme="light"] .wechat-meta-grid strong,
html[data-theme="light"] .wechat-latest-list strong,
html[data-theme="light"] .article-item .art-title,
html[data-theme="light"] .aive-auth-page .card h1 { color: #0f172a !important; }
html[data-theme="light"] .hero-title-accent,
html[data-theme="light"] body.aive-image-page .hero h1 {
  background: linear-gradient(100deg,#0f172a 0%,#2563eb 42%,#0891b2 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}
html[data-theme="light"] .hero-subtitle,
html[data-theme="light"] .hero-stat-label,
html[data-theme="light"] .section-desc,
html[data-theme="light"] .tools-page .subtitle,
html[data-theme="light"] .blog-page .subtitle,
html[data-theme="light"] .mp-page .subtitle,
html[data-theme="light"] .tool-desc,
html[data-theme="light"] .blog-card p,
html[data-theme="light"] .blog-card .meta,
html[data-theme="light"] .tutorial-card p,
html[data-theme="light"] .tutorial-card .meta,
html[data-theme="light"] .page-header p,
html[data-theme="light"] .bridge-copy p,
html[data-theme="light"] .wechat-meta-grid small,
html[data-theme="light"] body.aive-image-page .hero p,
html[data-theme="light"] .aive-auth-page .back-link,
html[data-theme="light"] .aive-auth-page .helper,
html[data-theme="light"] .aive-auth-page .terms,
html[data-theme="light"] .mp-info .account,
html[data-theme="light"] .mp-info .desc,
html[data-theme="light"] .article-item .art-meta,
html[data-theme="light"] .tip-box,
html[data-theme="light"] .mp-service-card span { color: #52647a !important; }
html[data-theme="light"] .feature-card,
html[data-theme="light"] .bridge-card,
html[data-theme="light"] .wechat-profile-card,
html[data-theme="light"] .wechat-article-panel,
html[data-theme="light"] .wechat-qr-box,
html[data-theme="light"] .wechat-meta-grid span,
html[data-theme="light"] .wechat-latest-list a,
html[data-theme="light"] .tool-item,
html[data-theme="light"] .blog-card,
html[data-theme="light"] .tutorial-card,
html[data-theme="light"] .mp-header,
html[data-theme="light"] .mp-service-card,
html[data-theme="light"] .article-item,
html[data-theme="light"] .tip-box,
html[data-theme="light"] .mp-article,
html[data-theme="light"] .info-card,
html[data-theme="light"] .record-item,
html[data-theme="light"] .tabs,
html[data-theme="light"] .tool-panel,
html[data-theme="light"] .credits-bar,
html[data-theme="light"] .model-intro,
html[data-theme="light"] .result-card,
html[data-theme="light"] .history-item,
html[data-theme="light"] .input-panel,
html[data-theme="light"] .output-panel,
html[data-theme="light"] .material-sidebar,
html[data-theme="light"] .material-content,
html[data-theme="light"] .writing-sidebar,
html[data-theme="light"] .writing-input,
html[data-theme="light"] .writing-output,
html[data-theme="light"] .check-input-area,
html[data-theme="light"] .check-output-area,
html[data-theme="light"] .hotspot-container,
html[data-theme="light"] .tab-content,
html[data-theme="light"] .aive-auth-page .card {
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: #0f172a !important;
  box-shadow: 0 18px 52px rgba(15,23,42,.08) !important;
}
html[data-theme="light"] .workspace-tabs,
html[data-theme="light"] .category-tab,
html[data-theme="light"] .blog-filters .filter-btn,
html[data-theme="light"] .blog-pagination .page-btn,
html[data-theme="light"] body.aive-image-page .type-btn,
html[data-theme="light"] body.aive-image-page .style-btn,
html[data-theme="light"] body.aive-image-page .example-chip {
  background: rgba(255,255,255,.62) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: #52647a !important;
}
html[data-theme="light"] .category-tab.active,
html[data-theme="light"] .blog-filters .filter-btn.active,
html[data-theme="light"] .blog-pagination .page-btn.active,
html[data-theme="light"] .tab.active,
html[data-theme="light"] body.aive-image-page .type-btn.active,
html[data-theme="light"] body.aive-image-page .style-btn.active {
  background: linear-gradient(135deg,#2563eb,#0891b2) !important;
  color: #fff !important;
}
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select,
html[data-theme="light"] .blog-search input,
html[data-theme="light"] .aive-auth-page input {
  background: rgba(255,255,255,.80) !important;
  border-color: rgba(15,23,42,.12) !important;
  color: #0f172a !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #94a3b8 !important; }
html[data-theme="light"] .btn-outline,
html[data-theme="light"] .action-btn,
html[data-theme="light"] body.aive-image-page .ghost {
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(15,23,42,.12) !important;
  color: #0f172a !important;
}
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .generate-btn,
html[data-theme="light"] .btn-generate,
html[data-theme="light"] body.aive-image-page .primary {
  background: linear-gradient(135deg,#2563eb,#38bdf8) !important;
  color: #fff !important;
}
/* Light-mode completion for homepage/product components · 2026-07-05 */
html[data-theme="light"] .aive-stack-panel {
  background: linear-gradient(160deg, rgba(255,255,255,.92), rgba(236,245,255,.76)) !important;
  border-color: rgba(15,23,42,.12) !important;
  box-shadow: 0 24px 72px rgba(15,23,42,.12) !important;
}
html[data-theme="light"] .panel-topbar {
  color: #52647a !important;
  border-bottom-color: rgba(15,23,42,.10) !important;
  background: rgba(255,255,255,.44) !important;
}
html[data-theme="light"] .stack-item {
  background: rgba(255,255,255,.78) !important;
  border-color: rgba(15,23,42,.10) !important;
}
html[data-theme="light"] .stack-item:hover,
html[data-theme="light"] .stack-item.active {
  background: linear-gradient(135deg, rgba(37,99,235,.08), rgba(6,182,212,.08)) !important;
  border-color: rgba(37,99,235,.24) !important;
}
html[data-theme="light"] .stack-code,
html[data-theme="light"] .wechat-latest-list span {
  background: rgba(37,99,235,.08) !important;
  color: #2563eb !important;
}
html[data-theme="light"] .stack-item strong,
html[data-theme="light"] .wechat-qr-box strong,
html[data-theme="light"] .yh-footer-brand,
html[data-theme="light"] .footer-brand-area .footer-brand,
html[data-theme="light"] .footer-col h4 {
  color: #0f172a !important;
}
html[data-theme="light"] .stack-item p,
html[data-theme="light"] .bridge-card small,
html[data-theme="light"] .wechat-profile-card p,
html[data-theme="light"] .wechat-qr-box small,
html[data-theme="light"] .footer-brand-area p,
html[data-theme="light"] .footer-col a,
html[data-theme="light"] .footer-bottom,
html[data-theme="light"] .footer-bottom p,
html[data-theme="light"] .aive-yh-footer .footer-bottom,
html[data-theme="light"] .aive-yh-footer .footer-bottom a {
  color: #52647a !important;
}
html[data-theme="light"] .bridge-shell,
html[data-theme="light"] .wechat-qr-box,
html[data-theme="light"] .wechat-latest-list a,
html[data-theme="light"] .empty-state {
  background: rgba(255,255,255,.74) !important;
  border-color: rgba(15,23,42,.10) !important;
  color: #52647a !important;
}
html[data-theme="light"] .empty-state span,
html[data-theme="light"] .empty-state p { color: #64748b !important; }
html[data-theme="light"] .site-footer,
html[data-theme="light"] .aive-yh-footer {
  background: linear-gradient(180deg, rgba(241,247,255,.82), rgba(232,240,252,.96)) !important;
  border-top-color: rgba(15,23,42,.08) !important;
}
html[data-theme="light"] .aive-yh-footer .footer-bottom {
  border-top-color: rgba(15,23,42,.10) !important;
}

@media (max-width: 768px) {
  .theme-menu-item { display: block; }
  .theme-menu-item .theme-toggle { margin: 8px 0 2px; }
  #main-header .nav-right .theme-toggle { display: none !important; }
}

/* Mobile light-mode nav correction · 2026-07-05 */
@media (max-width: 760px) {
  html[data-theme="light"] #main-header .nav-menu,
  html[data-theme="light"] body.aive-image-page .nav-links {
    background: #ffffff !important;
    border-color: rgba(15,23,42,.12) !important;
    box-shadow: 0 22px 64px rgba(15,23,42,.16) !important;
  }
  html[data-theme="light"] #main-header .nav-menu > li > a,
  html[data-theme="light"] body.aive-image-page .nav-links > a {
    color: #1f2937 !important;
    background: transparent !important;
  }
  html[data-theme="light"] #main-header .nav-menu > li > a:hover,
  html[data-theme="light"] body.aive-image-page .nav-links > a:hover,
  html[data-theme="light"] body.aive-image-page .nav-links > a.active {
    color: #0f172a !important;
    background: rgba(37,99,235,.08) !important;
  }
  html[data-theme="light"] #main-header .nav-menu .theme-toggle,
  html[data-theme="light"] body.aive-image-page .nav-links .theme-toggle {
    background: #ffffff !important;
    border-color: rgba(15,23,42,.14) !important;
    color: #0f172a !important;
    box-shadow: 0 10px 26px rgba(15,23,42,.10) !important;
  }
  html[data-theme="light"] body.aive-image-page .nav-links .nav-cta {
    background: linear-gradient(135deg,#2563eb,#38bdf8) !important;
    color: #fff !important;
    border-color: transparent !important;
  }
}
