:root {
  --snbc-green: #00b67a !important;
  --snbc-green-strong: #00d68f !important;
  --snbc-bg: #000000;
  --snbc-panel: #0f0f0f;
  --snbc-text: #e8f6ec;
  --snbc-muted: #9fb5a9;

  /* Thin top stripe color */
  --keycloak-card-top-color: var(--snbc-green) !important;

  /* PatternFly primary + focus + active palette overrides */
  --pf-global--primary-color--100: var(--snbc-green) !important;
  --pf-global--primary-color--200: var(--snbc-green) !important;
  --pf-global--active-color--400: var(--snbc-green) !important;
  --pf-v5-global--primary-color--100: var(--snbc-green) !important;
  --pf-v5-global--primary-color--200: var(--snbc-green) !important;
  --pf-v5-global--active-color--400: var(--snbc-green) !important;
  --pf-v5-c-form-control--focus--BorderColor: var(--snbc-green) !important;
  --pf-v5-c-form-control--focus--BoxShadow: none !important;

  --pf-global--link--Color: var(--snbc-green) !important;
  --pf-global--link--Color--hover: var(--snbc-green-strong) !important;
  --pf-v5-global--link--Color: var(--snbc-green) !important;
  --pf-v5-global--link--Color--hover: var(--snbc-green-strong) !important;

  --pf-global--palette--black-900: var(--snbc-panel);
  --pf-global--palette--black-1000: var(--snbc-bg);
  --pf-v5-global--palette--black-900: var(--snbc-panel);
  --pf-v5-global--palette--black-1000: var(--snbc-bg);
}

body#keycloak-bg {
  background: radial-gradient(ellipse at 20% 20%, rgba(0, 182, 122, 0.08), transparent 45%),
              radial-gradient(ellipse at 80% 10%, rgba(0, 182, 122, 0.07), transparent 35%),
              var(--snbc-bg);
  color: var(--snbc-text);
}

.pf-v5-c-login { background: transparent; min-height: 100vh; }

.pf-v5-c-login__main {
  background: var(--snbc-panel);
  border: 1px solid rgba(0, 182, 122, 0.35);
  box-shadow: 0 20px 80px rgba(0, 0, 0, 0.65);
}

.pf-v5-c-login__main-header {
  background: transparent !important;
  color: var(--snbc-text) !important;
  padding: 16px 24px !important;
  margin: 0 !important;
}

#kc-header-wrapper {
  display: inline-flex; align-items: center; gap: 14px;
  color: var(--snbc-text); font-weight: 700; letter-spacing: 0.5px;
}
#kc-header-wrapper::before {
  content: ""; width: 56px; height: 56px;
  background: url('../img/keycloak-logo.svg') center/contain no-repeat;
  filter: drop-shadow(0 0 12px rgba(0, 182, 122, 0.55));
}

#kc-page-title, .pf-v5-c-title#kc-page-title { color: var(--snbc-text) !important; }

.pf-v5-c-form__label-text { color: var(--snbc-muted); }

/* Inputs: only slim bottom border, no outline/box-shadow */
.pf-v5-c-form-control,
.pf-v5-c-input-group__item .pf-v5-c-form-control {
  background-color: #121212;
  color: var(--snbc-text);
  border: 0 !important;
  box-shadow: none !important;
  padding: 0;
}

/* Kill the PatternFly pseudo underline and recolor it to green */
.pf-v5-c-form-control::after,
.pf-v5-c-form-control:focus-within::after,
.pf-v5-c-input-group__item .pf-v5-c-form-control::after,
.pf-v5-c-input-group__item .pf-v5-c-form-control:focus-within::after {
  border-color: transparent transparent var(--snbc-green) transparent !important;
  box-shadow: none !important;
}

.pf-v5-c-form-control input,
.pf-v5-c-input-group__item .pf-v5-c-form-control input {
  background-color: #121212;
  color: var(--snbc-text);
  border: 0 !important;
  border-bottom: 2px solid rgba(0, 182, 122, 0.35);
  border-radius: 0;
  outline: none !important;
  box-shadow: none !important;
}

.pf-v5-c-form-control input:focus,
.pf-v5-c-form-control input:focus-visible,
.pf-v5-c-form-control input.pf-m-focus,
.pf-v5-c-form-control:focus-within,
.pf-v5-c-input-group__item .pf-v5-c-form-control:focus-within {
  border-bottom-color: var(--snbc-green) !important;
  box-shadow: none !important;
}

.pf-v5-c-login__main-body a { color: var(--snbc-green); }
.pf-v5-c-login__main-body a:hover,
.pf-v5-c-login__main-body a:focus { color: var(--snbc-green-strong); }

.pf-v5-c-button.pf-m-primary {
  background-color: var(--snbc-green);
  border-color: var(--snbc-green);
  color: #00140c;
}
.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus {
  background-color: var(--snbc-green-strong);
  border-color: var(--snbc-green-strong);
}

.pf-v5-c-button.pf-m-control { color: var(--snbc-muted); }

.pf-v5-c-login__main-footer,
.pf-v5-c-login__main-header { color: var(--snbc-muted); }

#kc-content { color: var(--snbc-text); }
