/* colorpalette.css */
:root {
  /* Primary Colors */
  --primary-red: #8B0000;
  --light-red: #B22222;
  --golden-yellow: #FFC857;
  --light-gray: #F5F5F5;
  --white: #FFFFFF;
  
  /* Text Colors */
  --text-dark: #333333;
  --text-light: #666666;
  --text-white: #FFFFFF;
  
  /* Background Colors */
  --bg-light: #F5F5F5;
  --bg-white: #FFFFFF;
  --bg-dark: #333333;
  
  /* Border Colors */
  --border-light: #E0E0E0;
  --border-medium: #CCCCCC;
  --border-dark: #8B0000;
  
  /* State Colors */
  --success: #28A745;
  --warning: #FFC107;
  --error: #DC3545;
  --info: #17A2B8;
}

/* Utility Classes */
.bg-primary { background-color: var(--primary-red) !important; }
.bg-light { background-color: var(--light-gray) !important; }
.bg-accent { background-color: var(--golden-yellow) !important; }
.bg-white { background-color: var(--white) !important; }

.text-primary { color: var(--primary-red) !important; }
.text-accent { color: var(--golden-yellow) !important; }
.text-white { color: var(--white) !important; }
.text-dark { color: var(--text-dark) !important; }
.text-light { color: var(--text-light) !important; }

.border-primary { border-color: var(--primary-red) !important; }
.border-accent { border-color: var(--golden-yellow) !important; }
.border-light { border-color: var(--border-light) !important; }

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

.btn-primary:hover {
  background-color: var(--light-red);
  border-color: var(--light-red);
}

.btn-accent {
  background-color: var(--golden-yellow);
  border-color: var(--golden-yellow);
  color: var(--text-dark);
}

.btn-accent:hover {
  background-color: #FFB830;
  border-color: #FFB830;
}