/* InvokeFlow login theme — overrides on top of keycloak.v2 / PatternFly 5. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600;700&display=swap');

:root {
  --if-canvas: #0B0C0E;
  --if-ink: #EDEDEC;
  --if-ink-dim: #9A9A98;
  --if-line: #26282C;
  --if-panel: #121416;
  --if-cyan: #3CE0CE;
  --if-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

html, body, #keycloak-bg, .login-pf body {
  background: var(--if-canvas) !important;
  color: var(--if-ink);
}
.pf-v5-c-login { background: var(--if-canvas); }
.pf-v5-c-login__container { --pf-v5-c-login__container--MaxWidth: 34rem; }

/* Header lockup */
#kc-header-wrapper {
  font-family: var(--if-mono);
  text-transform: none !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-align: center;
  padding: 2.5rem 0 1.25rem;
}
.if-lockup { display: inline-flex; align-items: flex-end; gap: 0; }
.if-mark  { font-weight: 700; font-size: 3.2rem; letter-spacing: -0.06em; color: var(--if-ink); }
.if-cell  {
  display: inline-block; width: 0.62rem; height: 1.6rem; margin: 0 0.8rem 0.2rem 0.55rem;
  border-radius: 0.14rem; background: var(--if-cyan);
  animation: if-blink 2.6s ease-in-out infinite;
}
.if-word  { font-weight: 600; font-size: 2.15rem; letter-spacing: -0.05em; color: var(--if-ink); padding-bottom: 0.15rem; }
@keyframes if-blink { 0%, 78%, 100% { opacity: 1; } 88% { opacity: 0.25; } }
@media (prefers-reduced-motion: reduce) { .if-cell { animation: none; } }

/* Card. keycloak.v2 paints a 4px accent bar (--keycloak-card-top-color, blue)
   on the card header; one ink only. */
:root { --keycloak-card-top-color: var(--if-line); }
.pf-v5-c-login__main-header { border-top: 0 !important; }
.pf-v5-c-login__main {
  background: var(--if-panel) !important;
  border: 1px solid var(--if-line);
  border-radius: 10px;
  box-shadow: none;
  color: var(--if-ink);
}
.pf-v5-c-login__main-header, .pf-v5-c-login__main-body, .pf-v5-c-login__main-footer { color: var(--if-ink); }
#kc-page-title, .pf-v5-c-title { color: var(--if-ink) !important; font-weight: 600; }
.pf-v5-c-form__label-text, .pf-v5-c-form__label, .pf-v5-c-check__label { color: var(--if-ink) !important; }
.pf-v5-c-form__helper-text, .pf-v5-c-helper-text__item-text, .pf-v5-c-login__main-footer-band, .pf-v5-c-login__main-footer-band-item { color: var(--if-ink-dim); }

/* Inputs */
.pf-v5-c-form-control, .pf-v5-c-form-control input, .pf-v5-c-form-control textarea, .pf-v5-c-form-control select {
  background: var(--if-canvas) !important;
  color: var(--if-ink) !important;
  border-color: var(--if-line) !important;
  --pf-v5-c-form-control--BorderColor: var(--if-line);
  --pf-v5-c-form-control--after--BorderBottomColor: var(--if-ink-dim);
  --pf-v5-c-form-control--hover--after--BorderBottomColor: var(--if-ink);
  --pf-v5-c-form-control--focus--after--BorderBottomColor: var(--if-ink);
}
.pf-v5-c-form-control::after { border-bottom-color: var(--if-ink-dim) !important; }
.pf-v5-c-form-control:focus-within::after { border-bottom-color: var(--if-ink) !important; }
.pf-v5-c-form-control input::placeholder { color: var(--if-ink-dim); }
.pf-v5-c-button.pf-m-control { color: var(--if-ink-dim); }

/* Buttons: one ink, no second accent */
.pf-v5-c-button.pf-m-primary {
  background: var(--if-ink) !important;
  color: var(--if-canvas) !important;
  border-radius: 6px;
  font-weight: 600;
  font-family: var(--if-mono);
}
.pf-v5-c-button.pf-m-primary:hover, .pf-v5-c-button.pf-m-primary:focus { background: #ffffff !important; }
.pf-v5-c-button.pf-m-secondary, .pf-v5-c-button.pf-m-link { color: var(--if-ink) !important; }
a, .pf-v5-c-login__main-footer a { color: var(--if-ink); text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: #ffffff; }

/* Alerts */
.pf-v5-c-alert { background: var(--if-canvas); border: 1px solid var(--if-line); color: var(--if-ink); }
.pf-v5-c-alert__title, .pf-v5-c-alert__description { color: var(--if-ink); }

/* Footer band (locale / register links) */
.pf-v5-c-login__main-footer-band { border-top: 1px solid var(--if-line); }
