:root {
  /* Primary colors */
  --primary-color: #006cb7; /* Main blue */
  --primary-alt-color: #c5e7ff; /* Light blue */
  --secondary-color: #936435; /* Brown */
  --error-color: #dc3545; /* Red */
  /* Neutral shades */
  --white: #ffffff;
  --white-1: #edeff0;
  --white-2: #b3b3b3;
  --white-3: #dbdbdb;
  --white-4: #f7f7f7;
  --white-5: #b8b8b8;
  --white-6: #f7f9fc;
  --black: #000000;
  --black-1: #333333;
  --black-2: #454545;
  --black-3: #7b7b7b;
  /* Blues */
  --blue-1: #006cb7;
  --blue-2: #002d4d;
  --blue-3: #232e3d;
  --blue-4: #005895;
  --blue-5: #d9e9f4;
  --blue-6: #00c1ff;
  /* Grays */
  --gray-bg: #f4f5f5;
  --gray-light: #f2f2f2;
  --gray-2: #cccccc;
  /* Accent colors */
  --yellow-1: #fbc412; /* Main yellow */
  --yellow-2: #fde289; /* Light yellow */
  --green-1: #59ba47; /* Green */
  /* Card-specific colors */
  --card-green: #ddf0da;
  --card-blue: #ccf3ff;
  --card-01: #a2daf3;
  --card-02: #ffbcb7;
  --card-03: #b8ecb6;
  --card-04: #ffe17e;
  --card-05: #f2f2f2;
  /* Card border colors */
  --card-border-01: #006cb7; /* Matches --blue-1 */
  --card-border-02: #f35b18; /* Orange */
  --card-border-03: #26a146; /* Green */
  --card-border-04: #fbc412; /* Yellow */
  --card-border-05: #808080; /* Gray */
  /* States and gradients */
  --hover-color: var(--primary-color);
  --border-color-1: var(--yellow-1);
  --border-color-2: var(--white-2);
  --border-color-3: var(--white-3);
  --border-color-4: var(--gray-2);
  --border-color-5: var(--gray-light);
  --border-color-6: var(--white);
  --blue-light-gradient: linear-gradient(180deg, rgba(0, 108, 183, 0.85) 0%, rgba(0, 45, 77, 0.85) 100%);
  /* Links and hover effects */
  --normal-link-color: var(--blue-1);
  --hover-c1: #707070; /* Gray */
  --hover-c2: #009edb; /* Bright blue */
  /* Background colors */
  --bg-c1: #f4f5f5; /* Light gray */
  --bg-c2: #edf8ff; /* Pale blue */
  --bg-c3: #e22e2e; /* Red */
  --bg-c4: #01395b; /* Dark blue-green */
  --bg-c6: #212125; /* Dark gray-black */
  /* Font colors */
  --fc-c1: #808080; /* Mid-gray */
  /* RGB colors */
  --rgb-c1: 0, 193, 255; /* Cyan */
  --rgb-c2: 0, 0, 0; /* Black */
  --rgb-c3: 255, 255, 255; /* White */
  --rgb-blue-2: 0, 45, 77; /* Matches --blue-2 */
}

.dialog-off-canvas-main-canvas {
  background: var(--white);
}