:root {
  --quickstart-primary-color-light: #6074A1;
  --quickstart-primary-color-dark: #6074A1;
  --quickstart-primary-color: var(--quickstart-primary-color-light);
  --quickstart-secondary-color-light: #A0BCAC;
  --quickstart-secondary-color-dark: #A0BCAC;
  --quickstart-secondary-color: var(--quickstart-secondary-color-light);
  --quickstart-font-family: 'Inter', sans-serif;
  --quickstart-heading-font-family: inherit;
  --quickstart-logo-url: none;
  --quickstart-bg-logo-url: none;
  --quickstart-logo-height: 63px;
  --quickstart-logo-width: 300px;
  --quickstart-text-primary-light: #1a1a2e;
  --quickstart-text-primary-dark: #e8eaed;
  --quickstart-text-secondary-light: #374151;
  --quickstart-text-secondary-dark: #cbd5e1;
  --quickstart-bg-color-light: #6074A1;
  --quickstart-bg-color-dark: #6074A1;
  --quickstart-bg-color: var(--quickstart-bg-color-light);
  --quickstart-bg-image: none;
  --quickstart-border-radius: 8px;
  --quickstart-card-shadow: 0 20px 60px rgba(0, 0, 0, 0.3), 0 8px 20px rgba(0, 0, 0, 0.15);
}

html.pf-v5-theme-dark,
html.kcDarkModeClass {
  --quickstart-primary-color: var(--quickstart-primary-color-dark);
  --quickstart-secondary-color: var(--quickstart-secondary-color-dark);
  --quickstart-bg-color: var(--quickstart-bg-color-dark);
}

body,
body#keycloak-bg {
  margin: 0;
  background-color: var(--quickstart-bg-color);
}

.kcLogin,
.kcLoginClass {
  box-sizing: border-box;
  background-image: var(--quickstart-bg-image);
  background-color: var(--quickstart-bg-color);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

:root,
html:not(.kcDarkModeClass) body:not(.kcDarkModeClass),
html:not(.kcDarkModeClass) body#keycloak-bg:not(.kcDarkModeClass) {
  --quickstart-primary-color: #4f46e5;
  --quickstart-secondary-color: #06b6d4;
  --quickstart-gradient-bg-default: linear-gradient(135deg, #4f46e5 0%, #06b6d4 100%);
  --quickstart-bg-color: #f6f5f4;
  --quickstart-bg-image: none;
  --quickstart-bg-logo-url: none;
  --keycloak-bg-logo-url: none;
  --quickstart-border-radius: 8px;
  --quickstart-card-shadow: none;
}

html.kcDarkModeClass,
html.kcDarkModeClass body,
html.kcDarkModeClass body#keycloak-bg,
body.kcDarkModeClass,
body#keycloak-bg.kcDarkModeClass {
  --quickstart-primary-color: #4f46e5;
  --quickstart-secondary-color: #06b6d4;
  --quickstart-gradient-bg-default: linear-gradient(135deg, #4f46e5 0%, #06b6d4 100%);
  --quickstart-bg-color: #241f31;
  --quickstart-bg-image: none;
  --quickstart-bg-logo-url: none;
  --keycloak-bg-logo-url: none;
  --quickstart-border-radius: 8px;
  --quickstart-card-shadow: none;
}