/* Alamthal Color Palette - Based on logo.svg colors */

/* Primary Colors */
:root {
  /* Sky Blue - ازرق سماوي (same shade as logo) */
  --sky-blue: white;
  --sky-blue-rgb: 62, 187, 237;

  /* Dark Purple - بنفسجي داكن */
  --dark-purple: #2e3790;
  --dark-purple-rgb: 46, 55, 144;

  /* Light Purple - بنفسجي فاتح */
  --light-purple: #6d5ba6;
  --light-purple-rgb: 109, 91, 166;

  /* Additional Logo Colors */
  --logo-purple-1: #5452a3;
  --logo-purple-1-rgb: 84, 82, 163;

  --logo-purple-2: white;
  --logo-purple-2-rgb: 101, 128, 192;

  /* Text Colors */
  --text-dark: #010101;

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, var(--sky-blue) 0%, var(--light-purple) 100%);
  --gradient-secondary: linear-gradient(135deg, var(--dark-purple) 0%, var(--light-purple) 100%);
  --gradient-accent: linear-gradient(135deg, var(--light-purple) 0%, var(--sky-blue) 100%);
}

/* Utility Classes */
.sky-blue-bg { background-color: var(--sky-blue); }
.sky-blue-text { color: var(--sky-blue); }

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

.light-purple-bg { background-color: var(--light-purple); }
.light-purple-text { color: var(--light-purple); }

.logo-purple-1-bg { background-color: var(--logo-purple-1); }
.logo-purple-1-text { color: var(--logo-purple-1); }

.logo-purple-2-bg { background-color: var(--logo-purple-2); }
.logo-purple-2-text { color: var(--logo-purple-2); }

/* Gradient Backgrounds */
.gradient-primary { background: var(--gradient-primary); }
.gradient-secondary { background: var(--gradient-secondary); }
.gradient-accent { background: var(--gradient-accent); }

/* Hover Effects */
.sky-blue-hover:hover { background-color: var(--sky-blue); color: white; }
.dark-purple-hover:hover { background-color: var(--dark-purple); color: white; }
.light-purple-hover:hover { background-color: var(--light-purple); color: white; }

/* Border Colors */
.border-sky-blue { border-color: var(--sky-blue); }
.border-dark-purple { border-color: var(--dark-purple); }
.border-light-purple { border-color: var(--light-purple); }

/* Focus States */
.focus-sky-blue:focus { outline-color: var(--sky-blue); }
.focus-dark-purple:focus { outline-color: var(--dark-purple); }
.focus-light-purple:focus { outline-color: var(--light-purple); }