/*
 * Local identity screens share the application's light blue theme (packages/ui/src/styles.css).
 * Keep the values below in step with those tokens. Native provider forms and labels remain intact.
 */
:root {
  color-scheme: light;
  --ggos-bg: #f3f7fc;
  --ggos-surface: #ffffff;
  --ggos-line: #d8e3f0;
  --ggos-line-strong: #7b90aa;
  --ggos-text: #0f1d33;
  --ggos-text-2: #44546b;
  --ggos-accent: #1a5fd0;
  --ggos-accent-hover: #1856ba;
  --ggos-on-accent: #ffffff;
  --ggos-danger: #b3261e;
  --ggos-font: Geist, system-ui, -apple-system, "Segoe UI", "Noto Sans Gurmukhi", sans-serif;

  --pf-v5-global--primary-color--100: var(--ggos-accent);
  --pf-v5-global--primary-color--200: var(--ggos-accent-hover);
  --pf-v5-global--link--Color: var(--ggos-accent);
  --pf-v5-global--link--Color--hover: var(--ggos-accent-hover);
  --pf-v5-global--BackgroundColor--100: var(--ggos-surface);
  --pf-v5-global--BackgroundColor--200: var(--ggos-bg);
  --pf-v5-global--Color--100: var(--ggos-text);
  --pf-v5-global--Color--200: var(--ggos-text-2);
  --pf-v5-global--BorderColor--100: var(--ggos-line);
  --pf-v5-global--danger-color--100: var(--ggos-danger);
  --keycloak-card-top-color: var(--ggos-accent);
  --pf-v5-global--FontFamily--text: var(--ggos-font);
  --pf-v5-global--FontFamily--heading: var(--ggos-font);
}
html,
body,
.login-pf body,
.pf-v5-c-login {
  background: var(--ggos-bg);
  color: var(--ggos-text);
  font-family: var(--ggos-font);
}
.pf-v5-c-login__main {
  background: var(--ggos-surface);
  border: 1px solid var(--ggos-line);
  border-radius: 12px;
  box-shadow:
    0 1px 2px rgb(15 29 51 / 6%),
    0 8px 24px rgb(15 29 51 / 6%);
}
.pf-v5-c-login__header,
.pf-v5-c-login__header *,
#kc-header,
#kc-header-wrapper,
#kc-header-wrapper * {
  color: var(--ggos-text);
}
#kc-header-wrapper {
  /* The parent uses !important with this variable; scope its value to this light header. */
  --pf-v5-global--Color--light-100: var(--ggos-text);
  color: var(--ggos-text);
  font-weight: 600;
  letter-spacing: -0.025em;
  text-transform: none;
}
#kc-header-wrapper::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto 16px;
  background: var(--ggos-text);
  mask: url("../img/xeno-symbol.svg") center / contain no-repeat;
}
input,
button,
select {
  min-height: 44px;
}
.pf-v5-c-form-control,
.pf-v5-c-form-control::before,
.pf-v5-c-form-control::after,
.pf-v5-c-input-group > .pf-v5-c-button.pf-m-control {
  border-radius: 8px;
}
.pf-v5-c-form-control::before {
  border: 1px solid var(--ggos-line-strong);
}
.pf-v5-c-form-control::after {
  border: 0;
}
.pf-v5-c-form-control:hover::before {
  border-color: var(--ggos-text-2);
}
.pf-v5-c-form-control:focus-within::before {
  border: 2px solid var(--ggos-accent);
}
.pf-v5-c-form-control.pf-m-error::before {
  border-color: var(--ggos-danger);
}
.pf-v5-c-input-group > .pf-v5-c-form-control,
.pf-v5-c-input-group > .pf-v5-c-form-control::before {
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}
.pf-v5-c-input-group > .pf-v5-c-button.pf-m-control {
  border-start-start-radius: 0;
  border-end-start-radius: 0;
}
.pf-v5-c-input-group > .pf-v5-c-button.pf-m-control::after {
  border-color: var(--ggos-line-strong);
  border-radius: inherit;
}
a {
  color: var(--ggos-accent);
}
a:hover {
  color: var(--ggos-accent-hover);
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 2px solid var(--ggos-accent);
  outline-offset: 2px;
}
.pf-v5-c-button.pf-m-primary {
  background: var(--ggos-accent);
  color: var(--ggos-on-accent);
  border-radius: 8px;
  font-weight: 600;
}
.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus {
  background: var(--ggos-accent-hover);
  color: var(--ggos-on-accent);
}
@media (max-width: 36rem) {
  .pf-v5-c-login {
    padding: 16px;
  }
  .pf-v5-c-login__main {
    min-width: 0;
    width: 100%;
  }
}