/* public/assets/css/theme.css */

/* Custom Color Theme Classes */
.bg-brand-red { background-color: #DC2626 !important; }
.bg-brand-red-dark { background-color: #B91C1C !important; }
.bg-brand-red-light { background-color: #FEF2F2 !important; }

.text-brand-red { color: #DC2626 !important; }
.text-brand-red-dark { color: #B91C1C !important; }

.border-brand-red { border-color: #DC2626 !important; }

/* Secondary Blue Utilities */
.bg-school-blue { background-color: #1D4ED8 !important; }
.bg-school-blue-light { background-color: #EFF6FF !important; }
.text-school-blue { color: #1D4ED8 !important; }

/* Gold Accent Utilities */
.bg-school-gold { background-color: #D97706 !important; }
.bg-school-gold-light { background-color: #FEF3C7 !important; }
.text-school-gold { color: #D97706 !important; }

/* Navy Dark Utilities */
.bg-school-navy { background-color: #0F172A !important; }
.bg-school-navy-soft { background-color: #1E293B !important; }
.text-school-navy { color: #0F172A !important; }

/* Global Button System */
.btn-primary-red {
  background-color: #DC2626;
  color: #FFFFFF;
  font-weight: 600;
  border-radius: 0.75rem; /* rounded-xl */
  padding: 0.75rem 1.75rem;
  transition: all 0.25s ease-in-out;
  box-shadow: 0 10px 15px -3px rgba(220, 38, 38, 0.25);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.btn-primary-red:hover {
  background-color: #B91C1C;
  transform: translateY(-2px);
  box-shadow: 0 12px 20px -3px rgba(185, 28, 28, 0.35);
  color: #FFFFFF;
}

.btn-secondary-outline {
  background-color: #FFFFFF;
  color: #DC2626;
  border: 1.5px solid #DC2626;
  font-weight: 600;
  border-radius: 0.75rem;
  padding: 0.75rem 1.75rem;
  transition: all 0.25s ease-in-out;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.btn-secondary-outline:hover {
  background-color: #FEF2F2;
  color: #B91C1C;
  transform: translateY(-2px);
}

/* Card Styling */
.card-brand {
  background-color: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 1rem;
  transition: all 0.3s ease;
}

.card-brand:hover {
  border-color: rgba(220, 38, 38, 0.3);
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.08);
  transform: translateY(-4px);
}