:root {
  --font-sans:
    "Montserrat", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif:
    "Roboto Slab", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono:
    "Roboto Mono", ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;

  /* Responsive Font Size Variables */
  --mui-fs-tiny: clamp(0.7rem, 0.7rem + 0.1vw, 0.8rem);
  --mui-fs-xxs: clamp(0.8rem, 0.8rem + 0.1vw, 0.9rem);
  --mui-fs-xs: clamp(0.9rem, 0.85rem + 0.2vw, 1rem);
  --mui-fs-sm: clamp(0.95rem, 0.9rem + 0.3vw, 1.1rem);

  /* Base Body Text - Keep this stable for readability */
  --mui-fs-base: clamp(1rem, 0.95rem + 0.4vw, 1.125rem);

  /* Headings - More controlled growth */
  --mui-fs-md: clamp(1.15rem, 1.1rem + 0.8vw, 1.5rem);
  --mui-fs-lg: clamp(1.35rem, 1.2rem + 1.5vw, 2rem);
  --mui-fs-xl: clamp(1.75rem, 1.5rem + 2.5vw, 3rem);
  --mui-fs-xxl: clamp(2.25rem, 2rem + 4vw, 4.5rem);
  --mui-fs-huge: clamp(3rem, 2.5rem + 6vw, 6rem);

  /* Line Height Variables for Better Readability */
  --mui-lh-tight: 1.2;
  --mui-lh-base: 1.5;
  --mui-lh-loose: 1.8;

  /* Letter Spacing for Better Readability */
  --mui-ls-tight: -0.05em;
  --mui-ls-normal: 0;
  --mui-ls-wide: 0.05em;

  --mui-pending-orange: 194, 122, 41;
  --mui-progress-blue: 0, 119, 200;
  --mui-submitted-purple: 104, 81, 255;
  --mui-review-gold: 205, 149, 12;
  --mui-success-green: 22, 163, 74;
  --mui-failed-red: 220, 38, 38;
  --mui-expired-gray: 107, 114, 128;

  --mui-forest-green: 43, 102, 92;
  --mui-mint-green: #dfefca;
  --mui-lime-green: #e2dc54;
  --mui-tangerine: #f45c27;
  --mui-sky-blue: #add0ee;
  --mui-berry-purple: #6d2d59;
  --mui-deep-blue: #032f98;
  --mui-purple: #5c38ff;
  --mui-lavender: #d1c4e9;
  --mui-error-red: #dc3545;
}

:root,
[data-bs-theme="light"] {
  --mui-base: #fff;
  --mui-surface: rgba(255, 255, 255, 1);
  --mui-surface-border: #dbe3ea;

  --mui-primary: 49, 52, 154;
  --mui-secondary: 255, 182, 0;
  --mui-accent: 217, 46, 138;
  --mui-accent-light: 250, 255, 255;
  --mui-text-light: 131, 131, 131;

  --mui-card-border: 226, 226, 226;
  --mui-card-body: 255, 255, 255;

  color-scheme: light;
}

[data-bs-theme="dark"] {
  --mui-base: #fff;
  --mui-surface: #000000;
  --mui-surface-border: #262626;

  --mui-primary: 49, 52, 154;
  --mui-accent: 255, 255, 255;
  --mui-accent-light: 23, 23, 23;

  --mui-card-border: 38, 38, 38;
  --mui-card-body: 15, 15, 15;

  color-scheme: dark;
}

/* NEW */
.mui-min-nav-h {
  height: 50px;
}

.mui-primary-button {
  background-color: rgba(var(--mui-primary), 1);
  color: var(--mui-base);
  border: 1px solid rgba(var(--mui-primary), 1);
  padding: 8px 16px;
  transition: all 0.3s ease;
  font-size: var(--mui-fs-xxs);
  text-decoration: none;
}
.mui-primary-button:hover {
  background-color: rgba(var(--mui-secondary), 1);
  border: 1px solid rgba(var(--mui-secondary), 1);
}

.mui-secondary-button {
  background-color: rgba(var(--mui-secondary), 1);
  color: var(--mui-base);
  border: 1px solid rgba(var(--mui-secondary), 1);
  padding: 8px 16px;
  transition: all 0.3s ease;
  font-size: var(--mui-fs-xxs);
  text-decoration: none;
}
.mui-secondary-button:hover {
  background-color: rgba(var(--mui-accent), 1);
  border: 1px solid rgba(var(--mui-accent), 1);
}

.mui-primary-outline {
  background-color: transparent;
  color: rgba(var(--mui-primary), 1);
  border: 1px solid rgba(var(--mui-primary), 1);
  padding: 8px 16px;
  transition: all 0.3s ease;
  font-size: var(--mui-fs-xxs);
  text-decoration: none;
}
.mui-primary-outline:hover {
  border: 1px solid rgba(var(--mui-secondary), 1);
  color: rgba(var(--mui-secondary), 1);
}
.mui-secondary-outline {
  background-color: transparent;
  color: rgba(var(--mui-secondary), 1);
  border: 1px solid rgba(var(--mui-secondary), 1);
  padding: 8px 16px;
  transition: all 0.3s ease;
  font-size: var(--mui-fs-xxs);
  text-decoration: none;
}
.mui-secondary-outline:hover {
  border: 1px solid rgba(var(--mui-accent), 1);
  color: rgba(var(--mui-accent), 1);
}

.mui-primary-link {
  background-color: transparent;
  color: rgba(var(--mui-primary), 1);
  border: none;
  padding: 0px;
  transition: all 0.3s ease;
  font-size: var(--mui-fs-xxs);
  text-decoration: none;
}

.mui-link-inherit {
  font-size: inherit;
}

.mui-form .row {
  margin-bottom: 0.5rem;
}

.mui-form .form-group .form-label {
  margin-bottom: 0.1rem;
  font-size: var(--mui-fs-xxs);
}

.mui-form .form-group .error {
  color: var(--mui-error-red);
}

.mui-fs-tiny {
  font-size: var(--mui-fs-tiny);
}

.mui-fs-xxs {
  font-size: var(--mui-fs-xxs);
}

.mui-fs-xs {
  font-size: var(--mui-fs-xs);
}

.mui-fs-sm {
  font-size: var(--mui-fs-sm);
}

.mui-fs-base {
  font-size: var(--mui-fs-base);
}

.mui-fs-md {
  font-size: var(--mui-fs-md);
}

.mui-fs-lg {
  font-size: var(--mui-fs-lg);
}

.mui-fs-xl {
  font-size: var(--mui-fs-xl);
}

.mui-fs-xxl {
  font-size: var(--mui-fs-xxl);
}

.mui-fs-huge {
  font-size: var(--mui-fs-huge);
}

.mui-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: var(--mui-fs-tiny);
  font-weight: 600;
  padding: 0rem 0.35rem;
  border-radius: 0.5rem;
  border: 1px solid transparent;
}

.mui-badge-ghost {
  padding: 0;
  background-color: transparent !important;
  border-radius: 0 !important;
  border: none !important;
}

.mui-badge-underline {
  border-bottom: 1px solid currentColor;
}

.mui-badge-inherit {
  font-size: inherit;
}

.mui-badge .bi {
  margin-right: 0.25rem;
}

.mui-badge-pending {
  background-color: rgba(var(--mui-pending-orange), 0.1);
  color: rgba(var(--mui-pending-orange), 1);
  border-color: rgba(var(--mui-pending-orange), 0.2);
}

.mui-badge-progress {
  background-color: rgba(var(--mui-progress-blue), 0.1);
  color: rgba(var(--mui-progress-blue), 1);
  border-color: rgba(var(--mui-progress-blue), 0.2);
}

.mui-badge-submitted {
  background-color: rgba(var(--mui-submitted-purple), 0.1);
  color: rgba(var(--mui-submitted-purple), 1);
  border-color: rgba(var(--mui-submitted-purple), 0.2);
}

.mui-badge-review {
  background-color: rgba(var(--mui-review-gold), 0.1);
  color: rgba(var(--mui-review-gold), 1);
  border-color: rgba(var(--mui-review-gold), 0.2);
}

.mui-badge-success {
  background-color: rgba(var(--mui-success-green), 0.1);
  color: rgba(var(--mui-success-green), 1);
  border-color: rgba(var(--mui-success-green), 0.2);
}

.mui-badge-failed {
  background-color: rgba(var(--mui-failed-red), 0.1);
  color: rgba(var(--mui-failed-red), 1);
  border-color: rgba(var(--mui-failed-red), 0.2);
}

.mui-badge-expired {
  background-color: rgba(var(--mui-expired-gray), 0.1);
  color: rgba(var(--mui-expired-gray), 1);
  border-color: rgba(var(--mui-expired-gray), 0.2);
}

.mui-text-primary {
  color: rgba(var(--mui-primary), 1);
}

.mui-text-secondary {
  color: rgba(var(--mui-secondary), 1);
}

.mui-text-accent {
  color: rgba(var(--mui-accent), 1);
}

.mui-bg-primary {
  background-color: rgba(var(--mui-primary), 1);
}

.mui-bg-secondary {
  background-color: rgba(var(--mui-secondary), 1);
}

.mui-bg-accent {
  background-color: rgba(var(--mui-accent), 1);
}

.mui-bg-accent-light {
  background-color: rgba(var(--mui-accent-light), 1);
}

.mui-font-serif {
  font-family: var(--font-serif);
}
