:root {
  --color-dark-blue: #042d58;
  --color-medium-blue: #27496D;
  --color-teal: #0C7B93;
  --color-bright-cyan: #00A8CC;

  /* Additional colors for consistency */
  --color-light-blue: #A8D8EA;
  --color-off-white: #F8F9FA;
  --color-gray: #6C757D;
  --color-dark-gray: #343A40;
  --color-white: #FFFFFF;

  /* Text colors */
  --text-primary: var(--color-dark-blue);
  --text-secondary: var(--color-gray);
  --text-light: var(--color-dark-gray);

  /* Background colors */
  --bg-primary: var(--color-off-white);
  --bg-secondary: var(--color-light-blue);

  /* Border colors */
  --border-primary: var(--color-light-blue);

  /* Button colors */
  --btn-primary-bg: var(--color-dark-blue);
  --btn-primary-hover: var(--color-medium-blue);
  --btn-secondary-bg: var(--color-bright-cyan);
  --btn-secondary-hover: var(--color-teal);

  /* Shadow colors */
  --shadow-light: rgba(0, 0, 0, 0.05);
  --shadow-medium: rgba(0, 0, 0, 0.1);
  --shadow-dark: rgba(0, 0, 0, 0.15);
}