:root {
    --app-color-primary: #1383c6; /* Primary color */
    --app-color-primary-active: #1868a5; /* Primary color (active state) */
    --app-color-primary-disabled: #389dd1; /* Primary color (disabled state) */
    --app-color-primary-light: #dae5f4;
    --app-color-primary-opaque-1: #1383c610; /* Primary color + 05 (at end) */
    --app-color-primary-opaque-2: #1383c615; /* Primary color + 15 (at end) */
    --app-color-primary-opaque-3: #1383c625; /* Primary color + 25 (at end) */
    --app-color-primary-opaque-4: #1383c635; /* Primary color + 35 (at end) */
    --app-color-secondary: #b5d553; /* Secondary color */
    --app-color-secondary-active: #91aa42; /* Secondary color (active state) */
    --app-color-secondary-disabled: #d3e698; /* Secondary color (disabled state) */
    --app-color-secondary-opaque-1: #91aa4210; /* Primary color + 05 (at end) */
    --app-color-secondary-opaque-2: #91aa4215; /* Primary color + 15 (at end) */
    --app-color-secondary-opaque-3: #91aa4225; /* Primary color + 25 (at end) */
    --app-color-secondary-opaque-4: #91aa4235; /* Primary color + 35 (at end) */
}