@font-face {
  font-family: 'Cairo';
  src: url('../fonts/Cairo-VariableFont_slnt,wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-primary: #0d9a7c;
  --color-secondary: #193c67;
  --color-accent: #1b6c6e;
  --color-success: #28a745;
  --color-warning: #ffc107;
  --color-danger: #dc3545;
  --color-info: #17a2b8;

  --color-text: #333333;
  --color-muted: #6c757d;
  --color-bg: #ffffff;
  --color-bg-alt: #f8f9fa;
  --border-color: #e9ecef;
  /* shared radii */
  --radius-card: 8px;

  --color-primary-rgb: 0, 181, 231;
  --header-height: 0px;
  --color-dark: #03404e;
  --color-medium: #1b6c6e;
  --text-light: #f2fbfe;
  --bs-card-bg: #f2fbfe;
}

.course-default {
  border-radius: var(--radius-card) !important;
}

/* Utility classes */
.text-primary { color: var(--color-primary) !important; }
.text-secondary { color: var(--color-secondary) !important; }
.text-muted { color: var(--color-muted) !important; }
.bg-primary { background-color: var(--color-primary) !important; }
.bg-secondary { background-color: var(--color-secondary) !important; }
.bg-light { background-color: var(--color-bg-alt) !important; }
.bg-white { background-color: var(--color-bg) !important; }
.border-color { border-color: var(--border-color) !important; }

/* Button helpers (optional) */
.btn-primary { background-color: var(--color-primary) !important; border-color: var(--color-primary) !important; }
.btn-secondary { background-color: var(--color-secondary) !important; border-color: var(--color-secondary) !important; }