/* Adiciona a grid-area footer ao layout da tela de login */
.pf-v5-c-login__container {
  grid-template-areas:
    'header'
    'main'
    'footer';
}

/* Vincula a div#footer com a grid area footer */
.pf-v5-c-login__main-footer {
  grid-area: footer;
}

/* Background da tela */
#keycloak-bg {
  background: rgb(238, 238, 238);
  background: linear-gradient(308deg, rgba(238, 238, 238, 1) 0%, rgba(144, 167, 176, 1) 100%);
  background-attachment: fixed;
}

.pf-v5-theme-dark #keycloak-bg {
  background: rgb(53, 53, 53);
  background: linear-gradient(308deg, rgba(45, 45, 45, 1) 0%, rgba(37, 57, 65, 1) 100%);
  background-attachment: fixed;
}

/* .login-pf body {
  background: linear-gradient(308deg, rgba(45 45 45) 0%, rgba(37 57 65) 100%);
} */

/* Formatação do formulário de login */
.pf-v5-c-login__main {
  border-radius: 5px;

  /* Formatação dos botões primaris e secundários */
  .pf-v5-c-button {
    border-radius: 24px;
  }
  .pf-v5-c-button.pf-m-block::after {
    border-radius: 24px;
  }
  .pf-v5-c-button:after {
    border-radius: 24px;
  }

  /* Diminui o tamanho da fonte no seletor de idiomas */
  #login-select-toggle {
    font-size: 0.8em;
  }

  /* Formatação do título da página */
  #kc-page-title {
    text-align: center;
  }
  #kc-page-title img {
    max-width: 325px;
    height: auto;
  }

  /* Espaçamento do container do logo do Virtualif */
  .login-virtualif-logo {
    padding-block-end: 1em;
    padding-inline-end: var(--pf-v5-c-login__main-body--PaddingRight);
    padding-inline-start: var(--pf-v5-c-login__main-body--PaddingLeft);
  }

  /* Mantém o seletor de idiomas no canto superior direito, mesmo em dispositivos móveis */
  div.pf-v5-c-login__main-header {
    grid-template-columns: 60% 40%;
    border-top: none;
    padding-block-start: 1em;
  }
  .pf-v5-c-login__main-header .pf-v5-c-dropdown,
  .pf-v5-c-login__main-header-utilities {
    grid-column: 2 / 3;
    grid-row: 1;
  }

  /* Espaçamento do label dos inputs */
  .pf-v5-c-form__label {
    margin-bottom: 4px;
  }

  /* Formatação do peso da fonte dos botões, seguindo o padrão Gov.br */
  .pf-v5-c-button {
    font-weight: 600;
  }

  /* Remove o background do texto informativo na tela "Esqueci minha senha" */
  #kc-info-wrapper {
    background-color: transparent;
  }

  /* Formatação do botão secundário, seguindo o padrão Gov.br */
  .pf-v5-c-button.pf-m-secondary:hover {
    background-color: #1351b429;
  }
  .login-pf a:hover {
    color: var(--pf-v5-c-button--m-secondary--Color);
  }
  .pf-v5-c-button:hover {
    --pf-v5-c-button--after--BorderColor: var(--pf-v5-c-button--m-secondary--Color);
    --pf-v5-c-button--after--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
  }

  /* Formatação das bordar dos inputs e botoões, seguindo o padrão Gov.br */
  .pf-v5-c-form-control:after {
    border-radius: 4px;
    border-block-start: var(--pf-v5-c-form-control--after--BorderBottomWidth) solid var(--pf-v5-global--BorderColor--200);
    border-inline-start: var(--pf-v5-c-form-control--after--BorderBottomWidth) solid var(--pf-v5-global--BorderColor--200);
    border-inline-end: var(--pf-v5-c-form-control--after--BorderBottomWidth) solid var(--pf-v5-global--BorderColor--200);
    border-block-end: var(--pf-v5-c-form-control--after--BorderBottomWidth) solid var(--pf-v5-global--BorderColor--200);
  }
  .pf-v5-c-input-group .pf-v5-c-form-control:after {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  }
  .pf-v5-c-input-group .pf-v5-c-button {
    border-radius: inherit;
  }
  .pf-v5-c-input-group .pf-v5-c-button:after {
    border-width: 1px 1px 1px 0;
    border-radius: 0px 4px 4px 0px;
    border-style: solid;
    border-color: var(--pf-v5-global--BorderColor--200);
  }

  /* Formatação do espaçamento as instruções de login alternativo */
  .instruction {
    margin-bottom: 1em;
  }
}

/* Formatação do espaçamento da area de login */
.pf-v5-c-login__main-body {
  padding-block-end: 0;
}
.pf-v5-c-login__main > :last-child:not(.pf-v5-c-login__main-footer) {
  padding-block-end: 1.5em;
}
.pf-v5-c-login__main-footer {
  margin-block-start: var(--pf-v5-global--spacer--lg);
}

/* Formatação do rodapé contendo a assinatura do instituto */
#footer {
  #texto-identificacao-autor {
    text-align: center;
    font-size: 0.7em;
  }

  #logo-iftm {
    margin-top: 10px;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
  }
}

#kc-logout-confirm .instruction {
  margin-bottom: 1em;
}
#kc-logout-confirm #kc-info-message {
  margin-top: 1em;
}

/* Controla a exibição da logo nos modos light e dark */
#logo-iftm .logo-iftm-dark {
  display: none;
}
.pf-v5-theme-dark #logo-iftm .logo-iftm-light {
  display: none;
}
.pf-v5-theme-dark #logo-iftm .logo-iftm-dark {
  display: block;
}