/* Weppa Site · tema del sitio (#866). Verificado con weppa_site_theme_check. */
@layer base {
  :root {
    color-scheme: light dark;
    --color-bg: light-dark(#fbfaf8, #141211);
    --color-surface: light-dark(#f3f1ed, #1e1b19);
    --color-text: light-dark(#1c1917, #f2efec);
    --color-text-secondary: light-dark(#57534e, #b6b0a8);
    --color-border: light-dark(#e7e5e0, #332e2a);
    --color-brand: light-dark(#0f766e, #2dd4bf);
    --color-brand-hover: light-dark(#115e59, #5eead4);
    --color-on-brand: light-dark(#ffffff, #0a2e2a);
    --color-brand-container: light-dark(#ccfbf1, #134e4a);
    --color-on-brand-container: light-dark(#115e59, #5eead4);
    --color-link: light-dark(#0f766e, #2dd4bf);
    --color-success-container: light-dark(#e6f4ec, #12301e);
    --color-on-success-container: light-dark(#1b6136, #7fdba0);
    --color-warning-container: light-dark(#fdf0e1, #3a2710);
    --color-on-warning-container: light-dark(#7f4300, #f3b765);
    --color-danger-container: light-dark(#fbe8e9, #3d1719);
    --color-on-danger-container: light-dark(#a1232a, #ff9ca0);
    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --font-display: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --color-muted: var(--color-text-secondary);
    --color-success: var(--color-on-success-container);
    --color-warning: var(--color-on-warning-container);
    --color-danger: var(--color-on-danger-container);
    --color-brand-ring: var(--color-brand);
    --font-heading: var(--font-display);
  }
  :root.light { color-scheme: light; }
  :root.dark { color-scheme: dark; }
  @supports not (color: light-dark(#000, #fff)) {
    :root {
      color-scheme: light;
      --color-bg: #fbfaf8;
      --color-surface: #f3f1ed;
      --color-text: #1c1917;
      --color-text-secondary: #57534e;
      --color-border: #e7e5e0;
      --color-brand: #0f766e;
      --color-brand-hover: #115e59;
      --color-on-brand: #ffffff;
      --color-brand-container: #ccfbf1;
      --color-on-brand-container: #115e59;
      --color-link: #0f766e;
      --color-success-container: #e6f4ec;
      --color-on-success-container: #1b6136;
      --color-warning-container: #fdf0e1;
      --color-on-warning-container: #7f4300;
      --color-danger-container: #fbe8e9;
      --color-on-danger-container: #a1232a;
    }
  }
}
/* Starlight (perfil docs): sin capa, para ganarle a @layer starlight.base (#1789 T15). */
:root[data-theme='light'] { color-scheme: light; }
:root[data-theme='dark'] { color-scheme: dark; }
:root, :root[data-theme] {
  --sl-color-white: var(--color-text);
  --sl-color-gray-1: var(--color-text);
  --sl-color-gray-2: var(--color-text);
  --sl-color-gray-3: var(--color-text-secondary);
  --sl-color-gray-4: var(--color-text-secondary);
  --sl-color-gray-5: var(--color-border);
  --sl-color-gray-6: var(--color-surface);
  --sl-color-gray-7: var(--color-surface);
  --sl-color-black: var(--color-bg);
  --sl-color-accent-low: var(--color-brand-container);
  --sl-color-accent: var(--color-brand);
  --sl-color-accent-high: var(--color-on-brand-container);
  --sl-color-text: var(--color-text);
  --sl-color-text-accent: var(--color-link);
  --sl-color-text-invert: var(--color-on-brand);
  --sl-color-bg: var(--color-bg);
  --sl-color-bg-nav: var(--color-surface);
  --sl-color-bg-sidebar: var(--color-surface);
  --sl-color-bg-inline-code: var(--color-surface);
  --sl-color-bg-accent: var(--color-brand);
  --sl-color-hairline: var(--color-border);
  --sl-color-hairline-light: var(--color-border);
  --sl-color-hairline-shade: var(--color-border);
  --sl-color-blue-low: var(--color-brand-container);
  --sl-color-blue: var(--color-brand);
  --sl-color-blue-high: var(--color-on-brand-container);
  --sl-color-purple-low: var(--color-brand-container);
  --sl-color-purple: var(--color-brand);
  --sl-color-purple-high: var(--color-on-brand-container);
  --sl-color-green-low: var(--color-success-container);
  --sl-color-green: var(--color-on-success-container);
  --sl-color-green-high: var(--color-on-success-container);
  --sl-color-orange-low: var(--color-warning-container);
  --sl-color-orange: var(--color-on-warning-container);
  --sl-color-orange-high: var(--color-on-warning-container);
  --sl-color-red-low: var(--color-danger-container);
  --sl-color-red: var(--color-on-danger-container);
  --sl-color-red-high: var(--color-on-danger-container);
  --sl-font: var(--font-body);
  --sl-badge-default-bg: var(--color-brand-container);
  --sl-badge-default-text: var(--color-on-brand-container);
  --sl-badge-note-bg: var(--color-brand-container);
  --sl-badge-note-text: var(--color-on-brand-container);
  --sl-badge-tip-bg: var(--color-brand-container);
  --sl-badge-tip-text: var(--color-on-brand-container);
  --sl-badge-success-bg: var(--color-success-container);
  --sl-badge-success-text: var(--color-on-success-container);
  --sl-badge-caution-bg: var(--color-warning-container);
  --sl-badge-caution-text: var(--color-on-warning-container);
  --sl-badge-danger-bg: var(--color-danger-container);
  --sl-badge-danger-text: var(--color-on-danger-container);
}