@charset "UTF-8";
/* theme-name: Cambuí — Atendimento ao Cidadão */
/* ------------------------------------------------------------------
   Prefeitura de Cambuí — identidade visual da tela de login
   Paleta extraída do brasão: azul #304090 · vermelho #A03030 · verde #105030
   Escopo: apenas páginas anônimas (body.welcome-anonymous).
   O restante do GLPI mantém o tema padrão.
   Obs.: sem funções min()/max() — o Sass as avaliaria e quebraria
   com unidades mistas (rem vs %).
   ------------------------------------------------------------------ */
:root {
  --cb-azul: #2E4090;
  --cb-azul-escuro: #16224F;
  --cb-azul-noite: #0C1330;
  --cb-vermelho: #A03030;
  --cb-verde: #105030;
  --cb-tinta: #1B2440;
  --cb-cinza: #5A6480;
  --cb-borda: #DCE2EC;
  --cb-fundo: #F4F6FA;
  --cb-painel: 46%;
}

/* ============ PAINEL ESQUERDO (institucional) ============ */
body.welcome-anonymous {
  background: var(--cb-fundo);
  min-height: 100vh;
}

body.welcome-anonymous::before {
  content: "";
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--cb-painel);
  background-image: url("/custom/img/logo-cambui.png"), radial-gradient(115% 85% at 18% 12%, rgba(90, 120, 220, 0.28) 0%, rgba(90, 120, 220, 0) 58%), linear-gradient(158deg, #22336F 0%, var(--cb-azul-escuro) 46%, var(--cb-azul-noite) 100%);
  background-repeat: no-repeat, no-repeat, no-repeat;
  background-position: center calc(50% - 2rem), 0 0, 0 0;
  background-size: 21rem auto, cover, cover;
  z-index: 0;
}

body.welcome-anonymous::after {
  content: "Atendimento ao Cidadão";
  position: fixed;
  top: 50%;
  left: 0;
  width: var(--cb-painel);
  margin-top: 4.5rem;
  padding: 0 2rem;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-align: center;
  z-index: 1;
  pointer-events: none;
}

/* Faixa de acento com as cores do brasão, no pé do painel */
body.welcome-anonymous main.page-anonymous::before {
  content: "";
  position: fixed;
  left: 0;
  bottom: 0;
  width: var(--cb-painel);
  height: 5px;
  background: linear-gradient(90deg, var(--cb-azul) 0%, var(--cb-azul) 34%, var(--cb-vermelho) 34%, var(--cb-vermelho) 67%, var(--cb-verde) 67%, var(--cb-verde) 100%);
  z-index: 2;
}

/* ============ LADO DIREITO (formulário) ============ */
main.page-anonymous {
  margin-left: var(--cb-painel);
  width: calc(100% - var(--cb-painel));
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 1;
}

/* o wrapper interno traz mt-4/py-4 do Tabler que desalinham o centro */
body.welcome-anonymous main.page-anonymous > .flex-fill {
  flex: 0 1 auto !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.welcome-anonymous .glpi-logo {
  display: none !important;
}

body.welcome-anonymous .container-tight {
  max-width: 30rem;
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

body.welcome-anonymous .main-content-card {
  border: none;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(20, 30, 60, 0.04), 0 12px 34px rgba(20, 30, 60, 0.09);
}

body.welcome-anonymous .main-content-card > .card-body {
  padding: 2.5rem 2.25rem 2.25rem;
}

/* A coluna interna é col-md-5 — estreita demais para meia tela */
body.welcome-anonymous .card-body .row > .col-md-5 {
  flex: 0 0 100%;
  max-width: 100%;
  width: 100%;
}

body.welcome-anonymous .card-body .card-header {
  background: none;
  border: none;
  padding: 0;
  margin-bottom: 1.75rem !important;
  display: block;
}

body.welcome-anonymous .card-body .card-header h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--cb-tinta);
  letter-spacing: -0.015em;
  margin: 0 0 0.4rem;
  text-align: left;
}

body.welcome-anonymous .card-body .card-header h2::after {
  content: "Use suas credenciais para acessar o sistema.";
  display: block;
  margin-top: 0.5rem;
  font-size: 0.9rem;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--cb-cinza);
}

/* ============ CAMPOS ============ */
body.welcome-anonymous .form-label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--cb-tinta);
  letter-spacing: 0.01em;
  margin-bottom: 0.4rem;
}

body.welcome-anonymous .form-control,
body.welcome-anonymous .form-select {
  height: 3rem;
  min-height: 3rem;
  border-radius: 10px;
  border: 1.5px solid var(--cb-borda);
  background: #FCFDFF;
  padding: 0.5rem 0.9rem;
  font-size: 0.97rem;
  color: var(--cb-tinta);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

body.welcome-anonymous .form-control:hover {
  border-color: #C3CCDD;
}

body.welcome-anonymous .form-control:focus,
body.welcome-anonymous .form-select:focus {
  border-color: var(--cb-azul);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(46, 64, 144, 0.13);
  outline: none;
}

body.welcome-anonymous .form-control::placeholder {
  color: #9AA4BC;
}

body.welcome-anonymous .form-check-label {
  font-size: 0.88rem;
  color: var(--cb-cinza);
}

body.welcome-anonymous .form-check-input:checked {
  background-color: var(--cb-azul);
  border-color: var(--cb-azul);
}

body.welcome-anonymous .form-check-input:focus {
  box-shadow: 0 0 0 3px rgba(46, 64, 144, 0.18);
  border-color: var(--cb-azul);
}

/* ============ BOTÃO ============ */
body.welcome-anonymous .form-footer {
  margin-top: 1.75rem;
}

body.welcome-anonymous .btn-primary {
  height: 3rem;
  border-radius: 10px;
  border: none;
  background: var(--cb-azul);
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  box-shadow: 0 2px 10px rgba(46, 64, 144, 0.28);
  transition: background 0.15s ease, transform 0.08s ease, box-shadow 0.15s ease;
}

body.welcome-anonymous .btn-primary:hover,
body.welcome-anonymous .btn-primary:focus {
  background: #26357A;
  box-shadow: 0 4px 16px rgba(46, 64, 144, 0.36);
}

body.welcome-anonymous .btn-primary:active {
  transform: translateY(1px);
}

body.welcome-anonymous .btn-primary:focus-visible {
  outline: 3px solid rgba(46, 64, 144, 0.4);
  outline-offset: 2px;
}

body.welcome-anonymous .forgot_password {
  margin-top: 1rem;
}

body.welcome-anonymous .forgot_password a {
  color: var(--cb-azul);
  font-size: 0.88rem;
  font-weight: 500;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

body.welcome-anonymous .forgot_password a:hover {
  border-bottom-color: var(--cb-azul);
}

/* ============ RODAPÉ ============ */
body.welcome-anonymous main.page-anonymous .text-muted {
  font-size: 0.78rem;
  color: #8A93AB !important;
}

/* Assinatura TrustIT no lugar do rodapé padrão */
body.welcome-anonymous .container-tight > .text-center.text-muted a.copyright {
  display: none !important;
}

body.welcome-anonymous .container-tight > .text-center.text-muted::after {
  content: "www.confiancaetecnologia.com.br";
  display: block;
  margin-top: 0.25rem;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #8A93AB;
}

/* ============ RESPONSIVO ============ */
@media (max-width: 1199.98px) {
  body.welcome-anonymous::before {
    background-size: 17rem auto, cover, cover;
  }
}
@media (max-width: 991.98px) {
  :root {
    --cb-painel: 100%;
  }
  /* Painel vira faixa superior; brasao centralizado nela */
  body.welcome-anonymous::before {
    position: absolute;
    inset: 0 0 auto 0;
    width: 100%;
    height: 15.5rem;
    background-position: center 4rem, 0 0, 0 0;
    background-size: 15rem auto, cover, cover;
  }
  body.welcome-anonymous::after {
    position: absolute;
    top: 11.5rem;
    margin-top: 0;
    width: 100%;
    font-size: 0.72rem;
  }
  body.welcome-anonymous main.page-anonymous::before {
    position: absolute;
    top: 15.5rem;
    bottom: auto;
    width: 100%;
    height: 4px;
  }
  main.page-anonymous {
    margin-left: 0;
    width: 100%;
    padding-top: 15.5rem;
  }
  body.welcome-anonymous .container-tight {
    max-width: 27rem;
    padding-top: 2rem !important;
  }
  body.welcome-anonymous .main-content-card > .card-body {
    padding: 2rem 1.5rem;
  }
}
@media (max-width: 575.98px) {
  /* logo 62% (~110px de altura) no topo 3.5rem => termina em ~10.4rem,
     antes do texto que fica em 11.5rem. */
  body.welcome-anonymous::before {
    background-position: center 3.5rem, 0 0, 0 0;
    background-size: 62% auto, cover, cover;
  }
  body.welcome-anonymous .main-content-card {
    border-radius: 14px;
    box-shadow: 0 6px 22px rgba(20, 30, 60, 0.1);
  }
}
/* ============ ACESSIBILIDADE ============ */
@media (prefers-reduced-motion: reduce) {
  body.welcome-anonymous * {
    transition: none !important;
    animation: none !important;
  }
}
/* ============ OPÇÕES DE AUTOCADASTRO NA TELA DE LOGIN ============ */
/* O text_login é renderizado antes do formulário; o flexbox o move para baixo. */
body.welcome-anonymous .card-body > form {
  display: flex;
  flex-direction: column;
}

body.welcome-anonymous .card-body > form > .row {
  order: 1;
}

body.welcome-anonymous .card-body > form > .rich_text_container {
  order: 2;
  text-align: left !important;
}

.ac-entrada {
  margin-top: 1.75rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--cb-borda);
}

.ac-entrada-titulo {
  margin: 0 0 0.85rem;
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--cb-tinta);
}

.ac-entrada-opcoes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.ac-entrada-opcoes a {
  display: block;
  padding: 0.8rem 0.9rem;
  border: 1.5px solid var(--cb-borda);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.08s ease;
}

.ac-entrada-opcoes a:hover {
  border-color: var(--cb-azul);
  box-shadow: 0 4px 14px rgba(46, 64, 144, 0.12);
  transform: translateY(-1px);
}

.ac-entrada-opcoes strong {
  display: block;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--cb-azul);
}

.ac-entrada-opcoes span {
  display: block;
  margin-top: 0.1rem;
  font-size: 0.76rem;
  color: var(--cb-cinza);
}

@media (max-width: 400px) {
  .ac-entrada-opcoes {
    grid-template-columns: 1fr;
  }
}
/* ============ LOGO DA PREFEITURA EM TODO O GLPI ============ */
/* O GLPI 11 resolve a logo por variáveis CSS; basta redefini-las. */
:root {
  --glpi-logo-light: url("/custom/img/logo-larga-clara.png");
  --glpi-logo-light-reduced: url("/custom/img/logo-reduzida.png");
  --glpi-logo-light-login: url("/custom/img/logo-larga-clara.png");
  --glpi-logo-dark: url("/custom/img/logo-larga-escura.png");
  --glpi-logo-dark-reduced: url("/custom/img/logo-reduzida.png");
  --glpi-logo-dark-login: url("/custom/img/logo-larga-escura.png");
}

/* A logo do GLPI tem proporção diferente da nossa; sem isto ela sai esticada. */
.glpi-logo {
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* ============ LINHA DO TEMPO DA SOLICITAÇÃO ============ */
/* O padrão do GLPI dá a cada bloco um fundo saturado, uma borda de 1px, uma
   setinha de balão de fala e uma marca d'água PNG no canto — quatro artifícios
   para separar coisas que o espaço em branco separa melhor.
   Aqui: cartão branco, sombra curta, cantos arredondados, e a cor reduzida a
   um filete na lateral esquerda. A cor passa a significar alguma coisa:
   azul = o pedido do cidadão · cinza = conversa · âmbar = trabalho interno ·
   verde = resolvido. Nenhum arquivo do core é tocado. */
:root {
  --glpi-itil-secondary-bg: #F7F9FC;
  --glpi-timeline-itil-content-bg: #FFFFFF;
  --glpi-timeline-itil-content-fg: #131B33;
  --glpi-timeline-itil-content-border-color: #2E4090;
  --glpi-timeline-fup-bg: #FFFFFF;
  --glpi-timeline-fup-fg: #3A4364;
  --glpi-timeline-fup-border-color: #B8C2D8;
  --glpi-timeline-task-bg: #FFFFFF;
  --glpi-timeline-task-fg: #4A3C1E;
  --glpi-timeline-task-border-color: #D9A62E;
  --glpi-timeline-solution-bg: #FFFFFF;
  --glpi-timeline-solution-fg: #123C29;
  --glpi-timeline-solution-border-color: #1E7047;
  --glpi-timeline-document-bg: #FFFFFF;
  --glpi-timeline-document-fg: #3A4364;
  --glpi-timeline-document-border-color: #8FA0C4;
  --glpi-timeline-log-bg: #F7F9FC;
  --glpi-timeline-badge-bg: rgba(46, 64, 144, .09);
  --glpi-timeline-badge-fg: #40496A;
}

.timeline-item {
  /* o corpo da solicitação é o bloco principal: mais peso que os demais */
}
.timeline-item .timeline-content {
  border-radius: 14px !important;
  border-width: 0 0 0 3px !important;
  border-style: solid !important;
  box-shadow: 0 1px 2px rgba(19, 27, 51, 0.05), 0 6px 18px rgba(19, 27, 51, 0.05);
  background-image: none !important; /* fora as marcas d'água PNG do canto */
  padding: 0 !important;
  /* as setinhas de balão de fala */
}
.timeline-item .timeline-content::before, .timeline-item .timeline-content::after {
  display: none !important;
}
.timeline-item.ITILContent .timeline-content {
  box-shadow: 0 1px 2px rgba(19, 27, 51, 0.06), 0 10px 26px rgba(46, 64, 144, 0.1);
}
.timeline-item.private-item .timeline-content {
  border-left-style: dashed !important;
  border-left-width: 3px !important;
}
.timeline-item .card-body {
  padding: 20px 22px;
}
.timeline-item .timeline-header {
  margin-bottom: 10px;
}

/* cabeçalho do bloco: nome de quem escreveu e data, sem competir com o texto */
.timeline-item .timeline-header .creator {
  font-weight: 600;
  color: var(--cb-tinta);
}

.timeline-item .timeline-item-header .badge,
.timeline-item .timeline-item-header-badges .badge {
  border-radius: 100px;
  font-weight: 600;
  letter-spacing: 0.01em;
}