:root {
  /* Primary Brand Color */
  --primary: #233265;
  --primary-light-10: #344276;
  --primary-light-25: #4e5a8a;
  --primary-light-50: #7c83a7;
  --primary-light-75: #a9acc3;
  --primary-light-90: #d6d6e0;
  --primary-dark-10: #1e2c59;
  --primary-dark-25: #182348;
  --primary-dark-50: #121a36;
  --primary-dark-75: #0c1124;

  /* Accent Colors */
  --accent-gold: #ffd700;
  --accent-teal: #008080;
  --accent-coral: #ff6f61;
  --accent-lime: #a4c639;

  /* Neutral Colors */
  --white: #ffffff;
  --light-grey: #f0f0f0;
  --medium-grey: #cccccc;
  --dark-grey: #333333;
  --black: #000000;
}

/* Buttons */
.ua-btn {
  padding: 0.6rem 1.2rem;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease;
  color: white;
}

.ua-btn-primary {
  background-color: var(--primary);
  color: white;
}

.ua-btn-primary:hover {
  background-color: var(--primary-light-10);
}

.ua-btn-primary-outline {
  background-color: transparent;
  border: 2px solid var(--primary);
  color: var(--primary);
}

.ua-btn-primary-outline:hover {
  background-color: var(--primary-light-10);
  color: white;
}

.ua-btn-primary-ghost {
  background-color: transparent;
  color: var(--primary);
}

.ua-btn-primary-ghost:hover {
  background-color: var(--primary-light-90);
}

.ua-btn-primary-disabled,
.ua-btn-primary-disabled:hover {
  background-color: var(--primary-light-75);
  color: var(--primary-light-90);
  cursor: not-allowed;
}

/* Cards */
.ua-card {
  background-color: var(--white);
  border: 1px solid var(--primary-light-75);
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 4px 8px rgba(35, 50, 101, 0.1);
  margin: 1rem 0;
}

/* Alerts */
.ua-alert {
  padding: 1rem;
  border-radius: 6px;
  margin-bottom: 1rem;
  font-weight: 500;
}

.ua-alert-success {
  background-color: #eaf7da;
  color: #3a7a00;
}

.ua-alert-warning {
  background-color: #fff8e6;
  color: #b38600;
}

.ua-alert-error {
  background-color: #fde8e8;
  color: #d93025;
}

/* Form Fields */
.ua-input {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--primary-light-75);
  border-radius: 6px;
  margin-top: 0.5rem;
  margin-bottom: 1rem;
  background-color: white;
  font-size: 1rem;
  color: var(--dark-grey);
}

.ua-input:focus {
  border-color: var(--primary);
  outline: none;
}

/* Background Utilities */
.ua-bg-primary {
  background-color: var(--primary) !important;
}
.ua-bg-primary-light-10 {
  background-color: var(--primary-light-10) !important;
}
.ua-bg-primary-light-25 {
  background-color: var(--primary-light-25) !important;
}
.ua-bg-primary-light-50 {
  background-color: var(--primary-light-50) !important;
}
.ua-bg-primary-light-75 {
  background-color: var(--primary-light-75) !important;
}
.ua-bg-primary-light-90 {
  background-color: var(--primary-light-90) !important;
}
.ua-bg-primary-dark-10 {
  background-color: var(--primary-dark-10) !important;
}
.ua-bg-primary-dark-25 {
  background-color: var(--primary-dark-25) !important;
}
.ua-bg-primary-dark-50 {
  background-color: var(--primary-dark-50) !important;
}
.ua-bg-primary-dark-75 {
  background-color: var(--primary-dark-75) !important;
}

.ua-bg-accent-gold {
  background-color: var(--accent-gold);
}
.ua-bg-accent-teal {
  background-color: var(--accent-teal);
}
.ua-bg-accent-coral {
  background-color: var(--accent-coral);
}
.ua-bg-accent-lime {
  background-color: var(--accent-lime);
}

.ua-bg-white {
  background-color: var(--white);
}
.ua-bg-light-grey {
  background-color: var(--light-grey);
}
.ua-bg-medium-grey {
  background-color: var(--medium-grey) !important;
}
.ua-bg-dark-grey {
  background-color: var(--dark-grey);
}
.ua-bg-black {
  background-color: var(--black);
}

/* Text Utilities */
.ua-text-primary {
  color: var(--primary);
}
.ua-text-primary-light-10 {
  color: var(--primary-light-10) !important;
}
.ua-text-primary-light-25 {
  color: var(--primary-light-25) !important;
}
.ua-text-primary-light-50 {
  color: var(--primary-light-50) !important;
}
.ua-text-primary-light-75 {
  color: var(--primary-light-75) !important;
}
.ua-text-primary-light-90 {
  color: var(--primary-light-90) !important;
}
.ua-text-primary-dark-10 {
  color: var(--primary-dark-10);
}
.ua-text-primary-dark-25 {
  color: var(--primary-dark-25);
}
.ua-text-primary-dark-50 {
  color: var(--primary-dark-50);
}
.ua-text-primary-dark-75 {
  color: var(--primary-dark-75) !important;
}

.ua-text-accent-gold {
  color: var(--accent-gold) !important;
}
.ua-text-accent-teal {
  color: var(--accent-teal);
}
.ua-text-accent-coral {
  color: var(--accent-coral);
}
.ua-text-accent-lime {
  color: var(--accent-lime);
}

.ua-text-white {
  color: var(--white);
}
.ua-text-light-grey {
  color: var(--light-grey);
}
.ua-text-medium-grey {
  color: var(--medium-grey);
}
.ua-text-dark-grey {
  color: var(--dark-grey);
}
.ua-text-black {
  color: var(--black);
}

/* Border Utilities */
.ua-border-primary {
  border: 1px solid var(--primary);
}
.ua-border-primary-light-10 {
  border: 1px solid var(--primary-light-10);
}
.ua-border-primary-light-25 {
  border: 1px solid var(--primary-light-25) !important;
}
.ua-border-primary-light-50 {
  border: 1px solid var(--primary-light-50);
}
.ua-border-primary-light-75 {
  border: 1px solid var(--primary-light-75);
}
.ua-border-primary-light-90 {
  border: 1px solid var(--primary-light-90);
}
.ua-border-primary-dark-10 {
  border: 1px solid var(--primary-dark-10);
}
.ua-border-primary-dark-25 {
  border: 1px solid var(--primary-dark-25);
}
.ua-border-primary-dark-50 {
  border: 1px solid var(--primary-dark-50);
}
.ua-border-primary-dark-75 {
  border: 1px solid var(--primary-dark-75);
}

.ua-border-accent-gold {
  border: 1px solid var(--accent-gold);
}
.ua-border-accent-teal {
  border: 1px solid var(--accent-teal);
}
.ua-border-accent-coral {
  border: 1px solid var(--accent-coral);
}
.ua-border-accent-lime {
  border: 1px solid var(--accent-lime);
}

.ua-border-white {
  border: 1px solid var(--white);
}
.ua-border-light-grey {
  border: 1px solid var(--light-grey);
}
.ua-border-medium-grey {
  border: 1px solid var(--medium-grey);
}
.ua-border-dark-grey {
  border: 1px solid var(--dark-grey);
}
.ua-border-black {
  border: 1px solid var(--black);
}

/* Hover Background Utilities */
.ua-bg-primary-hover:hover {
  background-color: var(--primary);
}
.ua-bg-primary-light-10-hover:hover {
  background-color: var(--primary-light-10);
}
.ua-bg-primary-light-25-hover:hover {
  background-color: var(--primary-light-25);
}
.ua-bg-primary-light-50-hover:hover {
  background-color: var(--primary-light-50);
}
.ua-bg-primary-light-75-hover:hover {
  background-color: var(--primary-light-75);
}
.ua-bg-primary-light-90-hover:hover {
  background-color: var(--primary-light-90);
}
.ua-bg-primary-dark-10-hover:hover {
  background-color: var(--primary-dark-10);
}
.ua-bg-primary-dark-25-hover:hover {
  background-color: var(--primary-dark-25);
}
.ua-bg-primary-dark-50-hover:hover {
  background-color: var(--primary-dark-50);
}
.ua-bg-primary-dark-75-hover:hover {
  background-color: var(--primary-dark-75);
}

.ua-bg-accent-gold-hover:hover {
  background-color: var(--accent-gold);
}
.ua-bg-accent-teal-hover:hover {
  background-color: var(--accent-teal);
}
.ua-bg-accent-coral-hover:hover {
  background-color: var(--accent-coral);
}
.ua-bg-accent-lime-hover:hover {
  background-color: var(--accent-lime);
}

.ua-bg-white-hover:hover {
  background-color: var(--white);
}
.ua-bg-light-grey-hover:hover {
  background-color: var(--light-grey);
}
.ua-bg-medium-grey-hover:hover {
  background-color: var(--medium-grey);
}
.ua-bg-dark-grey-hover:hover {
  background-color: var(--dark-grey);
}
.ua-bg-black-hover:hover {
  background-color: var(--black);
}

/* Hover Text Utilities */
.ua-text-primary-hover:hover {
  color: var(--primary);
}
.ua-text-primary-light-10-hover:hover {
  color: var(--primary-light-10);
}
.ua-text-primary-light-25-hover:hover {
  color: var(--primary-light-25);
}
.ua-text-primary-light-50-hover:hover {
  color: var(--primary-light-50);
}
.ua-text-primary-light-75-hover:hover {
  color: var(--primary-light-75);
}
.ua-text-primary-light-90-hover:hover {
  color: var(--primary-light-90);
}
.ua-text-primary-dark-10-hover:hover {
  color: var(--primary-dark-10);
}
.ua-text-primary-dark-25-hover:hover {
  color: var(--primary-dark-25);
}
.ua-text-primary-dark-50-hover:hover {
  color: var(--primary-dark-50);
}
.ua-text-primary-dark-75-hover:hover {
  color: var(--primary-dark-75);
}

.ua-text-accent-gold-hover:hover {
  color: var(--accent-gold);
}
.ua-text-accent-teal-hover:hover {
  color: var(--accent-teal);
}
.ua-text-accent-coral-hover:hover {
  color: var(--accent-coral);
}
.ua-text-accent-lime-hover:hover {
  color: var(--accent-lime);
}

.ua-text-white-hover:hover {
  color: var(--white);
}
.ua-text-light-grey-hover:hover {
  color: var(--light-grey);
}
.ua-text-medium-grey-hover:hover {
  color: var(--medium-grey);
}
.ua-text-dark-grey-hover:hover {
  color: var(--dark-grey);
}
.ua-text-black-hover:hover {
  color: var(--black);
}

/* Hover Border Utilities */
.ua-border-primary-hover:hover {
  border: 1px solid var(--primary);
}
.ua-border-primary-light-10-hover:hover {
  border: 1px solid var(--primary-light-10);
}
.ua-border-primary-light-25-hover:hover {
  border: 1px solid var(--primary-light-25);
}
.ua-border-primary-light-50-hover:hover {
  border: 1px solid var(--primary-light-50);
}
.ua-border-primary-light-75-hover:hover {
  border: 1px solid var(--primary-light-75);
}
.ua-border-primary-light-90-hover:hover {
  border: 1px solid var(--primary-light-90);
}
.ua-border-primary-dark-10-hover:hover {
  border: 1px solid var(--primary-dark-10);
}
.ua-border-primary-dark-25-hover:hover {
  border: 1px solid var(--primary-dark-25);
}
.ua-border-primary-dark-50-hover:hover {
  border: 1px solid var(--primary-dark-50);
}
.ua-border-primary-dark-75-hover:hover {
  border: 1px solid var(--primary-dark-75);
}

.ua-border-accent-gold-hover:hover {
  border: 1px solid var(--accent-gold);
}
.ua-border-accent-teal-hover:hover {
  border: 1px solid var(--accent-teal);
}
.ua-border-accent-coral-hover:hover {
  border: 1px solid var(--accent-coral);
}
.ua-border-accent-lime-hover:hover {
  border: 1px solid var(--accent-lime);
}

.ua-border-white-hover:hover {
  border: 1px solid var(--white);
}
.ua-border-light-grey-hover:hover {
  border: 1px solid var(--light-grey);
}
.ua-border-medium-grey-hover:hover {
  border: 1px solid var(--medium-grey);
}
.ua-border-dark-grey-hover:hover {
  border: 1px solid var(--dark-grey);
}
.ua-border-black-hover:hover {
  border: 1px solid var(--black);
}
