/* Theme preview colors remain available while another theme is active. */
:root {
  --color-theme-beta-tester-preview-primary: #2D9E5F;
  --color-theme-beta-tester-preview-secondary: #f0fdf4;
  --color-theme-beta-tester-preview-tertiary: #052e16;
}

/* Beta Tester — exclusive theme for beta testers.
   Shamrock green primary with white accents and deep forest undertones.
   A dark theme evoking fresh growth, trust, and exclusivity. */
:root[data-app-theme='beta-tester'] {
  color-scheme: dark;

  /* Pokédex shell: editable without changing the application palette. */
  --color-pokedex-shell: #2D9E5F;
  --color-pokedex-shell-light: #4ADE80;
  --color-pokedex-shell-dark: #166534;
  --color-pokedex-shell-accent: #052e16;
  --color-pokedex-shell-accent-light: #22c55e;
  --color-pokedex-shell-accent-ink: #ffffff;
  --color-pokedex-shell-trim: #031a0d;
  --color-pokedex-shell-ink: #f0fdf4;
  --color-pokedex-highlight: #ffffff;
  --color-pokedex-control: #1a3320;
  --color-pokedex-control-dark: #0a1a0e;

  /* Surfaces — dark forest base with subtle green undertones */
  --color-bg-base: #070f0a;
  --color-bg-deep: #0a140e;
  --color-bg-surface: #0f1d14;
  --color-bg-panel: #14261b;
  --color-bg-card: #1a2e21;
  --color-bg-popover: #1f3526;
  --color-bg-elevated: #243d2c;
  --color-bg-canvas: #040a07;
  --color-bg-canvas-alt: #09140d;
  --color-bg-panel-subtle: #121f16;
  --color-bg-hero: #101e14;
  --color-bg-card-warm: #18281d;
  --color-bg-card-warm-alt: #1d2e21;
  --color-bg-media: #223829;
  --color-bg-thumbnail: #2a4030;
  --color-bg-thumbnail-alt: #304837;
  --color-bg-placeholder: #2f3f32;
  --color-bg-success-edge: #142117;
  --color-bg-danger-panel: #211515;
  --color-bg-step-inactive: #1f2f22;
  --color-bg-tech: #111a14;

  /* Content — mint-to-white scale for excellent contrast on dark greens */
  --color-text-primary: #f0fdf4;
  --color-text-strong: #e8f5ec;
  --color-text-soft: #d1e6d8;
  --color-text-body: #b8d4c2;
  --color-text-body-strong: #d4eadd;
  --color-text-secondary: #96b8a4;
  --color-text-caption: #7ea08c;
  --color-text-caption-alt: #7ea08c;
  --color-text-tertiary: #6c907a;
  --color-text-low: #5c7e68;
  --color-text-muted: #4f705a;
  --color-text-subtle: #45604e;
  --color-text-placeholder: #5a7a64;
  --color-text-disabled: #3d5544;
  --color-text-ghost: #2d4032;
  --color-text-emphasis: #ffffff;
  --color-text-control: #b8d4c2;
  --color-text-feature: #b0d0bc;
  --color-text-detail: #96b8a4;
  --color-text-description: #a0c0ac;
  --color-text-summary: #8aac98;
  --color-text-plan-label: #7ea08c;
  --color-text-bulk: #96b8a4;
  --color-text-code: #6ee7b7;
  --color-text-bulk-subtle: #7ea08c;
  --color-text-scanner-label: #7a9a86;
  --color-text-confidence: #7ea08c;
  --color-text-limit: #6c907a;
  --color-text-detected: #74d8a8;
  --color-text-hint: #6c907a;
  --color-text-referral-note: #6c907a;
  --color-text-alert-note: #7ea08c;
  --color-text-about-muted: #7ea08c;
  --color-text-card: #c8e0d2;
  --color-text-card-alt: #c8e0d2;
  --color-text-search: #c4dccf;
  --color-text-upload: #c0d8cc;
  --color-text-scanner: #8aac98;
  --color-text-scanner-summary: #7a9a86;
  --color-text-alert-description: #a8c8b4;
  --color-text-manual: #b8c8b0;
  --color-text-referral: #a8c878;
  --color-text-neutral: #b0d0bc;
  --color-on-accent: #052e16;
  --color-on-action-wishlist: #ffffff;
  --color-accent-text: var(--color-accent-primary-light);
  --color-account-highlight: #4ade80;
  --color-status-success-text: var(--color-success-soft);
  --color-status-warning-text: var(--color-warning-light);
  --color-status-danger-text: var(--color-danger-soft);

  /* Controls */
  --color-control-check-bg: var(--color-bg-elevated);
  --color-control-check-border: rgb(var(--rgb-overlay) / 18%);
  --color-control-check-border-hover: var(--color-accent-primary-light);
  --color-control-check-bg-checked: var(--color-accent-primary);
  --color-control-check-border-checked: var(--color-accent-primary-light);
  --color-control-check-mark: var(--color-on-accent);
  --color-scrollbar-track: rgb(var(--rgb-overlay) / 3%);
  --color-scrollbar-thumb: rgb(var(--rgb-accent-primary) / 42%);
  --color-scrollbar-thumb-hover: rgb(var(--rgb-accent-primary) / 68%);
  --color-control-field-bg: var(--color-bg-elevated);
  --color-control-field-border: rgb(var(--rgb-overlay) / 14%);
  --color-control-field-border-hover: var(--color-accent-primary-light);
  --color-control-menu-bg: var(--color-bg-popover);
  --color-control-option-hover: rgb(var(--rgb-accent-primary) / 12%);
  --color-control-option-selected: rgb(var(--rgb-accent-primary) / 20%);
  --color-control-stepper-bg: rgb(var(--rgb-overlay) / 5%);
  --color-control-stepper-hover: rgb(var(--rgb-accent-primary) / 16%);
  --color-control-slider-track: rgb(var(--rgb-overlay) / 13%);
  --color-control-slider-fill: var(--color-accent-primary);
  --color-control-slider-thumb: var(--color-accent-primary-light);
  --color-control-slider-thumb-ring: var(--color-bg-surface);

  /* Price badges */
  --color-price-tcgplayer-text: #dbeafe;
  --color-price-tcgplayer-bg: #10213d;
  --color-price-tcgplayer-border: #60a5fa;
  --color-price-cardmarket-text: #fef9c3;
  --color-price-cardmarket-bg: #3a2b08;
  --color-price-cardmarket-border: #d6a84f;

  /* Reacciones sociales (💗 me encanta, 👍 me gusta, ⭐ favorito). */
  --color-reaction-heart: #f472b6;
  --color-reaction-like: #4ade80;
  --color-reaction-star: #f0c840;

  /* Product brand and application accents */
  --color-brand-primary: #2D9E5F;
  --color-brand-primary-light: #4ADE80;
  --color-brand-primary-dark: #166534;
  --color-brand-primary-deep: #052e16;
  --color-brand-soft: #DCFCE7;
  --color-brand-muted: #86EFAC;
  --color-brand-gold: #C4A838;

  --color-brand-name-primary: var(--color-brand-primary-light);
  --color-brand-name-secondary: #f0fdf4;
  --color-brand-name-dark: var(--color-brand-primary-dark);

  --color-accent-primary: var(--color-brand-primary);
  --color-accent-primary-light: var(--color-brand-primary-light);
  --color-accent-primary-dark: var(--color-brand-primary-dark);
  --color-accent-primary-deep: var(--color-brand-primary-deep);
  --color-accent-primary-soft: var(--color-brand-soft);
  --color-accent-primary-muted: #86EFAC;
  --color-accent-violet-soft: #b8d4c2;
  --color-accent-violet: #7ea08c;
  --color-accent-secondary: #f0fdf4;
  --color-accent-secondary-light: #ffffff;
  --color-accent-tertiary: #fbbf24;
  --color-accent-fuchsia: #f472b6;

  /* Functional actions */
  --color-action-wishlist: #f472b6;
  --color-action-wishlist-strong: #db2777;
  --color-action-wishlist-deep: #831843;
  --rgb-action-wishlist: 244 114 182;
  --rgb-action-wishlist-strong: 219 39 119;

  --color-action-destructive: #ef4444;
  --color-action-destructive-strong: #b91c1c;
  --color-action-destructive-deep: #7f1d1d;
  --rgb-action-destructive: 239 68 68;
  --rgb-action-destructive-strong: 185 28 28;

  --color-action-cancel: #96b8a4;
  --rgb-action-cancel: 150 184 164;

  /* RGB channels */
  --rgb-overlay: 240 253 244;
  --rgb-shadow: 0 0 0;
  --rgb-white: 255 255 255;
  --rgb-black: 0 0 0;
  --rgb-bg-base: 7 15 10;
  --rgb-bg-deep: 10 20 14;
  --rgb-bg-surface: 15 29 20;
  --rgb-bg-void: 4 10 7;
  --rgb-bg-tech: 17 26 20;
  --rgb-champagne: 196 232 200;

  --rgb-accent-primary: 45 158 95;
  --rgb-accent-primary-200: 220 252 231;
  --rgb-accent-primary-300: 134 239 172;
  --rgb-accent-primary-light: 74 222 128;
  --rgb-accent-primary-dark: 22 101 52;
  --rgb-accent-secondary: 240 253 244;
  --rgb-accent-secondary-300: 255 255 255;
  --rgb-accent-secondary-500: 240 253 244;
  --rgb-accent-tertiary: 251 191 36;
  --rgb-accent-tertiary-300: 252 211 77;
  --rgb-accent-tertiary-400: 250 204 21;
  --rgb-accent-fuchsia: 244 114 182;

  /* Backwards-compatible aliases */
  --bg-base: var(--color-bg-base);
  --bg-surface: var(--color-bg-surface);
  --bg-elevated: var(--color-bg-elevated);
  --border: rgb(var(--rgb-overlay) / 9%);
  --text-primary: var(--color-text-primary);
  --text-secondary: var(--color-text-secondary);
  --text-muted: var(--color-text-disabled);
  --accent-cyan: var(--color-accent-secondary);
  --accent-purple: var(--color-accent-primary);
  --accent-pink: var(--color-action-wishlist);
}
