/**
 * Design system token semantic aliases.
 * Site-specific values are injected via SSR :root { --ds-* } in layouts/partials.html.
 */
:root {
  color-scheme: light dark;
}

body[class*="ds-preset-"] {
  background-color: var(--ds-color-bg, inherit);
  color: var(--ds-color-text, inherit);
}

/* Bridge Design Tokens → legacy theme variables so preset apply is visible site-wide */
body[class*="ds-preset-"].theme-business-pro {
  --bp-bg: var(--ds-color-bg);
  --bp-surface: var(--ds-color-surface);
  --bp-surface-raised: var(--ds-color-surface);
  --bp-text: var(--ds-color-text);
  --bp-text-muted: var(--ds-color-text-muted);
  --bp-heading: var(--ds-color-heading);
  --bp-accent: var(--ds-color-accent);
  --bp-accent-hover: var(--ds-color-accent-hover);
  --bp-border: var(--ds-color-border);
  --bp-on-accent: var(--ds-color-on-accent);
  --bp-accent-soft: color-mix(in srgb, var(--ds-color-accent) 12%, transparent);
  --bp-border-subtle: color-mix(in srgb, var(--ds-color-border) 28%, transparent);
  --bp-shadow-neon: 0 0 48px color-mix(in srgb, var(--ds-color-accent) 20%, transparent);
  --bp-focus-ring: 0 0 0 3px color-mix(in srgb, var(--ds-color-accent) 35%, transparent);
  --bp-font-display: var(--ds-font-display);
  --bp-font-body: var(--ds-font-body);
  --bp-radius-sm: var(--ds-radius-sm);
  --bp-radius: var(--ds-radius-md);
  --bp-radius-md: var(--ds-radius-lg);
  --bp-shadow-sm: var(--ds-shadow-sm);
  --bp-shadow: var(--ds-shadow-md);
  --bp-duration: var(--ds-motion-duration);
  --bp-ease: var(--ds-motion-ease);
}

body[class*="ds-preset-"].theme-modern-minimal {
  --mm-bg: var(--ds-color-bg);
  --mm-surface: var(--ds-color-surface);
  --mm-surface-elevated: var(--ds-color-surface);
  --mm-text: var(--ds-color-text);
  --mm-text-muted: var(--ds-color-text-muted);
  --mm-heading: var(--ds-color-heading);
  --mm-accent: var(--ds-color-accent);
  --mm-accent-hover: var(--ds-color-accent-hover);
  --mm-accent-muted: color-mix(in srgb, var(--ds-color-accent) 10%, transparent);
  --mm-accent-soft: color-mix(in srgb, var(--ds-color-accent) 12%, transparent);
  --mm-border: var(--ds-color-border);
  --mm-font-display: var(--ds-font-display);
  --mm-font-body: var(--ds-font-body);
  --mm-radius-sm: var(--ds-radius-sm);
  --mm-radius: var(--ds-radius-md);
  --mm-radius-lg: var(--ds-radius-lg);
  --mm-shadow-sm: var(--ds-shadow-sm);
  --mm-shadow: var(--ds-shadow-md);
  --mm-duration: var(--ds-motion-duration);
  --mm-ease: var(--ds-motion-ease);
}

/* 仅正文区链接用 accent；顶栏/底栏导航由 shell + 主题控制 */
body[class*="ds-preset-"] .site-main a:not(.btn):not([class*="blk-btn"]),
body[class*="ds-preset-"] .blk-section a:not(.btn):not([class*="blk-btn"]) {
  color: var(--ds-color-accent, inherit);
}

body[class*="ds-preset-"] .blk-post-content pre,
body[class*="ds-preset-"] .blk-post-content code {
  font-family: var(--ds-font-mono, ui-monospace, monospace);
}

body[class*="ds-preset-"] .site-footer,
body[class*="ds-preset-"] .site-header {
  font-family: var(--ds-font-label, var(--ds-font-utility, var(--ds-font-body, inherit)));
}

body[class*="ds-preset-"] .blk-section a:not(.btn):not([class*="blk-btn"]) {
  color: var(--ds-color-accent, inherit);
}

body[class*="ds-preset-"] .site-main a:not(.btn):not([class*="blk-btn"]):hover,
body[class*="ds-preset-"] .blk-section a:not(.btn):not([class*="blk-btn"]):hover {
  color: var(--ds-color-accent-hover, inherit);
}

.blk-section,
.site-main {
  --section-space-lg: var(--ds-space-lg, calc(var(--ds-space-unit, 8px) * 3));
}

.blk-section--border-top {
  border-top: 1px solid var(--ds-color-border, rgba(0, 0, 0, 0.08));
}

.btn,
button[type="submit"],
.blk-hero .btn {
  background-color: var(--ds-color-accent, inherit);
  color: var(--ds-color-on-accent, inherit);
  border-radius: var(--ds-radius-md, 8px);
  padding: var(--ds-btn-padding-y, 0.75rem) var(--ds-btn-padding-x, 1.25rem);
  font-family: var(--ds-font-utility, var(--ds-font-display, inherit));
  font-size: var(--ds-btn-font-size, inherit);
  transition: background-color var(--ds-motion-duration, 280ms) var(--ds-motion-ease, ease);
}

.btn:hover,
button[type="submit"]:hover {
  background-color: var(--ds-color-accent-hover, inherit);
}