/* Color variables - fallback to hardcoded colors, prefer branding variables */

/* Primary colors (Blues) */
$primary: var(--mosaic-secondary, #1478af);
$primary-dark: var(--mosaic-accent, #00467d);
$primary-light: var(--mosaic-primary, #28aae1);
$primary-lighter: color-mix(in srgb, var(--mosaic-primary, #28aae1) 80%, white);

/* Neutral colors (Grays) */
$neutral: var(--mosaic-neutral, #b7b7b7);
$neutral-dark: var(--mosaic-neutral-1, #707070);
$neutral-light: var(--mosaic-neutral-2, #dddddd);
$neutral-lighter: var(--mosaic-neutral-3, #eeeeee);

/* Semantic colors */
$error: var(--mosaic-error, #f06c55);
$warning: var(--mosaic-warning, #ffc81a);
$success: var(--mosaic-success, #95c852);

/* Additional colors */
$neutral-gray: #9d9d9d;

/* TextButton component additional vars */
$text-button-navigation-bg: $primary-light;
$text-button-navigation-hover-bg: $primary-lighter;
$text-button-navigation-active-bg: white;
$text-button-navigation-active-color: $primary-light;
$text-button-navigation-disabled-bg: $neutral;
$text-button-context-color: $primary;
$text-button-context-border-color: $primary;
$text-button-context-hover-border-color: $primary;
$text-button-context-hover-shadow-color: $primary;
$text-button-context-active-bg: $primary;
$text-button-context-disabled-border-color: $neutral;
$text-button-context-disabled-color: $neutral;
$text-button-active-bg: $primary;
$text-button-active-hover-bg: $primary-lighter;
$text-button-active-active-color: $primary;
$text-button-active-disabled-bg: $neutral;

/* Login component additional vars */
$login-header-color: $primary-dark;
$login-auth-title-color: $primary-dark;
$login-tile-border-color: $neutral;
$login-tile-color: $neutral-dark;
$login-tile-hover-border-color: $primary-light;
$login-tile-hover-shadow-color: $primary-light;
$login-tabs-bg-color: $neutral-light;
$login-tabs-color: $primary;
$login-tab-active-bg-color: #ffffff;
$login-tab-active-border-color: $neutral-light;
$login-tab-active-color: $primary-dark;
$login-tab-hover-bg-color: $primary;
$login-input-hover-border-color: $primary-light;
$login-input-hover-shadow-color: $primary-light;
$login-input-error-border-color: $error;
$login-input-error-shadow-color: $error;
$login-error-message-color: $error;
$login-button-bg-color: $primary-light;
$login-button-hover-bg-color: $primary-lighter;
$login-separator-border-color: $neutral-light;
$login-separator-text-color: $neutral-gray;
$login-button-idp-color: $neutral-dark;
$login-button-idp-border-color: $neutral;
$login-button-idp-hover-border-color: $primary-light;
$login-button-idp-hover-shadow-color: $primary-light;
$login-text-color: $neutral-dark;
$login-link-color: $primary-light;

/* Message component additional vars */
$message-text-color: $neutral-dark;
$message-error-bg-color: $error;
$message-error-icon-bg: $error;
$message-info-bg-color: $neutral-lighter;
$message-info-icon-bg: $neutral-dark;
$message-success-bg-color: $success;
$message-success-icon-bg: $success;
$message-warning-bg-color: $warning;
$message-warning-icon-bg: $warning;

/* EnsureAuthentication component additional vars */
$ensure-auth-bg-color: $primary-dark;
$ensure-auth-loading-message-color: $neutral;

/* PermissionDeniedError component additional vars */
$permission-denied-error-color: $error;
$permission-denied-body-color: $neutral-dark;
$permission-denied-link-color: $primary-light;
