/* Marca Netcare sobre o GLPI 11.
*
* Aplicado pelo campo `custom_css_code` da ENTIDADE RAIZ — mecanismo nativo do
* GLPI (Entity.php), injetado em toda página pela função Twig `custom_css()`,
* inclusive na tela de login (sem sessão, o GLPI cai na entidade 0). Nenhum
* arquivo do GLPI é modificado: trocar de versão não pede nada daqui de volta.
*
* Aplicar com `./scripts/marca-netcare.sh` — não editar pelo navegador, senão a
* próxima execução do script desfaz a edição.
*
* ─── Por que o logo sai por variável ──────────────────────────────────────
* O GLPI não desenha o logo num ![]()
: é um pintado
* por `--glpi-logo-*`. Trocar as variáveis troca a marca nos três lugares de
* uma vez — login, cabeçalho e menu recolhido — e continua valendo quando o
* GLPI mudar o HTML dessas telas.
*
* O SVG vai embutido em data: URI de propósito: não depende de arquivo servido
* por caminho nenhum, então não quebra se o GLPI mudar de subcaminho nem exige
* exceção de CSP.
*/
:root {
/* ---- Marca ----
`light` = versão clara, para fundo escuro (cabeçalho, menu);
`dark` = versão escura, para fundo claro (login no tema claro);
`reduced`= só o símbolo, para o menu recolhido em 40px. */
--glpi-logo-light: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20200%20110%22%3E%3Csvg%20x=%224%22%20y=%2228%22%20width=%2256%22%20height=%2256%22%20viewBox=%220%200%2070%2070%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22g%22%20x1=%220%25%22%20y1=%220%25%22%20x2=%22100%25%22%20y2=%22100%25%22%3E%3Cstop%20offset=%220%25%22%20stop-color=%22%2300FFCC%22/%3E%3Cstop%20offset=%2250%25%22%20stop-color=%22%2300E5D9%22/%3E%3Cstop%20offset=%22100%25%22%20stop-color=%22%2300A3FF%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%20fill=%22url(%23g)%22%3E%3Cpath%20d=%22M23%202h21c2.5%200%204%202%203%204.5L37%2029c-1%202.5-3.5%204-6%204H10c-2.5%200-4-2-3-4.5L17%206c1-2.5%203.5-4%206-4Z%22/%3E%3Cpath%20d=%22M52%2015h13c1.5%200%202.5%201%202%202.5L62%2029c-.5%201.5-2%202.5-3.5%202.5H45c-1.5%200-2.5-1-2-2.5L48%2017.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M12%2037h13c1.5%200%202.5%201%202%202.5L22%2051c-.5%201.5-2%202.5-3.5%202.5H5c-1.5%200-2.5-1-2-2.5L8%2039.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M33%2035h25c2.5%200%204%202%203%204.5L51%2062c-1%202.5-3.5%204-6%204H25c-7.5%200-9-1.5-8-4l10-22.5c1-2.5%203.5-4%206-4Z%22/%3E%3C/g%3E%3C/svg%3E%3Ctext%20x=%2268%22%20y=%2257%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2225%22%20font-weight=%22600%22%20letter-spacing=%22-.4%22%20fill=%22%23f4f6fa%22%3ENetcare%3C/text%3E%3Ctext%20x=%2269%22%20y=%2277%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2212%22%20font-weight=%22500%22%20letter-spacing=%222.8%22%20fill=%22%239fb0c9%22%3ECHAMADOS%3C/text%3E%3C/svg%3E");
--glpi-logo-dark: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20200%20110%22%3E%3Csvg%20x=%224%22%20y=%2228%22%20width=%2256%22%20height=%2256%22%20viewBox=%220%200%2070%2070%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22g%22%20x1=%220%25%22%20y1=%220%25%22%20x2=%22100%25%22%20y2=%22100%25%22%3E%3Cstop%20offset=%220%25%22%20stop-color=%22%2300FFCC%22/%3E%3Cstop%20offset=%2250%25%22%20stop-color=%22%2300E5D9%22/%3E%3Cstop%20offset=%22100%25%22%20stop-color=%22%2300A3FF%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%20fill=%22url(%23g)%22%3E%3Cpath%20d=%22M23%202h21c2.5%200%204%202%203%204.5L37%2029c-1%202.5-3.5%204-6%204H10c-2.5%200-4-2-3-4.5L17%206c1-2.5%203.5-4%206-4Z%22/%3E%3Cpath%20d=%22M52%2015h13c1.5%200%202.5%201%202%202.5L62%2029c-.5%201.5-2%202.5-3.5%202.5H45c-1.5%200-2.5-1-2-2.5L48%2017.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M12%2037h13c1.5%200%202.5%201%202%202.5L22%2051c-.5%201.5-2%202.5-3.5%202.5H5c-1.5%200-2.5-1-2-2.5L8%2039.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M33%2035h25c2.5%200%204%202%203%204.5L51%2062c-1%202.5-3.5%204-6%204H25c-7.5%200-9-1.5-8-4l10-22.5c1-2.5%203.5-4%206-4Z%22/%3E%3C/g%3E%3C/svg%3E%3Ctext%20x=%2268%22%20y=%2257%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2225%22%20font-weight=%22600%22%20letter-spacing=%22-.4%22%20fill=%22%230f172a%22%3ENetcare%3C/text%3E%3Ctext%20x=%2269%22%20y=%2277%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2212%22%20font-weight=%22500%22%20letter-spacing=%222.8%22%20fill=%22%2355637a%22%3ECHAMADOS%3C/text%3E%3C/svg%3E");
--glpi-logo-light-reduced: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%22-1%20-1%2072%2072%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22g%22%20x1=%220%25%22%20y1=%220%25%22%20x2=%22100%25%22%20y2=%22100%25%22%3E%3Cstop%20offset=%220%25%22%20stop-color=%22%2300FFCC%22/%3E%3Cstop%20offset=%2250%25%22%20stop-color=%22%2300E5D9%22/%3E%3Cstop%20offset=%22100%25%22%20stop-color=%22%2300A3FF%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%20fill=%22url(%23g)%22%3E%3Cpath%20d=%22M23%202h21c2.5%200%204%202%203%204.5L37%2029c-1%202.5-3.5%204-6%204H10c-2.5%200-4-2-3-4.5L17%206c1-2.5%203.5-4%206-4Z%22/%3E%3Cpath%20d=%22M52%2015h13c1.5%200%202.5%201%202%202.5L62%2029c-.5%201.5-2%202.5-3.5%202.5H45c-1.5%200-2.5-1-2-2.5L48%2017.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M12%2037h13c1.5%200%202.5%201%202%202.5L22%2051c-.5%201.5-2%202.5-3.5%202.5H5c-1.5%200-2.5-1-2-2.5L8%2039.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M33%2035h25c2.5%200%204%202%203%204.5L51%2062c-1%202.5-3.5%204-6%204H25c-7.5%200-9-1.5-8-4l10-22.5c1-2.5%203.5-4%206-4Z%22/%3E%3C/g%3E%3C/svg%3E");
--glpi-logo-dark-reduced: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%22-1%20-1%2072%2072%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22g%22%20x1=%220%25%22%20y1=%220%25%22%20x2=%22100%25%22%20y2=%22100%25%22%3E%3Cstop%20offset=%220%25%22%20stop-color=%22%2300FFCC%22/%3E%3Cstop%20offset=%2250%25%22%20stop-color=%22%2300E5D9%22/%3E%3Cstop%20offset=%22100%25%22%20stop-color=%22%2300A3FF%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%20fill=%22url(%23g)%22%3E%3Cpath%20d=%22M23%202h21c2.5%200%204%202%203%204.5L37%2029c-1%202.5-3.5%204-6%204H10c-2.5%200-4-2-3-4.5L17%206c1-2.5%203.5-4%206-4Z%22/%3E%3Cpath%20d=%22M52%2015h13c1.5%200%202.5%201%202%202.5L62%2029c-.5%201.5-2%202.5-3.5%202.5H45c-1.5%200-2.5-1-2-2.5L48%2017.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M12%2037h13c1.5%200%202.5%201%202%202.5L22%2051c-.5%201.5-2%202.5-3.5%202.5H5c-1.5%200-2.5-1-2-2.5L8%2039.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M33%2035h25c2.5%200%204%202%203%204.5L51%2062c-1%202.5-3.5%204-6%204H25c-7.5%200-9-1.5-8-4l10-22.5c1-2.5%203.5-4%206-4Z%22/%3E%3C/g%3E%3C/svg%3E");
--glpi-logo-light-login: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20200%20110%22%3E%3Csvg%20x=%2272%22%20y=%222%22%20width=%2256%22%20height=%2256%22%20viewBox=%220%200%2070%2070%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22g%22%20x1=%220%25%22%20y1=%220%25%22%20x2=%22100%25%22%20y2=%22100%25%22%3E%3Cstop%20offset=%220%25%22%20stop-color=%22%2300FFCC%22/%3E%3Cstop%20offset=%2250%25%22%20stop-color=%22%2300E5D9%22/%3E%3Cstop%20offset=%22100%25%22%20stop-color=%22%2300A3FF%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%20fill=%22url(%23g)%22%3E%3Cpath%20d=%22M23%202h21c2.5%200%204%202%203%204.5L37%2029c-1%202.5-3.5%204-6%204H10c-2.5%200-4-2-3-4.5L17%206c1-2.5%203.5-4%206-4Z%22/%3E%3Cpath%20d=%22M52%2015h13c1.5%200%202.5%201%202%202.5L62%2029c-.5%201.5-2%202.5-3.5%202.5H45c-1.5%200-2.5-1-2-2.5L48%2017.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M12%2037h13c1.5%200%202.5%201%202%202.5L22%2051c-.5%201.5-2%202.5-3.5%202.5H5c-1.5%200-2.5-1-2-2.5L8%2039.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M33%2035h25c2.5%200%204%202%203%204.5L51%2062c-1%202.5-3.5%204-6%204H25c-7.5%200-9-1.5-8-4l10-22.5c1-2.5%203.5-4%206-4Z%22/%3E%3C/g%3E%3C/svg%3E%3Ctext%20x=%22100%22%20y=%2282%22%20text-anchor=%22middle%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2224%22%20font-weight=%22600%22%20letter-spacing=%22-.4%22%20fill=%22%23f4f6fa%22%3ENetcare%3C/text%3E%3Ctext%20x=%22100%22%20y=%22100%22%20text-anchor=%22middle%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2211.5%22%20font-weight=%22500%22%20letter-spacing=%223%22%20fill=%22%239fb0c9%22%3ECHAMADOS%3C/text%3E%3C/svg%3E");
--glpi-logo-dark-login: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20200%20110%22%3E%3Csvg%20x=%2272%22%20y=%222%22%20width=%2256%22%20height=%2256%22%20viewBox=%220%200%2070%2070%22%3E%3Cdefs%3E%3ClinearGradient%20id=%22g%22%20x1=%220%25%22%20y1=%220%25%22%20x2=%22100%25%22%20y2=%22100%25%22%3E%3Cstop%20offset=%220%25%22%20stop-color=%22%2300FFCC%22/%3E%3Cstop%20offset=%2250%25%22%20stop-color=%22%2300E5D9%22/%3E%3Cstop%20offset=%22100%25%22%20stop-color=%22%2300A3FF%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%20fill=%22url(%23g)%22%3E%3Cpath%20d=%22M23%202h21c2.5%200%204%202%203%204.5L37%2029c-1%202.5-3.5%204-6%204H10c-2.5%200-4-2-3-4.5L17%206c1-2.5%203.5-4%206-4Z%22/%3E%3Cpath%20d=%22M52%2015h13c1.5%200%202.5%201%202%202.5L62%2029c-.5%201.5-2%202.5-3.5%202.5H45c-1.5%200-2.5-1-2-2.5L48%2017.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M12%2037h13c1.5%200%202.5%201%202%202.5L22%2051c-.5%201.5-2%202.5-3.5%202.5H5c-1.5%200-2.5-1-2-2.5L8%2039.5c.5-1.5%202-2.5%204-2.5Z%22/%3E%3Cpath%20d=%22M33%2035h25c2.5%200%204%202%203%204.5L51%2062c-1%202.5-3.5%204-6%204H25c-7.5%200-9-1.5-8-4l10-22.5c1-2.5%203.5-4%206-4Z%22/%3E%3C/g%3E%3C/svg%3E%3Ctext%20x=%22100%22%20y=%2282%22%20text-anchor=%22middle%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2224%22%20font-weight=%22600%22%20letter-spacing=%22-.4%22%20fill=%22%230f172a%22%3ENetcare%3C/text%3E%3Ctext%20x=%22100%22%20y=%22100%22%20text-anchor=%22middle%22%20font-family=%22'IBM%20Plex%20Sans','Segoe%20UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif%22%20font-size=%2211.5%22%20font-weight=%22500%22%20letter-spacing=%223%22%20fill=%22%2355637a%22%3ECHAMADOS%3C/text%3E%3C/svg%3E");
/* ---- Cor primária ----
Ciano da Netcare, mas o passo 700 (#0e7490), não o 500 da identidade. O 500
tem 2,4:1 com texto branco: bonito num logo, ilegível num botão. O 700 dá
5,4:1 e mantém a família da marca. O 500 fica onde é traço fino e não
carrega texto: foco, seleção, sublinhado. */
--tblr-primary: #0e7490;
--tblr-primary-fg: #ffffff;
--tblr-link-color-rgb: 14, 116, 144;
--glpi-form-header-fg: #0e7490;
--glpi-badge-fg: #0e7490;
/* ---- Menu lateral ----
O azul-ardósia da linha Netcare (mesmo `ink` dos outros painéis). Contraste de
16,5:1 com o texto do menu. */
--glpi-mainmenu-bg: #0f172a;
--glpi-mainmenu-fg: #f4f6fa;
--glpi-mainmenu-fg-muted: #9fb0c9;
--glpi-mainmenu-active-bg: #1e3a4a;
--tblr-navbar-color: #0f172a;
}
/* O logo do cabeçalho vinha de PNG de 100px, com tamanho natural. SVG não tem
tamanho natural, então sem `background-size` ele estica para a caixa e
distorce. */
.page .glpi-logo {
background-size: contain !important;
background-position: left center !important;
}
/* Realce de foco e seleção no ciano da marca: é traço, não fundo de texto, e
é onde o 500 pode aparecer sem custo de legibilidade. */
:focus-visible {
outline-color: #06b6d4;
}
::selection {
background: rgba(6, 182, 212, .28);
}
/* Barra superior da marca. Dois pixels que amarram o cabeçalho ao resto da
linha Netcare, sem mexer em layout nenhum. */
body.page .navbar-expand-md:first-of-type,
body .page-wrapper > .navbar:first-of-type {
border-top: 2px solid #06b6d4;
}
/* ─── Login Netcare ───
Card único sobre o fluxo nativo do GLPI. Não usa grade, elementos absolutos
nem textos gerados, para permanecer estável entre resoluções e atualizações. */
body.welcome-anonymous {
min-height: 100vh;
background:
radial-gradient(circle at 10% 10%, rgba(6, 182, 212, .14), transparent 26rem),
radial-gradient(circle at 90% 90%, rgba(14, 116, 144, .10), transparent 28rem),
#f4f7fb;
}
.page-anonymous {
position: relative;
min-height: 100vh;
}
.page-anonymous::before {
content: "";
position: fixed;
inset: 0;
pointer-events: none;
opacity: .32;
background-image: radial-gradient(rgba(15, 23, 42, .16) .7px, transparent .7px);
background-size: 22px 22px;
mask-image: linear-gradient(to bottom, #000, transparent 78%);
}
.page-anonymous > .flex-fill {
margin-top: 0 !important;
padding: 2rem 1rem !important;
}
.page-anonymous .container-tight {
position: relative;
width: 100%;
max-width: 30rem !important;
padding: 0 !important;
}
.page-anonymous .container-tight > .text-center {
position: static;
width: 100%;
margin: 0 auto 1.25rem;
text-align: center !important;
}
.page-anonymous .glpi-logo {
width: 12rem !important;
height: 6.6rem !important;
margin: 0 !important;
background-image: var(--glpi-logo-dark-login) !important;
background-size: contain !important;
background-position: center !important;
}
.page-anonymous .main-content-card {
display: block;
width: 100%;
min-height: 0;
margin: 0;
overflow: hidden;
border: 1px solid rgba(15, 23, 42, .08);
border-top: 4px solid #0891b2;
border-radius: 1rem;
background: #fff;
box-shadow:
0 24px 60px rgba(15, 23, 42, .13),
0 2px 8px rgba(15, 23, 42, .06);
}
.page-anonymous .main-content-card > .card-header {
display: none;
}
.page-anonymous .main-content-card > .card-body {
display: block;
padding: 2rem 2.25rem 2.1rem;
background: #fff;
}
.page-anonymous .main-content-card form,
.page-anonymous .main-content-card form > .row,
.page-anonymous .main-content-card form .col-md-5 {
width: 100%;
}
.page-anonymous .main-content-card form .col-md-5 {
flex: 0 0 100%;
max-width: 100%;
}
.page-anonymous .rich_text_container {
margin-bottom: .7rem;
text-align: left !important;
}
.page-anonymous .rich_text_container p {
margin: 0;
color: #0e7490 !important;
font-size: .72rem;
font-weight: 700;
letter-spacing: .11em;
text-transform: uppercase;
}
.page-anonymous .main-content-card form .card-header {
justify-content: flex-start;
min-height: auto;
margin-bottom: 1.5rem !important;
padding: 0 0 1.25rem;
border: 0;
border-bottom: 1px solid #e7edf3;
background: transparent;
}
.page-anonymous .main-content-card form[action*="/front/login.php"] h2 {
margin: 0 !important;
color: #0f172a;
font-size: 1.45rem;
font-weight: 650;
letter-spacing: -.025em;
}
.page-anonymous .main-content-card form[action*="/front/login.php"] h2::after {
content: none;
}
/* Recuperação de senha usa container nativo menor (40rem) e não comporta
as duas colunas. Mantém a mesma identidade numa composição compacta. */
.page-anonymous .main-content-card:has(form[action*="lostpassword"]) {
display: block;
min-height: 0;
padding-top: 0;
background: #fff;
}
.page-anonymous .main-content-card:has(form[action*="lostpassword"]) > .card-header {
display: none;
}
.page-anonymous .main-content-card:has(form[action*="lostpassword"]) > .card-body {
padding: 2.5rem clamp(1.5rem, 6vw, 4rem);
}
.page-anonymous .container-tight:has(form[action*="lostpassword"]) .glpi-logo {
width: 12rem !important;
background-position: center !important;
}
.page-anonymous form[action*="lostpassword"] h2 {
color: #0f172a;
font-size: 1.55rem;
font-weight: 650;
letter-spacing: -.025em;
}
.page-anonymous form[action*="lostpassword"] .form-footer .btn {
width: 100%;
}
.page-anonymous .form-label,
.page-anonymous .form-check-label {
color: #334155;
font-size: .82rem;
font-weight: 600;
}
.page-anonymous .form-control,
.page-anonymous .form-select,
.page-anonymous .select2-selection {
min-height: 3rem;
border: 1px solid #d6e0e8 !important;
border-radius: .7rem !important;
background-color: #f8fafc !important;
box-shadow: none !important;
transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.page-anonymous .form-control:hover,
.page-anonymous .form-select:hover,
.page-anonymous .select2-selection:hover {
border-color: #a8bdca !important;
background-color: #fff !important;
}
.page-anonymous .form-control:focus,
.page-anonymous .form-select:focus,
.page-anonymous .select2-container--focus .select2-selection {
border-color: #0891b2 !important;
background-color: #fff !important;
box-shadow: 0 0 0 3px rgba(6, 182, 212, .14) !important;
}
.page-anonymous .btn-primary {
min-height: 3rem;
margin-top: .5rem;
border: 0;
border-radius: .7rem;
background: linear-gradient(135deg, #0e7490, #075f78) !important;
box-shadow: 0 8px 18px rgba(14, 116, 144, .2);
font-weight: 650;
letter-spacing: .01em;
transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.page-anonymous .btn-primary:hover {
filter: brightness(1.07);
transform: translateY(-1px);
box-shadow: 0 10px 22px rgba(14, 116, 144, .28);
}
.page-anonymous .forgot_password a {
color: #0e7490;
font-size: .82rem;
font-weight: 600;
text-decoration: none;
}
.page-anonymous .forgot_password a:hover {
text-decoration: underline;
}
.page-anonymous .netcare-login-privacidade {
padding-top: .8rem;
border-top: 1px solid rgba(15, 150, 180, .16);
}
.page-anonymous .netcare-login-privacidade .form-hint {
padding-left: 1.65rem;
color: #718096;
font-size: .72rem;
}
.page-anonymous .netcare-lgpd-link {
display: inline;
border: 0;
padding: 0;
color: #087f9b;
background: transparent;
font: inherit;
font-weight: 700;
text-decoration: underline;
text-underline-offset: 2px;
}
.netcare-lgpd-modal {
width: min(680px, calc(100vw - 2rem));
max-height: calc(100dvh - 2rem);
overflow: auto;
border: 1px solid #d8e4e8;
border-radius: 16px;
padding: 1.35rem;
color: #243746;
background: #fff;
box-shadow: 0 30px 90px #001b2c66;
}
.netcare-lgpd-modal::backdrop { background: #00131fcc; backdrop-filter: blur(5px); }
.netcare-lgpd-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.netcare-lgpd-head strong { color: #0b2d3b; font-size: 1.1rem; }
.netcare-lgpd-head button { border: 0; padding: 0 .35rem; color: #607985; background: transparent; font-size: 1.8rem; line-height: 1; }
.netcare-lgpd-body { max-height: 55dvh; overflow: auto; margin-bottom: 1rem; padding: 1rem; border-radius: 10px; background: #f4f8f9; font-size: .86rem; line-height: 1.55; }
.netcare-lgpd-body ul { display: grid; gap: .55rem; margin: .9rem 0; padding-left: 1.2rem; }
.netcare-lgpd-body small { color: #718096; }
.page-anonymous .container-tight > .text-muted.mt-3 {
margin-top: 1rem !important;
color: #64748b !important;
}
@media (max-width: 767.98px) {
.page-anonymous > .flex-fill {
justify-content: flex-start !important;
padding: 1rem !important;
}
.page-anonymous .glpi-logo {
width: 10.5rem !important;
height: 5.8rem !important;
background-position: center !important;
}
.page-anonymous .main-content-card {
display: block;
min-height: 0;
border-radius: 1rem;
background: #fff;
}
.page-anonymous .main-content-card > .card-header {
display: none;
}
.page-anonymous .main-content-card > .card-body {
padding: 1.6rem 1.25rem 1.5rem;
}
}
[data-glpi-theme-dark="1"] body.welcome-anonymous,
body.welcome-anonymous[data-glpi-theme-dark="1"] {
background: #070d18;
}
[data-glpi-theme-dark="1"] .page-anonymous .main-content-card > .card-body {
background: #111c2b;
}
[data-glpi-theme-dark="1"] .page-anonymous .main-content-card form h2,
[data-glpi-theme-dark="1"] .page-anonymous .form-label,
[data-glpi-theme-dark="1"] .page-anonymous .form-check-label {
color: #e8eef6;
}
[data-glpi-theme-dark="1"] .page-anonymous .main-content-card form .card-header {
border-bottom-color: #26364a;
}
[data-glpi-theme-dark="1"] .page-anonymous .form-control,
[data-glpi-theme-dark="1"] .page-anonymous .form-select,
[data-glpi-theme-dark="1"] .page-anonymous .select2-selection {
border-color: #304156 !important;
background-color: #0c1624 !important;
}
/* Rodapé de direitos autorais.
`Html::getCopyrightMessage()` monta a linha "GLPI Copyright (C) 2015-2026
Teclib' and contributors" em PHP e o template imprime com |raw — não há
configuração, hook nem tradução que troque o texto. Só que a âncora carrega
a classe `copyright`, que é estável: `font-size: 0` colapsa o texto original
sem removê-lo do documento (a atribuição do projeto continua no HTML e o
link segue funcionando, que é o que a licença GPL pede) e o `::after` imprime
a razão social da Netcare no lugar. Vale na tela de login e no rodapé interno,
que usam a mesma classe. */
a.copyright {
font-size: 0 !important;
text-decoration: none !important;
}
a.copyright::after {
content: "Netcare Serviços em Tecnologia · CNPJ 22.115.808/0001-57";
font-size: 0.75rem;
color: var(--tblr-secondary, #6c757d);
}
/* Banner do portal do cliente (/Helpdesk).
`--glpi-helpdesk-header` é derivada do menu por
`hsl(from var(--glpi-mainmenu-bg) h s 80)`: como o menu Netcare é o azul-ardósia
#0f172a, o banner saía num lilás acinzentado que não é da marca. Fixar a
variável resolve sem tocar no SCSS — o GLPI recompila o CSS dele e esta
linha continua valendo.
Fica CLARO de propósito: o título e o campo de busca do banner são escritos
em tom escuro pelo tema, e escurecer o fundo tornaria os dois ilegíveis. */
:root {
--glpi-helpdesk-header: #cfeaf1;
}
/* No tema escuro o texto do banner é claro, então o fundo é que precisa ser
escuro — o mesmo ciano, com a luminosidade invertida. */
[data-glpi-theme-dark="1"] {
--glpi-helpdesk-header: #0d3b47;
}
/* ═══ Login Commander · identidade operacional ═══════════════════════════
O formulário continua nativo do GLPI; esta camada trata somente composição,
hierarquia e marca. Roxo é ação/identidade, lima é sinal e carvão é base. */
body.welcome-anonymous.netcare-login-ready {
--nc-login-ground: #0d0b10;
--nc-login-panel: #151219;
--nc-login-panel-deep: #100d13;
--nc-login-field: #0b090d;
--nc-login-line: rgba(255,255,255,.09);
--nc-login-text: #f3f0f5;
--nc-login-muted: #9b93a3;
--nc-login-dim: #877f8c;
--nc-login-brand: #7348e8;
--nc-login-brand-lit: #a98cf3;
--nc-login-accent: #e5f034;
color: var(--nc-login-muted);
background:
radial-gradient(circle at 9% 12%, rgba(115,72,232,.22), transparent 30rem),
radial-gradient(circle at 92% 90%, rgba(229,240,52,.045), transparent 28rem),
var(--nc-login-ground) !important;
}
body.welcome-anonymous.netcare-login-ready::before {
content: "";
position: fixed;
inset: 0;
pointer-events: none;
opacity: .28;
background-image:
linear-gradient(rgba(169,140,243,.075) 1px, transparent 1px),
linear-gradient(90deg, rgba(169,140,243,.075) 1px, transparent 1px);
background-size: 52px 52px;
mask-image: linear-gradient(125deg,#000,transparent 68%);
}
.netcare-login-ready .page-anonymous { min-height: 100dvh; }
.netcare-login-ready .page-anonymous::before { display: none; }
.netcare-login-ready .page-anonymous > .flex-fill {
min-height: 100dvh;
margin: 0 !important;
padding: clamp(1rem,3vw,2.5rem) !important;
}
.netcare-login-ready .page-anonymous .container-tight {
width: min(1180px,100%) !important;
max-width: 1180px !important;
margin: auto;
padding: 0 !important;
}
.netcare-login-ready .container-tight > .text-center:not(.text-muted) { display: none; }
.netcare-login-ready .main-content-card.netcare-login-panel {
display: grid;
grid-template-columns: minmax(0,1.12fr) minmax(410px,.88fr);
width: 100%;
min-height: min(760px,calc(100dvh - clamp(2rem,6vw,5rem)));
margin: 0;
overflow: hidden;
border: 1px solid var(--nc-login-line);
border-radius: 24px;
background: var(--nc-login-panel-deep);
box-shadow: 0 42px 110px -46px rgba(0,0,0,.95), inset 0 1px rgba(255,255,255,.035);
}
.netcare-login-ready .main-content-card.netcare-login-panel > .card-header { display: none; }
.netcare-login-ready .main-content-card.netcare-login-panel > .card-body {
display: flex;
min-width: 0;
align-items: center;
justify-content: center;
padding: clamp(2rem,4.5vw,4.6rem);
color: var(--nc-login-muted);
background:
radial-gradient(circle at 100% 0,rgba(115,72,232,.09),transparent 21rem),
var(--nc-login-panel-deep);
}
.netcare-login-story {
position: relative;
display: flex;
min-width: 0;
overflow: hidden;
flex-direction: column;
padding: clamp(2.25rem,4.2vw,4.4rem);
color: var(--nc-login-text);
background:
radial-gradient(circle at 15% 83%,rgba(229,240,52,.055),transparent 22rem),
radial-gradient(circle at 85% 12%,rgba(115,72,232,.17),transparent 25rem),
#19151f;
}
.netcare-login-story::before {
content: "";
position: absolute;
right: -125px;
bottom: -180px;
width: 390px;
height: 390px;
border: 1px solid rgba(169,140,243,.14);
border-radius: 50%;
box-shadow: 0 0 0 58px rgba(169,140,243,.025),0 0 0 116px rgba(169,140,243,.018);
}
.netcare-login-story::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
opacity: .32;
background-image: radial-gradient(rgba(255,255,255,.16) .65px,transparent .65px);
background-size: 23px 23px;
mask-image: linear-gradient(140deg,#000,transparent 56%);
}
.netcare-story-top,.netcare-story-copy,.netcare-story-status { position: relative; z-index: 1; }
.netcare-story-top { display: flex; align-items: center; gap: 15px; }
.netcare-story-top img { display: block; width: 193px; height: auto; }
.netcare-story-top > span {
padding-left: 15px;
border-left: 1px solid rgba(255,255,255,.15);
color: var(--nc-login-accent);
font-size: .66rem;
font-weight: 700;
letter-spacing: .2em;
text-transform: uppercase;
}
.netcare-story-copy { max-width: 570px; margin: auto 0; padding: 3rem 0 2.2rem; }
.netcare-story-kicker {
display: inline-flex;
align-items: center;
gap: .65rem;
margin-bottom: 1.6rem;
color: var(--nc-login-accent);
font-size: .68rem;
font-weight: 700;
letter-spacing: .14em;
text-transform: uppercase;
}
.netcare-story-kicker i,.netcare-story-status > i {
display: block;
width: 7px;
height: 7px;
border-radius: 50%;
background: var(--nc-login-accent);
box-shadow: 0 0 0 5px rgba(229,240,52,.09),0 0 18px rgba(229,240,52,.35);
}
.netcare-story-copy h1 {
max-width: 620px;
margin: 0;
color: #fff;
font-size: clamp(2.55rem,4vw,4.25rem);
font-weight: 600;
line-height: .99;
letter-spacing: -.047em;
}
.netcare-story-copy h1 em { color: var(--nc-login-brand-lit); font-style: normal; }
.netcare-story-copy > p {
max-width: 540px;
margin: 1.6rem 0 2rem;
color: #aaa2b3;
font-size: .98rem;
line-height: 1.7;
}
.netcare-story-features { display: grid; max-width: 550px; gap: .5rem; }
.netcare-story-features > div {
display: grid;
grid-template-columns: 2.2rem 1fr;
align-items: center;
gap: .85rem;
padding: .72rem .8rem;
border: 1px solid transparent;
border-radius: 10px;
transition: border-color .18s ease,background-color .18s ease,transform .18s ease;
}
.netcare-story-features > div:hover {
border-color: rgba(169,140,243,.14);
background: rgba(255,255,255,.025);
transform: translateX(3px);
}
.netcare-story-features b {
color: var(--nc-login-brand-lit);
font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
font-size: .67rem;
font-weight: 500;
}
.netcare-story-features span { display: grid; gap: .15rem; }
.netcare-story-features strong { color: #e7e2eb; font-size: .78rem; font-weight: 600; }
.netcare-story-features small { color: #8a8290; font-size: .67rem; }
.netcare-story-status {
display: flex;
width: fit-content;
align-items: center;
gap: .8rem;
padding: .75rem .95rem;
border: 1px solid rgba(255,255,255,.07);
border-radius: 10px;
background: rgba(255,255,255,.022);
}
.netcare-story-status span { display: grid; gap: .08rem; }
.netcare-story-status strong { color: #d9d3dd; font-size: .67rem; font-weight: 600; }
.netcare-story-status small { color: #837b88; font-size: .6rem; }
.netcare-login-mobile-brand { display: none; }
.netcare-login-ready .main-content-card form,
.netcare-login-ready .main-content-card form > .row,
.netcare-login-ready .main-content-card form .col-md-5 {
width: 100%;
max-width: none;
}
.netcare-login-ready .main-content-card form .col-md-5 { flex: 0 0 100%; padding: 0; }
.netcare-login-ready .main-content-card form { max-width: 390px; margin: auto; }
.netcare-login-ready .main-content-card form .card-header {
justify-content: flex-start;
min-height: auto;
margin: 0 !important;
padding: 0;
border: 0;
background: transparent;
}
.netcare-login-ready .main-content-card form h2 {
margin: 0 !important;
color: var(--nc-login-text) !important;
font-size: clamp(1.8rem,2.4vw,2.25rem) !important;
font-weight: 620 !important;
letter-spacing: -.035em !important;
}
.netcare-login-caption {
margin: .55rem 0 2rem;
color: var(--nc-login-dim);
font-size: .78rem;
line-height: 1.55;
}
.netcare-login-ready .rich_text_container { margin: 0 0 .65rem; text-align: left !important; }
.netcare-login-ready .rich_text_container p {
margin: 0;
color: var(--nc-login-accent) !important;
font-size: .62rem;
font-weight: 700;
letter-spacing: .15em;
text-transform: uppercase;
}
.netcare-login-ready .form-label,.netcare-login-ready .form-check-label {
color: #aaa2b3;
font-size: .73rem;
font-weight: 550;
}
.netcare-login-ready .form-control,
.netcare-login-ready .form-select,
.netcare-login-ready .select2-selection {
min-height: 3.25rem;
border: 1px solid var(--nc-login-line) !important;
border-radius: 10px !important;
color: var(--nc-login-text) !important;
background-color: var(--nc-login-field) !important;
box-shadow: inset 0 1px rgba(255,255,255,.018) !important;
transition: border-color .16s ease,box-shadow .16s ease,background-color .16s ease;
}
.netcare-login-ready .form-control:hover,
.netcare-login-ready .form-select:hover,
.netcare-login-ready .select2-selection:hover {
border-color: rgba(169,140,243,.27) !important;
background-color: #0f0c12 !important;
}
.netcare-login-ready .form-control:focus,
.netcare-login-ready .form-select:focus,
.netcare-login-ready .select2-container--focus .select2-selection {
border-color: var(--nc-login-brand) !important;
background-color: #0f0c12 !important;
box-shadow: 0 0 0 3px rgba(115,72,232,.16),inset 0 1px rgba(255,255,255,.025) !important;
}
.netcare-login-ready .form-control:-webkit-autofill,
.netcare-login-ready .form-control:-webkit-autofill:hover,
.netcare-login-ready .form-control:-webkit-autofill:focus {
-webkit-text-fill-color: var(--nc-login-text) !important;
box-shadow: 0 0 0 1000px var(--nc-login-field) inset !important;
caret-color: var(--nc-login-text);
}
.netcare-login-ready .select2-selection__rendered { color: var(--nc-login-text) !important; line-height: 3.1rem !important; }
.netcare-login-ready .select2-selection__arrow { height: 3.1rem !important; }
.netcare-login-ready .form-check { min-height: 1.35rem; }
.netcare-login-ready .form-check-input {
border-color: rgba(255,255,255,.18);
background-color: var(--nc-login-field);
}
.netcare-login-ready .form-check-input:checked {
border-color: var(--nc-login-brand);
background-color: var(--nc-login-brand);
}
.netcare-login-ready .netcare-login-privacidade {
margin-top: .8rem;
padding-top: 1rem;
border-top: 1px solid var(--nc-login-line);
}
.netcare-login-ready .netcare-login-privacidade .form-hint {
padding-left: 1.65rem;
color: var(--nc-login-dim);
font-size: .65rem;
line-height: 1.45;
}
.netcare-login-ready .netcare-lgpd-link {
color: var(--nc-login-brand-lit);
text-decoration-color: rgba(169,140,243,.45);
}
.netcare-login-ready .btn-primary {
min-height: 3.2rem;
margin-top: .35rem;
border: 1px solid rgba(255,255,255,.08) !important;
border-radius: 10px;
color: #fff !important;
background: linear-gradient(135deg,#774be9,#5d32c9) !important;
box-shadow: 0 12px 28px -14px rgba(115,72,232,.9),inset 0 1px rgba(255,255,255,.17);
font-weight: 650;
transition: transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.netcare-login-ready .btn-primary:hover {
filter: brightness(1.08);
transform: translateY(-1px);
box-shadow: 0 16px 32px -14px rgba(115,72,232,.95),inset 0 1px rgba(255,255,255,.19);
}
.netcare-login-ready .btn-primary:active { transform: translateY(0); }
.netcare-password-field { position: relative; }
.netcare-password-field .form-control { padding-right: 3.2rem; }
.netcare-password-toggle {
position: absolute;
right: .75rem;
bottom: .66rem;
display: grid;
width: 2rem;
height: 2rem;
place-items: center;
border: 0;
border-radius: 7px;
color: #756d7b;
background: transparent;
}
.netcare-password-toggle:hover,.netcare-password-toggle[aria-pressed="true"] { color: var(--nc-login-brand-lit); background: rgba(115,72,232,.1); }
.netcare-password-toggle svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 1.7; }
.netcare-login-ready .container-tight > .text-center.text-muted {
margin: .85rem 0 0;
display: block;
color: #77707d !important;
font-size: .64rem;
letter-spacing: .02em;
}
.netcare-login-ready .copyright::after { color: #6c6471 !important; }
.netcare-login-ready select { color-scheme: dark; }
.netcare-login-ready select option { color: var(--nc-login-text); background: var(--nc-login-panel); }
@media (max-width: 980px) {
.netcare-login-ready .main-content-card.netcare-login-panel { grid-template-columns: minmax(0,1fr) minmax(380px,.9fr); }
.netcare-login-story { padding: 2.5rem; }
.netcare-story-copy h1 { font-size: clamp(2.4rem,5vw,3.4rem); }
}
@media (max-width: 820px) {
.netcare-login-ready .page-anonymous > .flex-fill { padding: 0 !important; }
.netcare-login-ready .main-content-card.netcare-login-panel {
display: block;
min-height: 100dvh;
border: 0;
border-radius: 0;
}
.netcare-login-story { display: none; }
.netcare-login-ready .main-content-card.netcare-login-panel > .card-body {
min-height: 100dvh;
align-items: flex-start;
padding: 2rem 1.4rem 3rem;
}
.netcare-login-access { flex-direction: column; }
.netcare-login-mobile-brand {
display: flex;
width: min(390px,100%);
align-items: center;
gap: .85rem;
margin: .4rem auto 4rem;
}
.netcare-login-mobile-brand img { width: 164px; height: auto; }
.netcare-login-mobile-brand span {
padding-left: .85rem;
border-left: 1px solid rgba(255,255,255,.13);
color: var(--nc-login-accent);
font-size: .59rem;
font-weight: 700;
letter-spacing: .18em;
text-transform: uppercase;
}
.netcare-login-ready .container-tight > .text-center.text-muted { display: none; }
}
@media (max-width: 420px) {
.netcare-login-ready .main-content-card.netcare-login-panel > .card-body { padding-inline: 1.1rem; }
.netcare-login-mobile-brand { margin-bottom: 3.2rem; }
.netcare-login-ready .main-content-card form h2 { font-size: 1.75rem !important; }
}
@media (prefers-reduced-motion: reduce) {
.netcare-story-features > div,.netcare-login-ready .btn-primary { transition: none; }
.netcare-story-features > div:hover,.netcare-login-ready .btn-primary:hover { transform: none; }
}