/* ============================================================
   dondus theme v1 — Authentik-Branding (auth.dondus.com).
   Wird als Brand-Custom-CSS eingebunden:
     @import url("https://theme.dondus.com/v1/auth.css");
   Mappt die dondus-Tokens auf die Authentik/PatternFly-Oberfläche.
   ============================================================ */

@import url("tokens.css");

@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url("https://theme.dondus.com/fonts/archivo-var-latin.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://theme.dondus.com/fonts/plexmono-400-latin.woff2") format("woff2");
}

/* PatternFly-Variablen auf dondus-Tokens umbiegen */
:root {
  --pf-v5-global--FontFamily--sans-serif: var(--font-sans);
  --pf-v5-global--FontFamily--heading--sans-serif: var(--font-sans);
  --pf-v5-global--FontFamily--monospace: var(--font-mono);
  --pf-v5-global--primary-color--100: var(--ink);
  --pf-v5-global--primary-color--200: var(--accent-hover);
  --pf-v5-global--link--Color: var(--ink);
  --pf-v5-global--link--Color--hover: var(--accent);
  --pf-v5-global--BackgroundColor--100: var(--surface);
  --pf-v5-global--BorderRadius--sm: var(--radius-s);
  /* Authentik nutzt die Variable als background-IMAGE — ein Gradient in
     Papierfarbe ist ein gueltiges Bild und ersetzt so das Bergfoto. */
  --ak-flow-background: linear-gradient(0deg, var(--paper), var(--paper));
}

/* Hintergrund: warmes Papier statt Foto (Fallback fuer aeltere Selektoren) */
.pf-c-background-image,
.pf-v5-c-background-image {
  background: var(--paper) !important;
  background-image: none !important;
}

/* Wortmarke kommt als branding_logo (wordmark.svg mit eingebetteter Archivo) —
   hier nur die Groesse im Login-Card-Header zaehmen. */
.ak-brand img,
.pf-c-brand {
  max-height: 56px;
}

/* "Erstellt durch Authentik"-Footer ausblenden */
.pf-c-login__footer .pf-c-list,
.pf-c-login__footer {
  display: none;
}

/* Login-Karte: Surface, harte Kanten, Hairline statt Schatten */
.pf-c-login__main,
.pf-v5-c-login__main {
  background: var(--surface);
  border: var(--border-w) solid var(--line);
  border-radius: var(--radius-0);
  box-shadow: none;
  color: var(--ink);
  font-family: var(--font-sans);
}

/* Titel/Header */
.pf-c-login__main-header,
.pf-v5-c-login__main-header,
.pf-c-title,
.pf-v5-c-title {
  font-family: var(--font-sans);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-tight);
  color: var(--ink);
}

/* Primär-Button: Tinte, Pill, Akzent-Hover */
.pf-c-button.pf-m-primary,
.pf-v5-c-button.pf-m-primary {
  background-color: var(--ink);
  color: var(--invert-ink);
  border-radius: var(--radius-pill);
  font-family: var(--font-sans);
  font-weight: var(--weight-medium);
  transition: background-color var(--dur-fast) var(--ease-snap);
}
.pf-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:hover {
  background-color: var(--accent);
  color: var(--accent-ink);
}

/* Inputs */
.pf-c-form-control,
.pf-v5-c-form-control,
input[type="text"],
input[type="password"],
input[type="email"] {
  background: var(--surface);
  border: var(--border-w) solid var(--line);
  border-radius: var(--radius-s);
  color: var(--ink);
  font-family: var(--font-sans);
}
.pf-c-form-control:focus,
.pf-v5-c-form-control:focus {
  border-color: var(--ink);
}

/* Footer/Links */
.pf-c-login__main-footer,
.pf-v5-c-login__main-footer {
  color: var(--ink-2);
}