/*
 * Percival brand skin over keycloak.v2 (PatternFly 5).
 * Palette lifted from percival.co.uk: signature orange on near-black ink,
 * with the four-colour zigzag from the logo echoed as the top accent bar.
 */

:root {
  --percival-orange: #f38200;
  --percival-orange-dark: #d96f00;
  --percival-red: #e23900;
  --percival-green: #569e75;
  --percival-blue: #00b8eb;
  --percival-ink: #0e0e0e;

  --pf-v5-global--primary-color--100: var(--percival-orange);
  --pf-v5-global--primary-color--200: var(--percival-orange-dark);
  --pf-v5-global--active-color--100: var(--percival-orange);
  --pf-v5-global--link--Color: var(--percival-orange-dark);
  --pf-v5-global--link--Color--hover: var(--percival-red);

  /* Gotham is licensed; use a clean geometric-ish system stack instead */
  --pf-v5-global--FontFamily--heading: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --pf-v5-global--FontFamily--text: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

body#keycloak-bg {
  background: #f4f5f7;
  border-top: 6px solid;
  border-image: linear-gradient(90deg,
      var(--percival-orange) 0 25%,
      var(--percival-red)    25% 50%,
      var(--percival-green)  50% 75%,
      var(--percival-blue)   75% 100%) 1;
}

/* Replace the realm display-name text with the Percival logo */
#kc-header-wrapper {
  background: url('../img/logo.png') no-repeat center;
  background-size: contain;
  width: 220px;
  height: 70px;
  margin: 0 auto 32px;
  overflow: hidden;
  text-indent: 101%;
  white-space: nowrap;
}

/* Realms without a displayNameHtml render a default Keycloak logo div
   inside the header; it carries its own background image, so hide it */
#kc-header-wrapper .kc-logo-text {
  display: none;
}

.pf-v5-c-login__main {
  border-radius: 12px;
  box-shadow: 0 10px 34px rgba(14, 14, 14, 0.14);
}

/* Card top accent border: PatternFly blue -> brand orange */
.pf-v5-c-login__main-header {
  border-top-color: var(--percival-orange);
}

/* Input focus underline is a hardcoded blue on the wrapper's ::after */
.pf-v5-c-form-control:focus-within::after {
  border-bottom-color: var(--percival-orange);
}

.pf-v5-c-login__main-title {
  color: var(--percival-ink);
}

.pf-v5-c-button.pf-m-primary {
  font-weight: 600;
}