/*
 * Testkunde Gamma branding for OpenIAM's sign-in pages. Generated by platform/host/client-sites/make_client_site.py
 * from platform/branding/pathgate/brand.css (IAMV1-115).
 * Used together with brand.js, which sets the classes pg-brand and pg-admin or pg-portal on <html>, then the
 * badge text in --pg-label and the class pg-ready. Everything is drawn with pseudo-elements, so OpenIAM's page
 * code is not touched.
 *
 * Colours (Testkunde Gamma): dark #2d1b4e (text), main #6b3fa0 (stripe, badge), white, accent #f2c14e.
 */
:root {
  --pg-midnight: #2d1b4e;
  --pg-deep: #6b3fa0;
  --pg-white: #ffffff;
  --pg-gold: #f2c14e;
}

/* A stripe along the top of the page: gold for the admin console, deep blue for self-service. */
html.pg-brand body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  z-index: 10000;
  background: var(--pg-deep);
}
html.pg-admin body::before {
  background: var(--pg-gold);
}

/* OpenIAM's logo is replaced by the Testkunde Gamma logo (logo.png, 1000 x 354, transparent background). */
html.pg-brand .login-logo {
  text-align: center;
}
html.pg-brand .login-logo img {
  display: none !important;
}
html.pg-brand .login-logo::before {
  content: "";
  display: block;
  width: 300px;
  max-width: 80vw;
  height: 106px;
  margin: 0 auto;
  background: url("/brand/logo.png") center / contain no-repeat;
}

/* The badge under the logo: which console the user is signing in to. */
html.pg-ready .login-logo::after {
  content: var(--pg-label);
  display: inline-block;
  margin-top: 10px;
  padding: 5px 16px;
  border-radius: 999px;
  font: 700 14px/1.4 "Aptos", "Segoe UI", system-ui, Arial, sans-serif;
  letter-spacing: 0.5px;
  background: var(--pg-deep);
  color: var(--pg-white);
}
html.pg-ready.pg-admin .login-logo::after {
  background: var(--pg-gold);
  color: var(--pg-midnight);
}