* {
   box-sizing: border-box;
   font-family: Arial, Helvetica, sans-serif;
}

html,
body {
   width: 100%;
   height: 100%;
   margin: 0;
   padding: 0;
   overflow: hidden;
}

.page-anonymous,
.page-anonymous > div,
.page-anonymous > div > div,
.page-anonymous .container,
.page-anonymous .container-fluid {
   width: 100%;
   height: 100%;
   margin: 0;
   padding: 0;
   max-width: none;
   overflow: hidden;
   background: #001f12;
}

.card,
.card-md {
   margin: 0;
   border: none;
   box-shadow: none;
   background: transparent;
}

/* ===============================
   CONTAINER PRINCIPAL
================================ */
.fictor-card {
   position: fixed;
   inset: 0;
   width: 100vw;
   height: 100vh;
   display: flex;
   flex-direction: row;
   overflow: hidden;
   background-color: #001f12;
}

/* ===============================
   LADO ESQUERDO – IMAGEM
================================ */
.fictor-left {
   width: 50%;
   height: 100%;
   position: relative;
   background: url('../pics/wallpaperfictor.png') center center / cover no-repeat;
}

.fictor-left::after {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(0, 0, 0, 0.45);
}

/* ===============================
   LADO DIREITO – CONTEÚDO
================================ */
.fictor-right {
   width: 50%;
   height: 100%;
   background-color: #001f12;
   display: flex;
   align-items: center;
   justify-content: center;
}

.fictor-wrapper {
   width: 100%;
   max-width: 420px;
   padding: 32px 28px;
}

/* ===============================
   TELAS (SAML / LOCAL)
================================ */
.login-microsoft,
.login-local {
   width: 100%;
   text-align: center;
}

/* ===============================
   LOGO
================================ */
.login-logo {
   max-width: 300px;
   margin: 0 auto 32px auto;
   display: block;
}

/* ===============================
   TÍTULOS
================================ */
.login-microsoft h2 {
   margin: 0 0 12px 0;
   font-size: 26px;
   font-weight: 700;
   color: #ffffff;
}

.login-local h2,
.login-local legend {
   margin: 0 0 8px 0;
   font-size: 21px;
   font-weight: 700;
   color: #ffffff;
}

/* ===============================
   TEXTO MICROSOFT
================================ */
.login-microsoft p {
   margin: 0 0 26px 0;
   color: #cfe8dc;
   font-size: 14px;
   line-height: 1.5;
}

/* ===============================
   BOTÃO MICROSOFT (PROXY VISUAL)
   ESTADO FIXO – SEM PISCAR
================================ */
#ms-trigger {
   width: 100%;
   max-width: 320px;
   height: 48px;
   margin: 0 auto 16px auto;

   display: flex;
   align-items: center;
   justify-content: center;
   gap: 12px;

   background: linear-gradient(180deg, #c9ad6a 0%, #be9e58 100%);
   color: #ffffff;

   border: none;
   border-radius: 6px;

   font-size: 15px;
   font-weight: 600;
   letter-spacing: 0.2px;

   cursor: pointer;
   box-shadow: none;

   /* REMOVE qualquer animação que cause piscar */
   transition: none;
}

/* ÍCONE */
#ms-trigger::before {
   content: "";
   width: 16px;
   height: 16px;
   background: url("../pics/microsoft.svg") center / contain no-repeat;
   display: inline-block;
}

/* TODOS os estados forçados para o mesmo visual */
#ms-trigger:hover,
#ms-trigger:active,
#ms-trigger:focus,
#ms-trigger:focus-visible {
   background: linear-gradient(180deg, #c9ad6a 0%, #be9e58 100%);
   outline: none;
   box-shadow: none;
}

/* ===============================
   TEXTO ALTERNATIVO
================================ */
.login-alt {
   margin-top: 16px;
   color: #cfe8dc;
   font-size: 14px;
   text-align: center;
}

.login-alt a {
   color: #cfe8dc;
   text-decoration: underline;
   font-weight: 500;
   cursor: pointer;
}

.login-alt a:hover {
   color: #ffffff;
}

/* ===============================
   LOGIN LOCAL (FORM)
================================ */
.login-local {
   margin-top: 18px;
   display: flex;
   flex-direction: column;
   gap: 8px;
   width: 100%;
}

/* Neutraliza grid do GLPI */
.login-local .row,
.login-local .col,
.login-local [class^="col-"] {
   width: 100% !important;
   max-width: 100% !important;
   margin: 0 !important;
   padding: 0 !important;
}

/* ===============================
   LABELS
================================ */
.login-local label {
   width: 100%;
   text-align: left;
   margin-top: 8px;
   margin-bottom: 3px;
   font-size: 12.5px;
   color: #cfe8dc;
}

/* ===============================
   INPUTS
================================ */
.login-local input[type="text"],
.login-local input[type="password"],
.login-local select {
   width: 100%;
   height: 36px;
   padding: 6px 10px;
   border-radius: 6px;
   border: 1px solid #d1d5db;
   font-size: 13px;
   background-color: #ffffff;
   color: #000000;
}

/* ===============================
   CHECKBOX
================================ */
.login-local .form-check {
   display: flex;
   align-items: center;
   gap: 8px;
   margin: 12px 0;
   font-size: 13px;
   color: #cfe8dc;
}

.login-local input[type="checkbox"] {
   accent-color: #be9e58;
}

/* ===============================
   BOTÃO ENTRAR
================================ */
.login-local button[type="submit"],
.login-local input[type="submit"] {
   width: 100%;
   margin-top: 10px;
   padding: 10px;
   background-color: #be9e58;
   color: #ffffff;
   border: none;
   border-radius: 8px;
   font-size: 14.5px;
   font-weight: 600;
   cursor: pointer;
   transition: background-color 0.2s ease;
}

.login-local button[type="submit"]:hover,
.login-local input[type="submit"]:hover {
   background-color: #a8894b;
}

/* ===============================
   RESPONSIVO
================================ */
@media (max-width: 900px) {
   .fictor-left {
      display: none;
   }

   .fictor-right {
      width: 100%;
   }

   .fictor-wrapper {
      max-width: 100%;
   }
}

/* ===============================
   CONTROLE REAL DAS TELAS
================================ */
body.show-microsoft .login-microsoft {
   display: block;
}

body.show-microsoft .login-local {
   display: none;
}

body.show-local .login-microsoft {
   display: none;
}

body.show-local .login-local {
   display: block;
}

/* ===============================
   AJUSTE ESPAÇOS – LOGIN LOCAL
================================ */

/* linha divisória abaixo do título */
.login-local hr {
   margin: 7px 0 10px 0;
}

/* grupos de campo (label + input/select) */
.login-local .form-group,
.login-local .mb-3,
.login-local .field {
   margin-bottom: 7px !important;
}

/* checkbox "Lembrar de mim" */
.login-local .form-check {
   margin: 10px 0 7px 0;
}

/* botão Entrar */
.login-local button[type="submit"],
.login-local input[type="submit"] {
   margin-top: 7px;
}

/* link Voltar para o login Microsoft */
.login-local a[id="show-microsoft"] {
   margin-top: 6px;
   display: inline-block;
}

/* ===============================
   OCULTAR TEXTOS NATIVOS DO GLPI
================================ */

/* "Faça login para sua conta" */
.login-local h2,
.login-local legend {
   display: none !important;
}

/* "Login with external provider" */
.login-local h3,
.login-local .login-external,
.login-local .external-login {
   display: none !important;
}

/* ===============================
   HEADER SOMENTE LOGIN LOCAL
================================ */
.login-local-header {
   text-align: center;
   margin-bottom: 10px;
}

.login-local-logo {
   max-width: 310px;
   margin: 0 auto 12px auto;
   display: block;
}

/* nunca aparece no Microsoft */
body.show-microsoft .login-local-header {
   display: none;
}

/* aparece apenas no local */
body.show-local .login-local-header {
   display: block;
}

/* ===============================
   HEADER LOGIN LOCAL (FIX TÍTULO)
================================ */
.login-local-header h2 {
   display: block !important;
   visibility: visible !important;
   opacity: 1 !important;

   margin: 0 0 12px 0;
   font-size: 24px;
   font-weight: 700;
   color: #ffffff;
   text-align: center;
}

/* ===============================
   REMOVE LINHA DO GLPI SEM QUEBRAR CAMPOS
================================ */

/* remove apenas a linha visual */
.login-local hr {
   display: none !important;
}

/* remove apenas margens utilitárias do bootstrap */
.login-local .my-4 {
   margin-top: 0 !important;
   margin-bottom: 0 !important;
}

/* fieldset sem borda, mas mantém fluxo */
.login-local fieldset {
   border: none !important;
   padding: 0 !important;
   margin: 0 0 12px 0 !important; /* <<< espaço controlado */
}

/* garante separação correta entre blocos */
.login-local .form-group,
.login-local .row {
   margin-bottom: 12px !important;
}

/* label nunca pode colar */
.login-local label {
   display: block;
   margin-bottom: 6px !important;
}

/* ===============================
   ESQUECEU SUA SENHA
================================ */
.login-local a[href*="lostpassword"] {
   color: #be9e58 !important;
}

.login-local a[href*="lostpassword"]:hover {
   color: #a8894b !important;
   text-decoration: underline;
}