/* Padrão EJ: tokens e componentes compartilhados por todas as telas. */
:root {
    color-scheme: light;
    --ej-background: #d9ecdf;
    --ej-surface: #f1f8f3;
    --ej-text: #203e2e;
    --ej-muted: #526c5d;
    --ej-primary: #39745d;
    --ej-primary-hover: #bfddcb;
    --ej-hover-surface: #e2f0e7;
    --ej-scrollbar-thumb: rgba(57, 116, 93, .35);
    --ej-scrollbar-hover: rgba(57, 116, 93, .55);
    --ej-border: rgba(45, 96, 77, .18);
    --ej-glass: rgba(255, 255, 255, .72);
    --ej-shadow: 0 20px 50px rgba(38, 78, 53, .14);
    --ej-gradient: radial-gradient(circle at 20% 20%, rgba(88, 152, 117, .25), transparent 35%),
        radial-gradient(circle at 80% 30%, rgba(131, 185, 154, .20), transparent 35%),
        radial-gradient(circle at 50% 80%, rgba(88, 152, 117, .20), transparent 40%),
        linear-gradient(135deg, #c9e4d1, #e4f1e8, #bcdcc8);
}

[hidden], [x-cloak] { display: none !important; }
body { overflow-x: hidden; }
/* Rolagem discreta na página, no menu e nas áreas internas. */
:root, .ej-app, .ej-auth, .ej-app *, .ej-auth * {
    scrollbar-width: thin;
    scrollbar-color: var(--ej-scrollbar-thumb) transparent;
}
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--ej-scrollbar-thumb); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: var(--ej-scrollbar-hover); }
::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
::-webkit-scrollbar-corner { background: transparent; }
.ej-auth, .ej-app { background: var(--ej-background); color: var(--ej-text); }
.ej-app { height: 100vh; height: 100dvh; overflow: hidden; }
.ej-shell { height: 100%; min-height: 0; overflow: hidden; }
.bg-animated { position: fixed; inset: 0; background: var(--ej-gradient); pointer-events: none; }
.login-page { min-height: 100vh; min-height: 100dvh; padding: 24px 16px; }
.glass { background: var(--ej-glass); backdrop-filter: blur(20px); border: 1px solid var(--ej-border); box-shadow: var(--ej-shadow); }
.input-custom { background: var(--ej-glass); border: 1px solid var(--ej-border); color: var(--ej-text); }
.input-custom::placeholder { color: var(--ej-muted); }
.input-custom:focus { border-color: var(--ej-primary); box-shadow: 0 0 20px rgba(88, 152, 117, .4); }
.logo-prefeitura { width: 190px; max-width: 100%; height: auto; object-fit: contain; margin: 0 auto; }
.menu-bg { --ej-scrollbar-thumb: rgba(220, 238, 227, .40); --ej-scrollbar-hover: rgba(220, 238, 227, .65); background: rgba(57, 116, 93, .96); backdrop-filter: blur(20px); border-right: 1px solid var(--ej-border); }
.ej-menu-footer, .ej-menu-controls { background: transparent; padding: 4px 12px; border: 0; }
.ej-sidebar {
    box-sizing: border-box;
    height: 100%;
    height: 100dvh;
    min-height: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
.ej-menu-scroll { flex: 1 1 0%; min-height: 0; overscroll-behavior-y: contain; }
.ej-sidebar > :is(.ej-menu-footer, .ej-menu-controls) { flex: 0 0 auto; }
.ej-logout-button, .ej-toggle-button { padding: 4px 12px; min-height: 32px; background: rgba(255, 255, 255, .18); }
.menu-bg a, .menu-bg button { transition: background-color .2s, color .2s; }
.menu-bg a:hover, .menu-bg button:hover { background: rgba(255, 255, 255, .14); }
.ej-menu-scroll a[aria-current="page"] { background: rgba(255, 255, 255, .13); }
.ej-menu-scroll a[aria-current="page"]:hover { background: rgba(255, 255, 255, .20); }
.menu-bg :is(.ej-logout-button, .ej-toggle-button):is(:hover, :focus-visible) { background: rgba(255, 255, 255, .30); }
.ej-content { box-sizing: border-box; min-width: 0; min-height: 0; height: 100%; position: relative; display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; overscroll-behavior-y: contain; }
.ej-page-content { flex: 0 0 auto; min-width: 0; width: 100%; max-width: 72rem; margin-inline: auto; }
.ej-content-expanded .ej-page-content { max-width: none; }
.ej-page-content > :is(.max-w-2xl, .max-w-3xl, .max-w-6xl) { width: 100%; max-width: none; }
.ej-page-content > div:is(.p-4, .p-6):not(.bg-white) { padding: 0; }
.ej-content .bg-white { background: var(--ej-glass); border-color: var(--ej-border); backdrop-filter: blur(20px); }
.ej-content :is(.bg-gray-50, .bg-gray-100, .bg-slate-50, .bg-slate-100) { background: rgba(220, 238, 227, .80); }
.ej-content :is(.bg-gray-200, .bg-slate-200) { background: #e4ece7; }
.ej-content :is(.text-gray-900, .text-gray-800, .text-gray-700, .text-slate-900, .text-slate-800, .text-slate-700, .text-black) { color: var(--ej-text); }
.ej-content :is(.text-gray-600, .text-gray-500, .text-gray-400, .text-slate-600, .text-slate-500) { color: var(--ej-muted); }
.ej-content :is(.text-blue-600, .text-blue-700, .text-blue-800) { color: #39745d; }
.ej-content :is(.bg-blue-50, .bg-blue-100) { background: #dceee3; }
.ej-content :is(.bg-green-50, .bg-green-100) { background: #dcf3e4; }
.ej-content :is(.text-green-600, .text-green-700, .text-green-800) { color: #24633d; }
.ej-content :is(.bg-red-50, .bg-red-100) { background: #fde7e7; }
.ej-content :is(.text-red-600, .text-red-700, .text-red-800) { color: #9b3434; }
.ej-content :is(.bg-yellow-50, .bg-yellow-100) { background: #fff3cc; }
.ej-content :is(.text-yellow-600, .text-yellow-800) { color: #785b13; }
.ej-content .bg-orange-100 { background: #ffead8; }
.ej-content .text-orange-800 { color: #8b4a17; }
.ej-content .bg-indigo-100 { background: #e7eafe; }
.ej-content .text-indigo-800 { color: #414993; }
.ej-content .bg-purple-100 { background: #f0e6fa; }
.ej-content :is(.text-purple-700, .text-purple-800) { color: #704094; }
.ej-content .bg-cyan-100 { background: #dff3f7; }
.ej-content .text-cyan-800 { color: #236879; }
.ej-content :is(.border, .border-t, .border-b, .border-gray-200, .border-gray-300, .divide-y > * + *) { border-color: var(--ej-border); }
.ej-content :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea) {
    background: rgba(246, 251, 247, .95); color: var(--ej-text); border-color: var(--ej-border); border-radius: .75rem;
}
.ej-content :is(input, textarea)::placeholder { color: var(--ej-muted); }
.ej-content :is(input, select, textarea):focus-visible { outline: 2px solid #a7d5bb; outline-offset: 2px; }
.ej-content select option { background: var(--ej-surface); color: var(--ej-text); }
.ej-content :is(.hover\:bg-gray-50, .hover\:bg-gray-100, .hover\:bg-gray-200, .hover\:bg-gray-300, .hover\:bg-gray-400, .hover\:bg-blue-50):hover { background: var(--ej-hover-surface); }
.ej-content :is(.bg-blue-600, .bg-blue-700) { background: var(--ej-primary); color: white; }
:is(.ej-auth, .ej-content) :is(.hover\:bg-blue-700, .hover\:bg-blue-800):hover { background: var(--ej-primary-hover); color: var(--ej-text); }
.ej-content :is(.rounded, .rounded-md, .rounded-lg) { border-radius: .75rem; }
.ej-footer { margin-top: auto; flex-shrink: 0; padding: 24px 0 0; text-align: center; font-size: .75rem; color: var(--ej-muted); }
.ej-hidden { display: none; }
.ej-seguranca-login form button,
.ej-seguranca-login .ej-usuarios-filtros-acoes > a {
    width: auto;
    justify-self: start;
    padding: .5rem .875rem;
    font-size: .875rem;
    line-height: 1.25rem;
    white-space: nowrap;
}
.ej-seguranca-login form[method="get" i].ej-usuarios-filtros { display: flex; flex-wrap: wrap; }
.ej-seguranca-login form[method="get" i] > input { flex: 1 1 15rem; width: auto; }
.ej-seguranca-login .ej-usuarios-filtros-acoes { flex: 0 0 auto; flex-wrap: wrap; }
.ej-seguranca-login .ej-usuarios-filtros-acoes > :is(button, a) { flex: 0 0 auto; }
.ej-autenticador-qr { display: flex; justify-content: center; background: #fff; border-radius: .75rem; margin-bottom: 1rem; padding: .75rem; }
.ej-autenticador-qr svg { width: 220px; max-width: 100%; height: auto; }
.ej-chave-autenticador { display: block; overflow-wrap: anywhere; padding: .5rem; background: var(--ej-surface); }
.ej-content input[type="file"][data-limite-anexo] {
    min-width: 0;
    max-width: 100%;
    cursor: pointer;
}
.ej-content input[type="file"][data-limite-anexo]::file-selector-button {
    margin-right: .75rem;
    padding: .55rem 1rem;
    border: 1px solid transparent;
    border-radius: .75rem;
    background: var(--ej-primary);
    color: #fff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}
.ej-content input[type="file"][data-limite-anexo]::file-selector-button:hover {
    background: var(--ej-primary-hover);
    color: var(--ej-text);
}
.ej-usuarios-filtros {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
    gap: .75rem;
    align-items: center;
}
.ej-usuarios-filtros > :is(input, select) { width: 100%; min-width: 0; max-width: 100%; }
.ej-usuarios-filtros > div { min-width: 0; }
.ej-usuarios-filtros > div > :is(input, select) { width: 100%; min-width: 0; max-width: 100%; }
.ej-usuarios-filtros-acoes { display: flex; gap: .5rem; min-width: 0; }
.ej-usuarios-filtros-acoes > :is(button, a) { flex: 1; text-align: center; }
.ej-usuarios-resumo { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.ej-usuarios-resumo > [role="status"] { flex: 1 1 15rem; }
.ej-usuarios-pdf { position: relative; }
.ej-usuarios-pdf summary { list-style: none; cursor: pointer; border-radius: .75rem; padding: .65rem 1.2rem; background: var(--ej-primary); color: white; font-weight: 600; }
.ej-usuarios-pdf summary::-webkit-details-marker { display: none; }
.ej-usuarios-pdf summary:hover { background: var(--ej-primary-hover); color: var(--ej-text); }
.ej-usuarios-pdf summary:focus-visible { outline: 2px solid var(--ej-primary); outline-offset: 3px; }
.ej-usuarios-pdf-opcoes { position: absolute; right: 0; top: calc(100% + .4rem); width: 11rem; z-index: 20; padding: .4rem; border: 1px solid var(--ej-border); border-radius: .75rem; background: var(--ej-surface); box-shadow: 0 8px 24px #203e2e24; }
.ej-usuarios-pdf-opcoes a { display: block; padding: .65rem; border-radius: .5rem; color: var(--ej-text); }
.ej-usuarios-pdf-opcoes a:hover { background: var(--ej-hover-surface); }
.ej-auditoria-filtros { min-width: 0; max-width: 100%; }
.ej-auditoria-filtros .ej-usuarios-filtros {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
}
.ej-auditoria-filtros .ej-usuarios-filtros-acoes { flex-wrap: wrap; }
.ej-auditoria-filtros .ej-usuarios-filtros-acoes > :is(button, a) { flex: 0 0 auto; }
.ej-auditoria-filtros input[type="date"] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}
.ej-auditoria-filtros input[type="date"]::-webkit-datetime-edit { min-width: 0; padding: 0; }
.ej-upload-status { color: var(--ej-primary); font-size: .875rem; }
.ej-upload-status progress { display: block; width: 100%; height: .5rem; margin-top: .5rem; accent-color: var(--ej-primary); }
.ej-content form[aria-busy="true"] button:disabled { opacity: .65; cursor: wait; }
.ej-content button[onclick="fecharObservacao()"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    padding: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--ej-muted);
    font-size: 0;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}
.ej-content button[onclick="fecharObservacao()"]::before {
    content: "";
    width: .75rem;
    height: .75rem;
    background: currentColor;
    clip-path: polygon(10% 0, 50% 40%, 90% 0, 100% 10%, 60% 50%, 100% 90%, 90% 100%, 50% 60%, 10% 100%, 0 90%, 40% 50%, 0 10%);
}
.ej-content button[onclick="fecharObservacao()"]:is(:hover, :focus-visible) {
    background: var(--ej-hover-surface);
    color: var(--ej-text);
}
.ej-content button[onclick="fecharObservacao()"]:focus-visible {
    outline: 2px solid #a7d5bb;
    outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Contraste das telas de acesso sobre o verde claro. */
.ej-auth :is(h1.text-white, .text-slate-200, .text-slate-300) { color: var(--ej-text); }
.ej-auth .text-slate-400 { color: var(--ej-muted); }
.ej-auth .text-blue-300 { color: var(--ej-primary); }
.ej-auth a:hover { color: var(--ej-text); }
.ej-auth .text-red-100 { color: #8b3131; }
.ej-auth .text-green-100 { color: #24583f; }
.ej-auth .border-white\/10 { border-color: var(--ej-border); }

/* Ações dos filtros: mesmo efeito em todas as listagens. */
.ej-content form[method="get" i] :is(button, a):is(.bg-blue-600, .bg-blue-700, .bg-gray-100, .bg-gray-200, .bg-gray-300, .bg-slate-200) {
    transition: background-color .15s ease, color .15s ease;
}
.ej-content form[method="get" i] :is(button, a):is(.bg-blue-600, .bg-blue-700):not(:disabled):is(:hover, :focus-visible) {
    background: var(--ej-primary-hover);
    color: var(--ej-text);
}
.ej-content form[method="get" i] :is(button, a):is(.bg-gray-100, .bg-gray-200, .bg-gray-300, .bg-slate-200):not(:disabled):is(:hover, :focus-visible) {
    background: var(--ej-hover-surface);
    color: var(--ej-text);
}
