:root {
  /* Main color palette */
  --first-color: #ffcbcb;
  --second-color: #ffb5b5;
  --third-color: #407088;
  --fourth-color: #132743;

  /* Dark theme colors */
  --dark-bg: #0a0a0a;
  --dark-secondary: #1a1a1a;
  --dark-secondary-2: #111111;
  --dark-card: #2a2a2a;
  --widget-bg: #1a1a1a;
  --text-light: #ffffff;
  --text-muted: #f5f0f0;
  --accent-pink: #ff6b9d;
  --accent-pink-dark: #e2558c;
  --accent-pink-deep: #c34778;
  --cta-accent: #e16b6c;
  --accent-blue: #4a90e2;

  /* Utility colors */
  --success: #28a745;
  --warning: #ffc107;
  --danger: #dc3545;
  --info: #17a2b8;

  /* Opacity helpers derived colors (centralized for use in custom.css) */
  --white-02: rgba(255, 255, 255, 0.2);
  --white-03: rgba(255, 255, 255, 0.3);
  --white-04: rgba(255, 255, 255, 0.4);
  --white-06: rgba(255, 255, 255, 0.6);

  --black-03: rgba(0, 0, 0, 0.3);
  --black-04: rgba(0, 0, 0, 0.4);
  --black-06: rgba(0, 0, 0, 0.6);
  --overlay-dark-95: rgba(10, 10, 10, 0.95);
  --overlay-menu-98: rgba(20, 20, 20, 0.98);
  --overlay-transparent: rgba(0, 0, 0, 0);

  /* Pink accent translucent variants (was rgba(255,203,203,x)) */
  --pink-08: rgba(255, 203, 203, 0.08);
  --pink-10: rgba(255, 203, 203, 0.1);
  --pink-15: rgba(255, 203, 203, 0.15);
  --pink-20: rgba(255, 203, 203, 0.2);
  --pink-28: rgba(255, 203, 203, 0.28);
  --pink-30: rgba(255, 203, 203, 0.3);
  --pink-35: rgba(255, 203, 203, 0.35);
  --pink-40: rgba(255, 203, 203, 0.4);
  --pink-50: rgba(255, 203, 203, 0.5);

  /* Danger translucent */
  --danger-95: rgba(220, 53, 69, 0.95);

  /* Divider colors (neutral by default; pink used only for subtle glow accents) */
  --divider-ring-color: rgba(255, 255, 255, 0.85);
  --divider-line-color: rgba(255, 255, 255, 0.18);
}

/* Color utility classes */
.first-color {
  background: var(--first-color);
}

.second-color {
  background: var(--second-color);
}

.third-color {
  background: var(--third-color);
}

.fourth-color {
  background: var(--fourth-color);
}

/* Brand color classes */
.bg-colorful {
  background: var(--first-color) !important;
}

.text-colorful {
  color: var(--first-color) !important;
}

.border-colorful {
  border-color: var(--first-color) !important;
}

/* Brand surface and border classes */
.bg-brand-surface {
  background: var(--dark-card) !important;
}

.border-brand-border {
  border-color: var(--pink-20) !important;
}

/* Text colors */
.text-accent-pink {
  color: var(--accent-pink);
}

.text-accent-blue {
  color: var(--accent-blue);
}

.bg-dark-primary {
  background-color: var(--dark-bg);
}

.bg-dark-secondary {
  background-color: var(--dark-secondary);
}

.bg-dark-card {
  background-color: var(--dark-card);
}