/* Theme: Default dark. Copy this file and adjust variables to create new themes. */

:root {
  --color-primary: #8a2be2;
  --color-primary-strong: #7b1fa2;
  --color-button-text: #ffffff;
  --color-success: #53b06d;
  --color-danger: #c85b5b;
  --color-warning: #f59e0b;

  --color-surface: #0f0f10;
  --color-panel: #1a1a1b;
  --color-surface-elevated: #1f2024;
  --color-surface-soft: rgba(255, 255, 255, 0.045);
  --color-divider: #2a2a2b;
  --color-border-strong: rgba(138, 43, 226, 0.34);

  --color-text: #e5e7eb;
  --color-text-strong: #f3f3f5;
  --color-muted-text: #caced3;
  --color-focus-ring: rgba(207, 178, 255, 0.48);

  --hero-bg: linear-gradient(rgba(15, 15, 16, 0.9), rgba(15, 15, 16, 0.9)),
              url('../images/minecraft/hero-bg.jpg');
  --hero-overlay: rgba(0, 0, 0, 0.6);
  --home-bg: url('/images/wallpaper.jpg');
  --modal-backdrop: rgba(0, 0, 0, 0.75);
  --color-overlay: rgba(4, 5, 8, 0.74);
  --button-gradient: linear-gradient(to right, #8a2be2, #7b1fa2);

  --ws-bg-page: #0f0f10;
  --ws-bg-shell: #141418;
  --ws-bg-surface: #1a1a1b;
  --ws-bg-surface-raised: #1f2024;
  --ws-bg-surface-muted: rgba(255, 255, 255, 0.045);
  --ws-bg-card: rgba(24, 24, 29, 0.9);
  --ws-bg-card-hover: rgba(31, 32, 36, 0.96);
  --ws-bg-input: rgba(20, 20, 24, 0.88);
  --ws-bg-button: rgba(26, 26, 31, 0.9);
  --ws-bg-button-hover: rgba(138, 43, 226, 0.14);

  --ws-text-primary: #f3f3f5;
  --ws-text-secondary: #e5e7eb;
  --ws-text-muted: #caced3;
  --ws-text-disabled: #7d8490;
  --ws-text-inverse: #ffffff;

  --ws-border-subtle: #2a2a2b;
  --ws-border-strong: rgba(138, 43, 226, 0.34);
  --ws-border-focus: rgba(207, 178, 255, 0.48);

  --ws-accent: #8a2be2;
  --ws-accent-hover: #7b1fa2;
  --ws-accent-soft: rgba(138, 43, 226, 0.16);
  --ws-accent-text: #f0e7ff;

  --ws-shadow-soft: 0 12px 30px rgba(0, 0, 0, 0.18);
  --ws-shadow-card: 0 18px 45px rgba(0, 0, 0, 0.24);
  --ws-shadow-popover: 0 26px 70px rgba(0, 0, 0, 0.38);

  --ws-glass-bg: rgba(20, 20, 28, 0.72);
  --ws-glass-border: rgba(138, 43, 226, 0.22);
  --ws-glass-highlight: rgba(255, 255, 255, 0.08);
}

/* Theme-level application */
body {
  background-color: var(--color-surface);
  color: var(--color-text-strong);
}

a {
  color: inherit;
}

/* Dark theme: keep mobile nav item borders visible (only applies in style.css) */
#mobile-menu nav a {
  border-color: var(--color-divider, #2a2a2b);
}
