/**
 * Blog Writer 2.0 — themes from Documentation/Design_Theme
 * - neumorph: Neumorphic_UI_Design_Statement.md (warm soft UI)
 * - obsidian: obsidian-soft-ui-styleguide.html (dark soft-touch)
 * - knobz: blog-pipeline-knobz-interactive.html (brushed-metal control panel)
 */

:root {
  --bw-font-sans: "Manrope", system-ui, sans-serif;
  --bw-font-display: "Sora", system-ui, sans-serif;
  --bw-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --bw-radius-sm: 10px;
  --bw-radius-md: 16px;
  --bw-radius-lg: 20px;
  --bw-radius-xl: 28px;
  --bw-radius-pill: 999px;
  --bw-space-1: 0.25rem;
  --bw-space-2: 0.5rem;
  --bw-space-3: 0.75rem;
  --bw-space-4: 1rem;
  --bw-space-5: 1.5rem;
  --bw-space-6: 2rem;
  --bw-space-8: 3rem;
  --bw-header-h: 3.5rem;
  --bw-sidebar-w: 16rem;
  --bw-sidebar-w-collapsed: 4.5rem;
  --bw-z-overlay: 190;
  --bw-z-sidebar: 200;
  --bw-z-topbar: 100;
  --bw-z-dialog: 900;
  --bw-z-toast: 1000;
  --bw-transition: 180ms ease;
  --bw-theme-duration: 420ms;
  --bw-ease-theme: cubic-bezier(0.22, 0.61, 0.36, 1);
  --bw-motion-fast: 140ms;
  --bw-motion-med: 240ms;
  --bw-motion-page: 320ms;
  --bw-logo-plate-bg: #0b0b0b;
  --bw-focus-ring: 0 0 0 3px var(--bw-focus);
  --bw-inner-highlight: none;
  --bw-shadow-raised: none;
  --bw-shadow-pressed: none;
  --bw-raise-a: var(--bw-surface);
  --bw-raise-b: var(--bw-surface-2);

  /* Scrollbars — theme-aware (Firefox scrollbar-color + WebKit) */
  --bw-scrollbar-size: 10px;
  --bw-scrollbar-size-thin: 6px;
  --bw-scrollbar-track: color-mix(in srgb, var(--bw-surface-2) 72%, transparent);
  --bw-scrollbar-thumb: color-mix(in srgb, var(--bw-border-strong) 88%, var(--bw-text-muted));
  --bw-scrollbar-thumb-hover: var(--bw-border-strong);
  --bw-scrollbar-sidebar-track: transparent;
  --bw-scrollbar-sidebar-thumb: rgba(255, 255, 255, 0.22);
  --bw-scrollbar-sidebar-thumb-hover: rgba(255, 255, 255, 0.34);
  --bw-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%238a7f74' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ── Neumorph (warm linen, DM Sans) ── */
:root,
[data-theme="neumorph"] {
  --bw-font-sans: "DM Sans", system-ui, sans-serif;
  --bw-font-display: "DM Sans", system-ui, sans-serif;
  --bw-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --bw-radius-sm: 12px;
  --bw-radius-md: 16px;
  --bw-radius-lg: 20px;

  --bw-bg-base: #e6ded4;
  --bw-bg: #e6ded4;
  --bw-bg-image: none;
  --bw-raise-a: #ede6dc;
  --bw-raise-b: #dcd4ca;
  --bw-surface: #ede6dc;
  --bw-surface-2: #e6ded4;
  --bw-surface-elevated: #ede6dc;
  --bw-border: rgba(194, 179, 163, 0.45);
  --bw-border-strong: #c2b3a3;
  --bw-text: #3e362c;
  --bw-text-muted: #8a7f74;
  --bw-text-inverse: #fffcf8;
  --bw-primary: #7b6aaf;
  --bw-primary-hover: #6b5ca0;
  --bw-primary-subtle: rgba(123, 106, 175, 0.14);
  --bw-accent: #9a8ac8;
  --bw-success: #5a8f6a;
  --bw-success-subtle: rgba(90, 143, 106, 0.15);
  --bw-warning: #b8863a;
  --bw-warning-subtle: rgba(184, 134, 58, 0.15);
  --bw-on-warning: #fffcf8;
  --bw-danger: #a85c5c;
  --bw-danger-subtle: rgba(168, 92, 92, 0.14);
  --bw-info: #7b6aaf;
  --bw-info-subtle: rgba(123, 106, 175, 0.12);
  --bw-sidebar-bg: linear-gradient(145deg, #4a4238, #332c24);
  --bw-sidebar-bg-solid: #3e362c;
  --bw-sidebar-text: #faf5ee;
  --bw-sidebar-muted: #c2b3a3;
  --bw-sidebar-active: #7b6aaf;
  --bw-sidebar-active-fg: #faf5ee;
  --bw-shadow-light: #faf5ee;
  --bw-shadow-dark: #c2b3a3;
  --bw-shadow-raised: 8px 8px 16px #c2b3a3, -8px -8px 16px #faf5ee;
  --bw-shadow-raised-sm: 4px 4px 8px #c2b3a3, -4px -4px 8px #faf5ee;
  --bw-shadow-pressed: inset 4px 4px 8px #c2b3a3, inset -4px -4px 8px #faf5ee;
  --bw-inner-highlight: inset 1px 1px 2px rgba(255, 255, 255, 0.5);
  --bw-shadow-sm: var(--bw-shadow-raised-sm);
  --bw-shadow-md: var(--bw-shadow-raised);
  --bw-shadow-lg: 10px 10px 22px #c2b3a3, -10px -10px 22px #faf5ee;
  --bw-focus: rgba(123, 106, 175, 0.4);
  --bw-table-stripe: rgba(220, 212, 202, 0.35);
  --bw-table-head: #dcd4ca;
  --bw-form-inset: var(--bw-bg-base);
  --bw-dashboard-heading: var(--bw-primary);
  --bw-dashboard-heading-shadow: none;
  --bw-on-primary: var(--bw-text-inverse);
  --bw-scrollbar-track: color-mix(in srgb, var(--bw-surface-2) 80%, var(--bw-bg-base));
  --bw-scrollbar-thumb: color-mix(in srgb, var(--bw-border-strong) 75%, var(--bw-text-muted) 25%);
  --bw-scrollbar-thumb-hover: color-mix(in srgb, var(--bw-primary) 35%, var(--bw-border-strong));
  --bw-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%238a7f74' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ── Obsidian (dark soft-touch, Sora + Manrope) ── */
[data-theme="obsidian"] {
  --bw-font-sans: "Manrope", system-ui, sans-serif;
  --bw-font-display: "Sora", system-ui, sans-serif;
  --bw-bg-base: #2b2b2d;
  --bw-bg: #2b2b2d;
  --bw-bg-image:
    radial-gradient(120% 80% at 50% -10%, #313133, transparent 60%),
    linear-gradient(180deg, #313133, #2b2b2d 30%, #1f1f21);
  --bw-raise-a: #353537;
  --bw-raise-b: #232325;
  --bw-sink-a: #202022;
  --bw-sink-b: #313133;
  --bw-surface: #353537;
  --bw-surface-2: #2b2b2d;
  --bw-surface-elevated: #3a3a3c;
  --bw-border: rgba(255, 255, 255, 0.06);
  --bw-border-strong: rgba(255, 255, 255, 0.1);
  --bw-text: #cdcdcf;
  --bw-text-muted: #a8a8ab;
  --bw-text-subtle: #94949a;
  --bw-text-on-inset: #bcbcc0;
  --bw-placeholder: rgba(205, 205, 207, 0.68);
  --bw-text-inverse: #1e1e20;
  --bw-primary: #d6c3a3;
  --bw-primary-hover: #e1cfae;
  --bw-primary-subtle: rgba(214, 195, 163, 0.18);
  --bw-accent: #8fb6c4;
  --bw-success: #8fb98f;
  --bw-success-subtle: rgba(143, 185, 143, 0.15);
  --bw-warning: #c9b27e;
  --bw-warning-subtle: rgba(201, 178, 126, 0.15);
  --bw-on-warning: #1e1e20;
  --bw-danger: #c48f8f;
  --bw-danger-subtle: rgba(196, 143, 143, 0.15);
  --bw-info: #7fa6c4;
  --bw-info-subtle: rgba(127, 166, 196, 0.15);
  --bw-sidebar-bg: linear-gradient(180deg, #232325, #1a1a1c);
  --bw-sidebar-bg-solid: #232325;
  --bw-sidebar-text: #e4e4e6;
  --bw-sidebar-muted: #5c5c5f;
  --bw-sidebar-active: #d6c3a3;
  --bw-sidebar-active-fg: #1e1e20;
  --bw-sh-light: rgba(255, 255, 255, 0.055);
  --bw-sh-dark: rgba(0, 0, 0, 0.55);
  --bw-shadow-raised: -8px -8px 16px var(--bw-sh-light), 8px 8px 16px var(--bw-sh-dark);
  --bw-shadow-raised-sm: -4px -4px 8px var(--bw-sh-light), 4px 4px 8px var(--bw-sh-dark);
  --bw-shadow-pressed: inset 4px 4px 8px rgba(0, 0, 0, 0.6), inset -4px -4px 8px rgba(255, 255, 255, 0.03);
  --bw-inner-highlight: inset 0 0 0 1px rgba(255, 255, 255, 0.018);
  --bw-shadow-sm: var(--bw-shadow-raised-sm);
  --bw-shadow-md: var(--bw-shadow-raised);
  --bw-shadow-lg: -12px -12px 26px rgba(255, 255, 255, 0.04), 16px 18px 34px rgba(0, 0, 0, 0.6);
  --bw-focus: rgba(214, 195, 163, 0.35);
  --bw-table-stripe: rgba(255, 255, 255, 0.02);
  --bw-table-head: #2e2e30;
  --bw-form-inset: linear-gradient(145deg, #1f1f21, #2e2e30);
  --bw-dashboard-heading: #e4e4e6;
  --bw-dashboard-heading-shadow: none;
  --bw-on-primary: #1e1e20;
  --bw-scrollbar-track: color-mix(in srgb, var(--bw-surface-2) 90%, transparent);
  --bw-scrollbar-thumb: color-mix(in srgb, var(--bw-text-muted) 55%, var(--bw-surface-elevated));
  --bw-scrollbar-thumb-hover: color-mix(in srgb, var(--bw-text-muted) 80%, var(--bw-primary) 20%);
  --bw-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23a8a8ab' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  color-scheme: dark;
  /* Bootstrap bridge — Obsidian is dark UI but not data-bs-theme=dark */
  --bs-body-color: var(--bw-text);
  --bs-body-bg: var(--bw-bg);
  --bs-emphasis-color: var(--bw-text);
  --bs-secondary-color: var(--bw-text-muted);
  --bs-secondary-bg: var(--bw-surface-2);
  --bs-tertiary-color: var(--bw-text-muted);
  --bs-tertiary-bg: var(--bw-surface);
  --bs-border-color: var(--bw-border);
  --bs-link-color: var(--bw-primary);
  --bs-link-hover-color: var(--bw-primary-hover);
}

/* ── Knobz (brushed metal pipeline panel) ── */
[data-theme="knobz"] {
  --bw-font-sans: "Segoe UI", "Avenir Next", system-ui, sans-serif;
  --bw-font-display: "Segoe UI", "Avenir Next", system-ui, sans-serif;
  --bw-bg-base: #c2c7cb;
  --bw-bg: #c2c7cb;
  --bw-bg-image: linear-gradient(160deg, #d7dbde, #c2c7cb 60%, #b3b9bd);
  --bw-raise-a: #eef0f1;
  --bw-raise-b: #dfe2e4;
  --bw-panel-3: #c9ced1;
  --bw-surface: #eef0f1;
  --bw-surface-2: #dfe2e4;
  --bw-surface-elevated: #eef0f1;
  --bw-border: rgba(255, 255, 255, 0.55);
  --bw-border-strong: #b4babd;
  --bw-text: #4a4f53;
  --bw-text-muted: #7b8186;
  --bw-text-inverse: #eef0f1;
  --bw-primary: #5b8cff;
  --bw-primary-hover: #4a7ae8;
  --bw-primary-subtle: rgba(91, 140, 255, 0.12);
  --bw-accent: #4cc7e0;
  --bw-success: #59e25b;
  --bw-success-subtle: rgba(89, 226, 91, 0.15);
  --bw-warning: #ffb43a;
  --bw-warning-subtle: rgba(255, 180, 58, 0.15);
  --bw-on-warning: #2f3438;
  --bw-danger: #ff6ea8;
  --bw-danger-subtle: rgba(255, 110, 168, 0.12);
  --bw-info: #9b6cff;
  --bw-info-subtle: rgba(155, 108, 255, 0.12);
  --bw-sidebar-bg: linear-gradient(180deg, #3b4044, #23272a);
  --bw-sidebar-bg-solid: #32373b;
  --bw-sidebar-text: #eef0f1;
  --bw-sidebar-muted: #a3a9ad;
  --bw-sidebar-active: #59e25b;
  --bw-sidebar-active-fg: #2f5d3a;
  --bw-edge-hi: #ffffff;
  --bw-edge-lo: #9aa0a4;
  --bw-shadow-raised:
    0 1px 0 #fff inset,
    0 -1px 0 rgba(0, 0, 0, 0.08) inset,
    0 2px 3px rgba(0, 0, 0, 0.12),
    0 10px 22px -10px rgba(40, 46, 52, 0.45);
  --bw-shadow-raised-sm:
    0 1px 0 #fff inset,
    0 2px 4px rgba(0, 0, 0, 0.1);
  --bw-shadow-pressed:
    0 1px 0 #fff,
    inset 0 2px 4px rgba(0, 0, 0, 0.28),
    inset 0 -1px 0 rgba(255, 255, 255, 0.5);
  --bw-inner-highlight: none;
  --bw-shadow-sm: var(--bw-shadow-raised-sm);
  --bw-shadow-md: var(--bw-shadow-raised);
  --bw-shadow-lg:
    0 2px 0 #fff inset,
    0 30px 60px -20px rgba(40, 46, 52, 0.55);
  --bw-focus: rgba(91, 140, 255, 0.4);
  --bw-table-stripe: rgba(201, 206, 209, 0.35);
  --bw-table-head: #dfe2e4;
  --bw-form-inset: linear-gradient(180deg, #e8ebec, #d5d9dc);
  --bw-dashboard-heading: #6a7075;
  --bw-dashboard-heading-shadow: 0 1px 0 rgba(255, 255, 255, 0.9), 0 -1px 1px rgba(0, 0, 0, 0.12);
  --bw-on-primary: var(--bw-text);
  --bw-sidebar-active-bg: linear-gradient(180deg, #cfe3d4, #bcd6c2);
  --bw-sidebar-active-fg: #2f5d3a;
  --bw-sidebar-active-glow: 0 0 12px rgba(89, 226, 91, 0.25) inset;
  --bw-scrollbar-track: color-mix(in srgb, var(--bw-surface-2) 70%, var(--bw-bg-base));
  --bw-scrollbar-thumb: color-mix(in srgb, var(--bw-border-strong) 85%, var(--bw-text-muted));
  --bw-scrollbar-thumb-hover: color-mix(in srgb, var(--bw-primary) 30%, var(--bw-border-strong));
  --bw-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%237b8186' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ── SlideTeam (flat light corporate, Open Sans + Montserrat) ── */
[data-theme="slideteam"] {
  --bw-font-sans: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --bw-font-display: "Montserrat", "Open Sans", system-ui, sans-serif;
  --bw-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --bw-radius-sm: 3px;
  --bw-radius-md: 6px;
  --bw-radius-lg: 8px;
  --bw-radius-xl: 12px;
  --bw-radius-pill: 30px;

  --bw-bg-base: #f2f2f2;
  --bw-bg: #f2f2f2;
  --bw-bg-image: none;
  --bw-raise-a: #ffffff;
  --bw-raise-b: #f2f2f2;
  --bw-surface: #ffffff;
  --bw-surface-2: #f2f2f2;
  --bw-surface-elevated: #ffffff;
  --bw-border: #e5e5e5;
  --bw-border-strong: #c3c3c3;
  --bw-text: #333333;
  --bw-text-muted: #5a5a5a;
  --bw-text-inverse: #ffffff;
  --bw-primary: #28a7fb;
  --bw-primary-hover: #1f8fe0;
  --bw-primary-subtle: rgba(40, 167, 251, 0.12);
  --bw-accent: #ffa500;
  --bw-success: #5a8f3a;
  --bw-success-subtle: rgba(90, 143, 58, 0.14);
  --bw-warning: #d98a00;
  --bw-warning-subtle: rgba(255, 165, 0, 0.16);
  --bw-on-warning: #ffffff;
  --bw-danger: #d14343;
  --bw-danger-subtle: rgba(209, 67, 67, 0.12);
  --bw-info: #28a7fb;
  --bw-info-subtle: rgba(40, 167, 251, 0.12);
  --bw-sidebar-bg: #2b2b2b;
  --bw-sidebar-bg-solid: #2b2b2b;
  --bw-sidebar-text: #ffffff;
  --bw-sidebar-muted: #cfcfcf;
  --bw-sidebar-active: #28a7fb;
  --bw-sidebar-active-fg: #ffffff;
  --bw-shadow-light: #ffffff;
  --bw-shadow-dark: rgba(0, 0, 0, 0.08);
  --bw-shadow-raised: 0 2px 10px rgba(0, 0, 0, 0.08);
  --bw-shadow-raised-sm: 0 1px 4px rgba(0, 0, 0, 0.08);
  --bw-shadow-pressed: inset 0 1px 3px rgba(0, 0, 0, 0.12);
  --bw-inner-highlight: none;
  --bw-shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08);
  --bw-shadow-md: 0 2px 10px rgba(0, 0, 0, 0.08);
  --bw-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
  --bw-focus: rgba(40, 167, 251, 0.4);
  --bw-table-stripe: rgba(242, 242, 242, 0.6);
  --bw-table-head: #f2f2f2;
  --bw-form-inset: #ffffff;
  --bw-dashboard-heading: #202020;
  --bw-dashboard-heading-shadow: none;
  --bw-on-primary: #ffffff;
  --bw-scrollbar-track: color-mix(in srgb, var(--bw-surface-2) 70%, var(--bw-bg-base));
  --bw-scrollbar-thumb: color-mix(in srgb, var(--bw-border-strong) 85%, var(--bw-text-muted));
  --bw-scrollbar-thumb-hover: color-mix(in srgb, var(--bw-primary) 35%, var(--bw-border-strong));
  --bw-select-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%2328a7fb' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

:root,
[data-theme="neumorph"],
[data-theme="knobz"],
[data-theme="slideteam"] {
  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --bw-theme-duration: 0ms;
    --bw-transition: 0ms;
    --bw-motion-fast: 0ms;
    --bw-motion-med: 0ms;
    --bw-motion-page: 0ms;
  }
}