/**
 * ry-ui Dark Theme
 */

[data-ry-theme="dark"] {
  /* Colors */
  --ry-color-primary: #60a5fa;
  --ry-color-primary-hover: #3b82f6;
  --ry-color-primary-active: #2563eb;

  --ry-color-secondary: #94a3b8;
  --ry-color-secondary-hover: #cbd5e1;
  --ry-color-secondary-active: #e2e8f0;

  /* Text */
  --ry-color-text: #f1f5f9;
  --ry-color-text-muted: #94a3b8;
  --ry-color-text-inverse: #0f172a;

  /* Background */
  --ry-color-bg: #0f172a;
  --ry-color-bg-subtle: #1e293b;
  --ry-color-bg-muted: #334155;

  /* Border */
  --ry-color-border: #334155;
  --ry-color-border-strong: #475569;

  /* Overlay */
  --ry-color-overlay: rgba(0, 0, 0, 0.7);

  /* Shadows (more subtle in dark mode) */
  --ry-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  --ry-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --ry-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
  --ry-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5);

  /* Focus */
  --ry-focus-ring: 0 0 0 3px rgba(96, 165, 250, 0.5);

  /* Code block - Vibrant (using theme colors) */
  --ry-code-bg: #0f172a;
  --ry-code-header-bg: #1e293b;
  --ry-code-text-color: #f1f5f9;
  --ry-code-title-color: #94a3b8;
  --ry-code-icon-color: #64748b;
  --ry-code-icon-hover-bg: #334155;
  --ry-code-icon-hover-color: #f1f5f9;
  --ry-code-line-number-color: rgba(71, 85, 105, 0.6);
  --ry-code-line-border-color: #334155;
  --ry-code-color-preview-border: rgba(241, 245, 249, 0.3);
  /* Syntax - theme button colors */
  --ry-code-keyword: #ef4444;
  --ry-code-property: #60a5fa;
  --ry-code-value: #f59e0b;
  --ry-code-string: #22c55e;
  --ry-code-number: #f59e0b;
  --ry-code-comment: #94a3b8;
  --ry-code-selector: #06b6d4;
  --ry-code-punctuation: #94a3b8;
  --ry-code-tag: #06b6d4;
  --ry-code-attribute: #60a5fa;
}

/* Alert overrides for dark mode */
[data-ry-theme="dark"] .ry-alert--info,
[data-ry-theme="dark"] ry-alert[type="info"] {
  background-color: #164e63;
  border-color: #06b6d4;
  color: #a5f3fc;
}

[data-ry-theme="dark"] .ry-alert--success,
[data-ry-theme="dark"] ry-alert[type="success"] {
  background-color: #14532d;
  border-color: #22c55e;
  color: #bbf7d0;
}

[data-ry-theme="dark"] .ry-alert--warning,
[data-ry-theme="dark"] ry-alert[type="warning"] {
  background-color: #78350f;
  border-color: #f59e0b;
  color: #fef3c7;
}

[data-ry-theme="dark"] .ry-alert--danger,
[data-ry-theme="dark"] ry-alert[type="danger"] {
  background-color: #7f1d1d;
  border-color: #ef4444;
  color: #fecaca;
}