/* ==========================================
   ALERTS
   Стилі для сповіщень та алертів
   ========================================== */

/* ==========================================
   BASE ALERT
   ========================================== */
.alert {
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
}

/* ==========================================
   ALERT VARIANTS
   ========================================== */
.alert-primary {
  background-color: rgba(var(--rgb-green-500), 0.1);
  border-color: rgba(var(--rgb-green-500), 0.2);
  color: var(--primary-dark);
}

.alert-info {
  background-color: rgba(var(--rgb-teal-450), 0.1);
  border-color: rgba(var(--rgb-teal-450), 0.2);
  color: var(--info-dark);
}

.alert-warning {
  background-color: rgba(var(--rgb-amber-600), 0.1);
  border-color: rgba(var(--rgb-amber-600), 0.2);
  color: var(--color-amber-800);
}

.alert-danger {
  background-color: rgba(var(--rgb-red-500), 0.1);
  border-color: rgba(var(--rgb-red-500), 0.2);
  color: var(--color-red-850);
}

.alert-success {
  background-color: rgba(var(--rgb-green-450), 0.1);
  border-color: rgba(var(--rgb-green-450), 0.2);
  color: var(--color-green-800);
}

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

/* ==========================================
   DARK MODE - ALERTS
   ========================================== */
body.dark-mode .alert-info {
  background-color: var(--color-navy-900);
  border-color: rgba(var(--rgb-white), 0.1);
  color: var(--light);
}

body.dark-mode .alert-warning {
  background-color: var(--color-brown-950);
  border-color: rgba(var(--rgb-white), 0.1);
  color: var(--light);
}

body.dark-mode .alert-danger {
  background-color: var(--color-red-950);
  border-color: rgba(var(--rgb-white), 0.1);
  color: var(--light);
}

body.dark-mode .alert-success {
  background-color: var(--color-green-950);
  border-color: rgba(var(--rgb-white), 0.1);
  color: var(--light);
}

body.dark-mode .alert-primary {
  background-color: var(--color-navy-950);
  border-color: rgba(var(--rgb-white), 0.1);
  color: var(--light);
}

/* ==========================================
   BACKGROUND UTILITIES
   ========================================== */
body.dark-mode .bg-primary {
  background-color: var(--color-navy-950) !important;
}

body.dark-mode .bg-secondary {
  background-color: var(--color-teal-900) !important;
}

body.dark-mode .bg-light {
  background-color: var(--color-teal-850) !important;
}

body.dark-mode .bg-success {
  background-color: var(--color-green-900) !important;
}

body.dark-mode .bg-danger {
  background-color: var(--color-red-900) !important;
}

body.dark-mode .bg-warning {
  background-color: var(--color-amber-900) !important;
}

body.dark-mode .bg-info {
  background-color: var(--color-navy-850) !important;
}