/* Opt-in main-site appearance. Tool runtimes do not load this stylesheet. */
:root[data-site-theme="light"] {
  color-scheme: light;
  --canvas: #f7f8fa;
  --page-bg: #f7f8fa;
  --surface: #ffffff;
  --surface-muted: #f0f2f5;
  --surface-strong: #e3e7ed;
  --surface-elevated: #ffffff;
  --text: #263244;
  --text-strong: #172131;
  --text-muted: #526071;
  --text-subtle: #626f80;
  --border: #d2d8e1;
  --border-strong: #8995a5;
  --accent-secondary: #ad4225;
  --accent-secondary-bright: #a53f20;
  --accent-soft: rgba(150, 102, 0, 0.09);
  --accent-secondary-soft: rgba(173, 66, 37, 0.08);
  --focus-ring: #966600;
  --danger: #b42332;
  --warning: #795300;
  --success: #216e39;
  --shadow-card: 0 1px 2px rgba(31, 41, 55, 0.06), 0 6px 20px rgba(31, 41, 55, 0.08);
  --shadow-float: 0 12px 32px rgba(31, 41, 55, 0.16), 0 2px 8px rgba(31, 41, 55, 0.1);
  --shadow-accent: 0 12px 42px rgba(150, 102, 0, 0.05);
  --site-accent-text: #805700;
  --site-on-accent: #0e0e0e;
}

:root[data-site-theme] .navbar .nav-right {
  margin-left: auto;
}

:root[data-site-theme] .navbar .site-theme-toggle {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin-left: 0.65rem;
  padding: 0.5rem 0.75rem;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-control);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.2;
}

:root[data-site-theme] .site-theme-toggle[aria-checked="true"] {
  color: #0e0e0e;
  background: #ffc931;
  border-color: #966600;
}

:root[data-site-theme] .site-theme-toggle:hover {
  outline: 1px solid var(--focus-ring);
  outline-offset: 1px;
}

:root[data-site-theme="light"] body:not(.crawl-viewer) > header,
:root[data-site-theme="light"] .site-header {
  background: rgba(255, 255, 255, 0.94);
  border-bottom-color: var(--border);
  box-shadow: 0 6px 22px rgba(31, 41, 55, 0.08);
}

:root[data-site-theme="light"] .page-outline,
:root[data-site-theme="light"] #backToTop,
:root[data-site-theme="light"] .cookie-card,
:root[data-site-theme="light"] .feature-list li,
:root[data-site-theme="light"] .page-home #principles .section-media a,
:root[data-site-theme="light"].js body:not(.crawl-viewer) .nav-right {
  background: var(--surface);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) .btn--secondary {
  color: var(--text);
  background: var(--surface);
  border-color: var(--border-strong);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) .btn--secondary:hover {
  color: var(--site-accent-text);
  background: var(--surface-muted);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) .section + .section {
  border-top-color: var(--border);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) footer,
:root[data-site-theme="light"] body:not(.crawl-viewer) .site-footer {
  background: var(--surface);
}

:root[data-site-theme="light"] .guide-code,
:root[data-site-theme="light"] .guide-table-wrap,
:root[data-site-theme="light"] .guide-source-group,
:root[data-site-theme="light"] .guide-toc,
:root[data-site-theme="light"] .product-demo-frame,
:root[data-site-theme="light"] body:not(.crawl-viewer) .post-thumb {
  background: var(--surface-muted);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) code,
:root[data-site-theme="light"] .guide-code code {
  color: var(--text);
  border-color: var(--border);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) pre {
  color: var(--text);
  background: var(--surface-muted);
  border-color: var(--border);
}

:root[data-site-theme="light"] .guide-table th,
:root[data-site-theme="light"] .guide-table td,
:root[data-site-theme="light"] .guide-toc summary,
:root[data-site-theme="light"] .guide-source-group summary {
  color: var(--text);
}

/* Retained legal-page examples carry their original dark background inline. */
:root[data-site-theme="light"] pre[style] {
  background: var(--surface-muted) !important;
  border-color: var(--border) !important;
}

:root[data-site-theme="light"] .log-table thead th {
  background: var(--surface-muted);
}

/* Keep photographic heroes readable while the rest of the page becomes light. */
:root[data-site-theme="light"] .hero--image {
  --canvas: #0e0e0e;
  --text: #e5e5e5;
  --text-strong: #ffffff;
  --text-muted: #d2d8e1;
  --site-accent-text: #ffc931;
}

@media (max-width: 1000px) {
  :root[data-site-theme] .site-theme-toggle__label {
    display: none;
  }
}

/* Preserve yellow fills while giving accent text adequate light-mode contrast. */
:root[data-site-theme="light"] body:not(.crawl-viewer) ::selection,
:root[data-site-theme="light"] .skip-link,
:root[data-site-theme="light"] .skip-link:focus,
:root[data-site-theme="light"] body:not(.crawl-viewer) .btn,
:root[data-site-theme="light"] body:not(.crawl-viewer) .btn:hover,
:root[data-site-theme="light"] .log-filters button[type="submit"],
:root[data-site-theme="light"] .freshness-apply,
:root[data-site-theme="light"] #backToTop:hover {
  color: var(--site-on-accent);
}

:root[data-site-theme="light"] body:not(.crawl-viewer) .navbar .nav-right a.active,
:root[data-site-theme="light"] body:not(.crawl-viewer) .navbar .nav-right a[aria-current="page"],
:root[data-site-theme="light"] .site-breadcrumbs a:hover,
:root[data-site-theme="light"] body:not(.crawl-viewer) .section li::marker,
:root[data-site-theme="light"] .step-card::after,
:root[data-site-theme="light"] body:not(.crawl-viewer) .btn--secondary:hover,
:root[data-site-theme="light"] body:not(.crawl-viewer) .post-tag,
:root[data-site-theme="light"] .pricing-amount,
:root[data-site-theme="light"] .article-author .author-role,
:root[data-site-theme="light"] .page-outline summary::after,
:root[data-site-theme="light"] .page-outline a:hover,
:root[data-site-theme="light"] .page-outline a[aria-current="location"],
:root[data-site-theme="light"] .guide-article .section h3,
:root[data-site-theme="light"] .observatory-presets button:hover,
:root[data-site-theme="light"] .observatory-actions button:hover,
:root[data-site-theme="light"] .freshness-range-controls button:hover,
:root[data-site-theme="light"] .freshness-secondary-button:hover,
:root[data-site-theme="light"] .log-stat-total small,
:root[data-site-theme="light"] .freshness-stat-label,
:root[data-site-theme="light"] .footer-brand:hover,
:root[data-site-theme="light"] body:not(.crawl-viewer) .footer-nav a:hover,
:root[data-site-theme="light"] body:not(.crawl-viewer) .social-links a:hover,
:root[data-site-theme="light"] #backToTop {
  color: var(--site-accent-text);
}

:root[data-site-theme="light"] .hero-eyebrow,
:root[data-site-theme="light"] .section-eyebrow,
:root[data-site-theme="light"] .page-kicker {
  color: var(--site-accent-text) !important;
}

/* Legacy article links and dashboard surfaces predate the shared colour tokens. */
:root[data-site-theme="light"] body main a {
  color: var(--site-accent-text);
}

:root[data-site-theme="light"] .log-chart-container,
:root[data-site-theme="light"] .log-summary-card,
:root[data-site-theme="light"] .log-format-card,
:root[data-site-theme="light"] .log-table-wrapper,
:root[data-site-theme="light"] .observatory-methodology,
:root[data-site-theme="light"] .observatory-loading-card {
  color: var(--text);
  background: var(--surface);
  border-color: var(--border);
  box-shadow: var(--shadow-card);
}

:root[data-site-theme="light"] .dashboard-wrapper h2,
:root[data-site-theme="light"] .dashboard-wrapper h3,
:root[data-site-theme="light"] .page-dashboard .log-chart-header h3,
:root[data-site-theme="light"] .page-dashboard .log-summary-section h3,
:root[data-site-theme="light"] .page-dashboard .log-format-section h3,
:root[data-site-theme="light"] .log-format-title,
:root[data-site-theme="light"] .log-format-label {
  color: var(--site-accent-text);
}

:root[data-site-theme="light"] .log-chart-header p,
:root[data-site-theme="light"] .log-chart-note,
:root[data-site-theme="light"] .log-summary-header span,
:root[data-site-theme="light"] .log-summary-pagination,
:root[data-site-theme="light"] .log-summary-empty,
:root[data-site-theme="light"] .log-format-subtitle,
:root[data-site-theme="light"] .log-format-caption,
:root[data-site-theme="light"] .log-format-note,
:root[data-site-theme="light"] .observatory-muted,
:root[data-site-theme="light"] .dashboard-wrapper > p {
  color: var(--text-muted);
}

:root[data-site-theme="light"] .log-table td,
:root[data-site-theme="light"] .log-table th,
:root[data-site-theme="light"] .log-summary-table th,
:root[data-site-theme="light"] .log-summary-table td,
:root[data-site-theme="light"] .log-format-value,
:root[data-site-theme="light"] .ip-expanded {
  color: var(--text);
  border-color: var(--border);
}

:root[data-site-theme="light"] .log-table thead,
:root[data-site-theme="light"] .log-table tbody tr:nth-child(even),
:root[data-site-theme="light"] .log-pagination span.current-page,
:root[data-site-theme="light"] .ip-expanded,
:root[data-site-theme="light"] .ip-badge {
  background: var(--surface-muted);
  border-color: var(--border);
}

:root[data-site-theme="light"] .log-pagination a,
:root[data-site-theme="light"] .log-pagination span.current-page,
:root[data-site-theme="light"] .log-summary-pagination a,
:root[data-site-theme="light"] .observatory-methodology summary,
:root[data-site-theme="light"] .cookie-title,
:root[data-site-theme="light"] .observatory-loading-card h2 {
  color: var(--site-accent-text);
  border-color: var(--border-strong);
}

:root[data-site-theme="light"] .badge-verified {
  color: #216e39;
  background: #e0f1e5;
}

:root[data-site-theme="light"] .badge-unverified {
  color: #b42332;
  background: #fbe4e7;
}

:root[data-site-theme="light"] .badge-unknown {
  color: var(--text-muted);
  background: var(--surface-strong);
}

:root[data-site-theme="light"] .cookie-text,
:root[data-site-theme="light"] .observatory-loading-card p,
:root[data-site-theme="light"] #dashboardActionStatus {
  color: var(--text-muted);
}

:root[data-site-theme="light"] #dashboardActionStatus.is-error,
:root[data-site-theme="light"] .log-summary-card.status-summary td[data-status^="4"],
:root[data-site-theme="light"] .log-summary-card.status-summary td[data-status^="5"] {
  color: var(--danger);
}

:root[data-site-theme="light"] .log-summary-card.status-summary td[data-status="200"],
:root[data-site-theme="light"] .log-format-note.is-ok {
  color: var(--success);
}

:root[data-site-theme="light"] .observatory-loading-spinner {
  border-color: var(--border);
  border-top-color: var(--focus-ring);
}

