@charset "UTF-8";
/* O @charset precisa ser o PRIMEIRO byte do arquivo, por isso vem antes do
   cabeçalho. O Apache do container serve .css sem charset no Content-Type
   (não há AddDefaultCharset), e sem esta linha o navegador cairia na
   codificação do documento que referencia a folha. Hoje isso dá certo por
   acidente (as páginas do GLPI são UTF-8), mas os `content:` daqui têm
   acento, "·" e "Sí" — declarar custa uma linha e tira a dependência. */
/* ==========================================================================
 * Fapp HelpDesk — o que a PALETA não alcança no GLPI 10
 * ==========================================================================
 * As cores vêm de css/palettes/fapp.scss, compilada pelo próprio GLPI.
 * Aqui fica só o que é ESTRUTURA: as fontes, a marca em texto na barra
 * (o F laranja, como no logotipo) e a tela de login dividida — painel em
 * marinho com a arte à esquerda, formulário à direita.
 *
 * Servido de /fapp/glpi.css (bind mount em public/, entregue direto pelo
 * Apache). Carregado por templates/layout/parts/head.html.twig, DEPOIS do CSS
 * compilado do GLPI — por isso as regras aqui vencem por ordem, e o
 * !important aparece só onde o GLPI usa um seletor mais específico.
 * ========================================================================== */

/* --- tipografia --------------------------------------------------------------- */
body, .form-control, .form-select, .btn, .navbar, .card, .tab-content {
  font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
}
h1, h2, h3, h4, .h1, .h2, .h3, .card-title, .page-title, .navbar-brand, .item-title {
  font-family: "Sora", "Manrope", system-ui, sans-serif; letter-spacing: -.01em;
}
code, kbd, pre, .font-monospace, input[name="password"] {
  font-family: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
}

/* --- a marca na barra do menu ---------------------------------------------------------- */
/* O logo do GLPI é um span que vira ELEMENTO SUBSTITUÍDO: o SCSS põe a imagem
   em `content: url(...)` (na tela de login, o logo-GLPI-250). Elemento
   substituído não renderiza ::before/::after — por isso `content: normal`
   vem primeiro, senão o texto abaixo nunca aparece e a imagem antiga fica.
   Depois: quadrado da arte (30px) no fundo + "Fapp HelpDesk" em Sora, com o
   F em laranja — ::before é o F, ::after é o resto. O overflow precisa ser
   visível, senão os pseudo-elementos herdam o esconderijo do text-indent. */
.glpi-logo, span.glpi-logo {
  content: normal !important;
  background: url("/fapp/logo/helpdesk-64.png") left center / 30px 30px no-repeat !important;
  -webkit-mask: none !important; mask: none !important;
  text-indent: 0 !important; overflow: visible !important;
  width: auto !important; min-width: 0 !important; height: 36px !important;
  display: inline-flex !important; align-items: center; white-space: nowrap;
  padding-left: 40px; font-size: 0 !important;
}
.glpi-logo::before, .glpi-logo::after {
  font-family: "Sora", "Manrope", sans-serif; font-weight: 700; font-size: 17px;
  letter-spacing: -.01em; line-height: 1;
}
.glpi-logo::before { content: "F"; color: #FF7A1A; }
.glpi-logo::after { content: "app HelpDesk"; color: #fff; }

/* menu vertical (page_layout = vertical): a marca fica no topo da barra lateral */
.navbar-vertical .glpi-logo { margin: 6px 0; }
.navbar-vertical.navbar-collapse-menu .glpi-logo,
.navbar-vertical .navbar-brand.reduced .glpi-logo,
.reduced .glpi-logo { padding-left: 32px; }
.navbar-vertical.navbar-collapse-menu .glpi-logo::before,
.navbar-vertical.navbar-collapse-menu .glpi-logo::after,
.reduced .glpi-logo::before, .reduced .glpi-logo::after { content: none; }

/* --- rodapé ---------------------------------------------------------------------- */
/* O `.copyright` NÃO é decoração: é o link "GLPI 10.0.26 Copyright (C) 2015-2026
   Teclib' and contributors" do modal Sobre (templates/layout/parts/user_header.html.twig,
   linha 131). A GPL v3 §5(d) manda preservar o Appropriate Legal Notice de quem
   distribui obra derivada, e nós distribuímos — pela rede, com a marca trocada.
   Havia aqui um `font-size: 0` com um `::after` da Fapp por cima; foi removido.
   Não perdemos nada: a marca Fapp já aparece no título da aba, no logotipo do
   menu e na tela de login. Esconder o aviso do Teclib' só nos custaria a
   conformidade. Se um dia o rodapé precisar de acabamento, mexa em cor e
   tamanho — nunca no texto nem na visibilidade. */

/* --- acabamento sobre o Tabler ----------------------------------------------------------- */
.card { box-shadow: 0 1px 2px rgba(17, 22, 50, .06); }
/* No GLPI, --tblr-btn-color é o FUNDO do botão (o texto é --tblr-btn-color-text).
   Pôr #fff aqui deixa o "Entrar" branco sobre branco — foi o que aconteceu em
   07/09/2026. A cor já vem da paleta; aqui só o peso e o hover mais claro. */
.btn-primary { font-weight: 600; }
.btn-primary, .btn-outline-primary, .btn-ghost-primary { --tblr-btn-color-interactive: #FF9440; }
.form-control:focus, .form-select:focus, .select2-container--open .select2-selection {
  border-color: #FF7A1A !important; box-shadow: 0 0 0 3px rgba(255, 122, 26, .22) !important;
}
.nav-tabs .nav-link.active { border-bottom-color: #FF7A1A; }
.badge { font-weight: 600; letter-spacing: .01em; }
.table thead th { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }

/* --- tela de login dividida -------------------------------------------------------------- */
/* Estrutura do page_card_notlogged.html.twig:
     body.welcome-anonymous > .page-anonymous > .flex-fill > .container-tight > (logo, card)
   Sobre a arte e o nome: em qualquer largura o logo da coluna do formulário é a
   arte quadrada com "Fapp HelpDesk" embaixo. Em telas largas entra ainda o painel
   da esquerda — FIXO na janela, e não absoluto dentro do .page-anonymous, porque
   o GLPI empurra esse bloco para baixo com margens próprias e o painel ficava
   começando no meio da tela (medido em 07/09/2026). */
body.welcome-anonymous { background: #F4F5FA; }
.page-anonymous .glpi-logo {
  background: url("/fapp/logo/helpdesk-144.png") center top / 96px 96px no-repeat !important;
  padding: 106px 0 0; height: auto !important; justify-content: center;
}
.page-anonymous .glpi-logo::before, .page-anonymous .glpi-logo::after { font-size: 22px; }
.page-anonymous .glpi-logo::after { color: #111632; }
.page-anonymous .card { border-radius: 12px; box-shadow: 0 10px 30px rgba(17, 22, 50, .08); }

@media (min-width: 900px) {
  .page-anonymous::before {
    content: ""; position: fixed; left: 0; top: 0; bottom: 0; width: 50%; z-index: 0;
    background:
      url("/fapp/logo/helpdesk-512.png") center 38% / 260px 260px no-repeat,
      radial-gradient(ellipse 70% 60% at 30% 30%, rgba(47, 91, 255, .22), transparent 60%),
      radial-gradient(ellipse 50% 50% at 80% 90%, rgba(255, 122, 26, .14), transparent 60%),
      #0B1026;
  }
  .page-anonymous::after {
    content: "Sustentação de TIC com prova: SLA por classe contratual, acesso remoto só com o Sim do usuário e sessões gravadas no chamado.\A\A FAPP Solutions";
    white-space: pre-line; position: fixed; left: 0; bottom: 0; width: 50%; z-index: 1;
    padding: 0 12% 56px; color: rgba(255, 255, 255, .78);
    font-family: "Manrope", sans-serif; font-size: 15px; line-height: 1.6; text-align: center;
  }
  /* O lema em inglês e espanhol. Só o `content` muda — o resto da regra
     acima continua valendo, e o português segue sendo o padrão para
     qualquer outro idioma. O gancho é o `<html lang>` que o nosso
     head.html.twig renderiza; na tela de login ele vem do Accept-Language
     (Session::getPreferredLanguage), então o lema já chega no idioma do
     navegador antes de qualquer escolha. O `^=` cobre en-GB e en-US.
     O wordmark ("F" + "app HelpDesk") NÃO entra aqui: é marca, não texto.
     Atenção: dentro de content: não pode haver aspas duplas, e o \A\A é a
     quebra de linha antes da assinatura — sem ele o lema vira uma linha só. */
  html[lang^="en"] .page-anonymous::after {
    content: "ICT support with proof: SLA by contract class, remote access only with the user's Yes, and sessions recorded in the ticket.\A\A FAPP Solutions";
  }
  html[lang^="es"] .page-anonymous::after {
    content: "Soporte de TIC con prueba: SLA por clase contractual, acceso remoto solo con el Sí del usuario y sesiones grabadas en el ticket.\A\A FAPP Solutions";
  }
  .page-anonymous > .flex-fill { margin-left: 50%; width: 50%; position: relative; z-index: 2; }
  .page-anonymous .container-tight { max-width: 440px; }
}