/* tAIkujo's app palette. Inherit Keycloak's forms and authentication behavior. */
:root, :root.pf-v5-theme-dark {
  color-scheme: dark;
  --taikujo-bg: #171e25;
  --taikujo-panel: #26333e;
  --taikujo-input: #1b252e;
  --taikujo-border: #536d7c;
  --taikujo-text: #e2edf0;
  --taikujo-muted: #b6c4cb;
  --taikujo-accent: #4bcfe3;
  --taikujo-accent-hover: #83e6f1;
  --taikujo-on-accent: #171e25;
  --pf-v5-global--FontFamily--text: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pf-v5-global--FontFamily--heading: var(--pf-v5-global--FontFamily--text);
  --pf-v5-global--FontSize--sm: 0.875rem;
  --pf-v5-global--Color--100: var(--taikujo-text);
  --pf-v5-global--Color--200: var(--taikujo-muted);
  --pf-v5-global--BackgroundColor--100: var(--taikujo-panel);
  --pf-v5-global--BackgroundColor--200: var(--taikujo-bg);
  --pf-v5-global--BorderColor--100: var(--taikujo-border);
  --pf-v5-global--link--Color: var(--taikujo-accent);
  --pf-v5-global--link--Color--hover: var(--taikujo-accent-hover);
  --pf-v5-global--primary-color--100: var(--taikujo-accent);
}
@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light;
    --taikujo-bg: #aebbb8;
    --taikujo-panel: #c5d0c9;
    --taikujo-input: #dce5df;
    --taikujo-border: #556c63;
    --taikujo-text: #1e2825;
    --taikujo-muted: #3c4b45;
    --taikujo-accent: #086882;
    --taikujo-accent-hover: #07566b;
    --taikujo-on-accent: #fff;
  }
}
.login-pf body {
  min-height: 100svh;
  height: auto;
  background: var(--taikujo-bg);
  color: var(--taikujo-text);
  font-family: var(--pf-v5-global--FontFamily--text);
  font-size: 16px;
  line-height: 1.5;
}
.pf-v5-c-login { min-height: 100svh; padding: 32px 20px; }
.pf-v5-c-login__container {
  width: min(100%, 460px);
  margin: auto;
  grid-template-columns: minmax(0, 1fr);
  row-gap: 24px;
}
#kc-header { margin: 0; }
#kc-header-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  color: var(--taikujo-text) !important;
  font-size: 32px;
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.04em;
  text-transform: none;
}
#kc-header-wrapper::before {
  content: "";
  flex: 0 0 80px;
  width: 80px;
  height: 80px;
  background: url('../img/taikujo-monitor.png') center / contain no-repeat;
}
.pf-v5-c-login__main {
  min-width: 0;
  color: var(--taikujo-text);
  background: var(--taikujo-panel);
  border: 1px solid var(--taikujo-border);
  border-radius: 16px;
  box-shadow: 0 18px 48px rgb(0 0 0 / .16);
}
.pf-v5-c-login__main-header { border-top: 0; padding: 28px 28px 20px; gap: 16px; }
.pf-v5-c-login__main-body { padding: 0 28px 28px; }
#kc-page-title { font-family: inherit; font-size: 24px; font-weight: 600; line-height: 1.3; }
.pf-v5-c-login__main-footer-band { background: transparent; padding-inline: 0; }
.pf-v5-c-form-control {
  color: var(--taikujo-text);
  background: var(--taikujo-input);
  border: 1px solid var(--taikujo-border);
  border-radius: 8px;
  min-height: 44px;
}
.pf-v5-c-form-control::before, .pf-v5-c-form-control::after { border: 0; }
.pf-v5-c-form-control > :is(input,select,textarea) { color: inherit; font-family: inherit; font-size: 16px; }
.pf-v5-c-form-control:focus-within { outline: 2px solid var(--taikujo-accent); outline-offset: 2px; }
.pf-v5-c-button { min-height: 44px; font-family: inherit; font-size: 16px; border-radius: 8px; }
.pf-v5-c-button::after { border-radius: inherit; }
.pf-v5-c-button.pf-m-primary {
  background: var(--taikujo-accent);
  color: var(--taikujo-on-accent);
  font-weight: 600;
}
.pf-v5-c-button.pf-m-primary:hover { background: var(--taikujo-accent-hover); }
.pf-v5-c-button.pf-m-control { background: var(--taikujo-input); color: var(--taikujo-muted); }
:is(a,button,input,select):focus-visible { outline: 2px solid var(--taikujo-accent); outline-offset: 3px; }
.pf-v5-c-form__label, .pf-v5-c-check__label { color: var(--taikujo-text); }
.pf-v5-c-alert { border-radius: 8px; }
@media (max-width: 480px) {
  .pf-v5-c-login { padding: 24px 16px; }
  .pf-v5-c-login__main-header { padding: 24px 20px 16px; }
  .pf-v5-c-login__main-body { padding: 0 20px 24px; }
  #kc-header-wrapper { font-size: 28px; }
  #kc-header-wrapper::before { flex-basis: 64px; width: 64px; height: 64px; }
}

/* The containing input surface owns the single visible focus ring. */
.pf-v5-c-form-control > input:focus-visible { outline: none; box-shadow: none; }
