/* Advoke CV — Light Theme (Default) */

:root,
[data-theme="light"] {
  color-scheme: light;

  --theme-bg: var(--white);
  --theme-bg-warm: var(--white-warm);
  --theme-bg-soft: var(--yellow-50);
  --theme-bg-subtle: var(--ink-50);
  --theme-surface: var(--white);
  --theme-surface-raised: var(--white);
  --theme-surface-sunken: var(--ink-50);

  --theme-border: var(--ink-200);
  --theme-border-strong: var(--ink-300);
  --theme-border-subtle: var(--ink-100);

  --theme-text: var(--ink-900);
  --theme-text-secondary: var(--ink-700);
  --theme-text-muted: var(--ink-500);
  --theme-text-subtle: var(--ink-400);
  --theme-text-inverse: var(--white);

  --theme-accent: var(--yellow-500);
  --theme-accent-hover: var(--yellow-600);
  --theme-accent-active: var(--yellow-700);
  --theme-accent-soft: var(--yellow-100);
  --theme-accent-tint: var(--yellow-50);
  --theme-accent-text: var(--ink-900);

  --theme-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --theme-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --theme-shadow-md: 0 4px 8px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.04);
  --theme-shadow-lg: 0 10px 20px rgba(15, 23, 42, 0.08), 0 4px 8px rgba(15, 23, 42, 0.04);
  --theme-shadow-xl: 0 20px 32px rgba(15, 23, 42, 0.1), 0 8px 16px rgba(15, 23, 42, 0.05);
  --theme-shadow-accent: 0 8px 24px rgba(245, 184, 0, 0.28);

  --theme-header-bg: rgba(255, 255, 255, 0.85);
  --theme-header-bg-scrolled: rgba(255, 255, 255, 0.95);
  --theme-footer-bg: var(--white-warm);

  --theme-overlay: rgba(15, 23, 42, 0.5);
  --theme-overlay-strong: rgba(15, 23, 42, 0.65);

  --theme-input-bg: var(--white);
  --theme-input-bg-filled: var(--ink-50);
  --theme-input-border: var(--ink-300);
  --theme-input-border-focus: var(--yellow-500);

  --theme-select-bg: var(--white);
  --theme-select-option-bg: var(--white);
  --theme-select-option-text: var(--ink-900);

  --theme-code-bg: var(--ink-100);
  --theme-code-text: var(--ink-900);
  --theme-pre-bg: var(--ink-900);
  --theme-pre-text: var(--ink-100);

  --theme-link: var(--ink-900);
  --theme-link-hover: var(--yellow-700);

  --theme-selection-bg: var(--yellow-300);
  --theme-selection-text: var(--ink-900);

  --theme-scrollbar-track: transparent;
  --theme-scrollbar-thumb: var(--ink-300);
  --theme-scrollbar-thumb-hover: var(--ink-400);

  --theme-skeleton-base: var(--ink-100);
  --theme-skeleton-highlight: var(--ink-50);
}

body {
  background-color: var(--theme-bg);
  color: var(--theme-text);
}

::selection {
  background-color: var(--theme-selection-bg);
  color: var(--theme-selection-text);
}

::-webkit-scrollbar-track {
  background: var(--theme-scrollbar-track);
}

::-webkit-scrollbar-thumb {
  background-color: var(--theme-scrollbar-thumb);
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--theme-scrollbar-thumb-hover);
}