/* =====================================================
   CONTROL ID — PROTÓTIPO VISUAL
   Edite as cores e dimensões aqui no :root.
   ===================================================== */
:root {
  --sidebar-width: 250px;
  --sidebar-bg: #1d1c2d;
  --sidebar-muted: #9aa0c1;
  --sidebar-icon: #555579;
  --page-bg: #eef0f9;
  --card-bg: #fff;
  --text: #303954;
  --muted: #8188a4;
  --blue: #3291ff;
  --border: #e8eaf2;
  --radius: 11px;
  --shadow: 0 3px 6px rgba(34, 42, 78, .035);
}

* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; font-family: "Poppins", "Segoe UI", Arial, sans-serif; color: var(--text); font-size: 14px; -webkit-font-smoothing: antialiased; }
button { font: inherit; }
button, [role="button"] { -webkit-tap-highlight-color: transparent; }
button:focus-visible, [tabindex="0"]:focus-visible { outline: 3px solid #65a9ff; outline-offset: 3px; }
[hidden] { display: none !important; }
.svg-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.icon-fill { fill: currentColor; stroke: none; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar-width) minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; width: var(--sidebar-width); height: 100vh; background: var(--sidebar-bg); color: #fff; z-index: 30; display: flex; flex-direction: column; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #474760 transparent; }
.sidebar-brand { display: flex; align-items: center; justify-content: center; position: relative; height: 63px; min-height: 63px; font-size: 20px; letter-spacing: -.65px; font-weight: 400; }
.sidebar-brand strong { color: #ed2451; font-weight: 750; letter-spacing: -.85px; }
.sidebar-close { display: none; background: none; border: 0; color: #fff; cursor: pointer; }
.sidebar-nav { display: flex; flex-direction: column; margin-top: 0; padding-bottom: 24px; }
.nav-item { width: 100%; height: 43px; padding: 0 20px; display: flex; align-items: center; gap: 15px; border: 0; border-left: 3px solid transparent; background: transparent; color: #aaaed0; text-align: left; cursor: pointer; font-size: 13px; transition: background .16s ease, color .16s ease; white-space: nowrap; }
.nav-item .icon { width: 18px; height: 18px; color: var(--sidebar-icon); stroke-width: 2; transition: color .16s ease; }
.nav-item:first-child .icon { fill: currentColor; stroke-width: 0; }
.nav-item:hover, .nav-item:focus-visible { background: #252538; color: #fff; }
.nav-item:hover .icon { color: #77aaf5; }
.nav-item.is-active { background: #1a1a2a; color: #fff; font-weight: 600; }
.nav-item.is-active .icon { color: var(--blue); }
.sidebar-bottom { margin-top: auto; border-top: 1px solid #44465b; padding: 23px 19px 24px; color: #aaaec6; font-size: 11px; line-height: 1.55; }
.sidebar-bottom small { display: block; margin-left: 17px; opacity: .65; font-size: 10px; }
.bottom-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #2ac6a0; margin-right: 5px; }

.app-content { min-width: 0; background: var(--page-bg); }
.topbar { height: 63px; width: 100%; display: flex; justify-content: space-between; align-items: center; background: #fff; border-bottom: 1px solid #eeeef3; padding: 0 26px 0 30px; }
.topbar-left, .topbar-right { display: flex; align-items: center; }
.topbar-right { gap: 16px; }
.breadcrumb { color: #697187; font-size: 13px; font-weight: 500; display: flex; gap: 10px; align-items: center; }
.breadcrumb-dot { font-size: 13px; color: #242b42; }
.flag { font-size: 21px; line-height: 1; }
.profile { display: flex; align-items: center; gap: 12px; background: none; border: none; padding: 0; font-size: 13px; color: #b5b6c4; font-weight: 600; cursor: pointer; }
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 6px; background: #c9f5f4; color: #15aaa7; font-size: 15px; font-weight: 600; }
.guide-button { display: inline-flex; gap: 7px; align-items: center; padding: 8px 12px; border: 1px solid #dfe7f3; background: #f7faff; color: #63728c; border-radius: 7px; cursor: pointer; font-size: 12px; font-weight: 600; transition: background .15s, border-color .15s; }
.guide-button .icon { width: 16px; height: 16px; }
.guide-button:hover { background: #e9f2ff; border-color: #bbd8ff; color: #307acc; }
.mobile-menu-button { display: none; cursor: pointer; background: transparent; border: 0; color: #303954; margin: 0 12px 0 -7px; padding: 5px; }

.page-body { padding: 29px clamp(20px, 2.4vw, 43px) 35px; min-height: calc(100vh - 63px); }
.dashboard-layout { display: grid; grid-template-columns: minmax(0, 2.95fr) minmax(285px, 1fr); gap: 24px; align-items: stretch; }
.dashboard-main { min-width: 0; display: flex; flex-direction: column; gap: 36px; }
.surface { background: var(--card-bg); border-radius: var(--radius); box-shadow: var(--shadow); }
.statistics-panel { min-width: 0; padding: 14px 37px 23px; min-height: 208px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; min-width: 0; gap: 12px; }
.section-heading h1, .section-heading h2 { margin: 0; font-size: 20px; line-height: 1.45; font-weight: 650; color: var(--text); letter-spacing: -.4px; }
.section-heading h2 { font-size: 19px; }
.heading-help { cursor: help; color: #aebbd0; display: flex; padding: 6px; border-radius: 50%; transition: color .16s, background .16s; }
.heading-help:hover { color: var(--blue); background: #eef5ff; }
.heading-help .icon { width: 18px; height: 18px; }
.heading-icon { width: 18px; height: 18px; fill: none; stroke: #bac6d8; stroke-width: 1.8; opacity: .65; flex: 0 0 auto; }
.stat-grid { margin-top: 23px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 2.1vw, 32px); }
.stat-card { min-height: 121px; padding: 22px 16px 17px; border-radius: 12px; cursor: help; transition: transform .18s ease, box-shadow .18s ease; }
.stat-card:hover, .chart-panel:hover, .recent-panel:hover { box-shadow: 0 6px 18px rgba(30, 42, 78, .08); }
.stat-card:hover { transform: translateY(-2px); }
.stat-main { display: flex; align-items: center; justify-content: space-between; }
.stat-main strong { font-size: 23px; line-height: 1.1; font-weight: 500; }
.stat-icon { width: 32px; height: 32px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.stat-footer { display: flex; align-items: center; justify-content: space-between; min-width: 0; margin-top: 15px; gap: 3px; }
.stat-footer span { font-weight: 500; font-size: 13px; line-height: 1.4; white-space: nowrap; }
.tiny-info { width: 13px; height: 13px; flex: 0 0 13px; stroke: currentColor; stroke-width: 1.7; fill: none; opacity: 0; transition: opacity .16s; }
.stat-card:hover .tiny-info, .stat-card:focus-visible .tiny-info { opacity: .7; }
.stat-users { background: #fff3dc; color: #ffa600; }
.stat-faces { background: #caf6f5; color: #12bdbb; }
.stat-schedules { background: #ffe3e7; color: #ff5365; }
.stat-accesses { background: #e1efff; color: #3195ff; }
.chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.chart-panel { min-width: 0; height: clamp(390px, 52vh, 440px); padding: 15px 19px; cursor: help; transition: box-shadow .18s; }
.empty-data { padding-top: 50px; color: #7f879f; font-size: 13px; font-weight: 400; }
.recent-panel { min-width: 0; padding: 15px 19px; min-height: 684px; cursor: help; transition: box-shadow .18s; }
.recent-panel .empty-data { padding-top: 34px; }
.demo-note { margin: 24px 0 0; display: flex; align-items: center; gap: 7px; color: #9298ae; font-size: 11px; }
.demo-note .icon { width: 14px; height: 14px; }

/* Outras páginas abertas pelo menu */
.feature-view { max-width: 1300px; }
.back-link { display: inline-flex; gap: 7px; align-items: center; border: none; padding: 6px 0; background: none; color: #637ba1; cursor: pointer; font-size: 12px; margin: 0 0 18px; }
.back-link:hover { color: var(--blue); }
.back-link .icon { width: 16px; height: 16px; }
.feature-intro { padding: 30px 33px; }
.feature-heading-row { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.feature-eyebrow { color: #7293bd; font-size: 11px; font-weight: 700; letter-spacing: 1px; }
.eyebrow-dot { padding: 0 5px; }
.feature-intro h1 { font-size: clamp(24px, 3vw, 33px); letter-spacing: -.6px; margin: 13px 0 8px; }
.feature-intro p { max-width: 700px; line-height: 1.7; color: #7d869e; margin: 0; }
.feature-badge { display: inline-flex; gap: 7px; align-items: center; border-radius: 999px; white-space: nowrap; padding: 9px 12px; background: #e9f7f7; color: #169c9b; font-size: 11px; font-weight: 600; }
.feature-badge .icon { width: 15px; height: 15px; }
.feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 24px 0; }
.feature-panel { min-height: 220px; padding: 23px 27px; cursor: help; }
.feature-list { list-style: none; padding: 0; margin: 21px 0 0; display: grid; gap: 14px; }
.feature-list li { display: flex; align-items: flex-start; gap: 10px; line-height: 1.55; color: #69738e; }
.feature-list li::before { content: '✓'; background: #dff6ee; color: #18a579; border-radius: 50%; height: 20px; width: 20px; display: grid; place-items: center; flex: 0 0 20px; font-size: 12px; font-weight: 700; }
.client-explanation { background: #f8fbff; }
.client-explanation blockquote { margin: 23px 0 0; color: #526888; font-size: 16px; font-weight: 500; line-height: 1.9; position: relative; padding-left: 17px; border-left: 3px solid #66abff; }
.feature-workspace { padding: 25px 28px 30px; }
.workspace-header { display: flex; gap: 15px; justify-content: space-between; align-items: flex-start; }
.workspace-header h2 { margin: 0; font-size: 19px; }
.workspace-header p { color: #8b92a6; line-height: 1.6; margin: 8px 0 0; }
.workspace-status { white-space: nowrap; border-radius: 20px; padding: 7px 12px; background: #fff6e4; color: #b8872b; font-size: 11px; }
.workspace-status span { display: inline-block; width: 7px; height: 7px; margin-right: 5px; background: #eab258; border-radius: 50%; }
.workspace-preview { margin-top: 25px; padding: 43px 20px; background: #f9fafe; border: 1px dashed #dbe3f0; border-radius: 10px; text-align: center; }
.workspace-icon { height: 35px; width: 35px; fill: none; stroke: #aac1df; stroke-width: 1.5; }
.workspace-preview h3 { font-size: 17px; font-weight: 600; margin: 12px 0 8px; }
.workspace-preview p { color: #8992a8; margin: 0 auto 21px; max-width: 490px; line-height: 1.65; }
.outline-button, .primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; padding: 10px 14px; font-size: 12px; font-weight: 600; border-radius: 8px; }
.outline-button { border: 1px solid #ccdcf2; color: #3d89d9; background: #fff; }
.outline-button:hover { background: #edf6ff; }
.outline-button .icon { width: 15px; height: 15px; }
.primary-button { color: white; border: 1px solid #388ee8; background: #398fed; }
.primary-button:hover { background: #2179da; }

/* Balão de ajuda posicionado pelo JavaScript */
.help-tooltip { position: fixed; left: 0; top: 0; width: min(346px, calc(100vw - 24px)); padding: 18px 19px 17px; background: #222437; color: #fff; border: 1px solid #3e435b; border-radius: 11px; box-shadow: 0 16px 42px rgba(18, 21, 41, .28); z-index: 70; pointer-events: none; opacity: 0; transform: translateY(4px); transition: opacity .12s ease, transform .12s ease; }
.help-tooltip.is-visible { opacity: 1; transform: translateY(0); }
.tooltip-kicker { display: flex; gap: 6px; align-items: center; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .9px; color: #8dbef8; margin-bottom: 11px; }
.tooltip-kicker .icon { width: 15px; height: 15px; }
.tooltip-title { display: block; font-size: 16px; line-height: 1.4; }
.tooltip-description, .tooltip-pitch { color: #d3d7e9; font-size: 12px; line-height: 1.65; margin: 7px 0 0; }
.tooltip-divider { border-top: 1px solid #45495c; margin: 14px 0 12px; }
.tooltip-label { color: #8fdecf; display: block; font-size: 11px; }
.tooltip-pitch { font-style: italic; color: #f1f1f7; }
.tooltip-mobile-hint { display: none; margin-top: 13px; color: #a9b4cd; font-size: 10px; }

/* Guia de apresentação */
.modal-overlay { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; overflow-y: auto; padding: 18px; background: rgba(15, 18, 33, .66); backdrop-filter: blur(4px); }
.guide-dialog { width: min(610px, 100%); max-height: min(94vh, 820px); overflow-y: auto; background: white; padding: 27px 32px 30px; box-shadow: 0 26px 80px rgba(0, 0, 0, .25); border-radius: 16px; }
.dialog-header { display: flex; align-items: center; justify-content: space-between; }
.dialog-icon { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #e7f1ff; color: #328ffa; }
.dialog-icon .icon { height: 21px; width: 21px; }
.dialog-close { background: #f4f5f9; border: none; width: 33px; height: 33px; display: grid; place-items: center; color: #687088; border-radius: 50%; cursor: pointer; }
.dialog-close:hover { background: #e8eaf1; }
.dialog-eyebrow { color: #3994e8; font-weight: 800; font-size: 10px; letter-spacing: 1.4px; margin: 20px 0 6px; }
.guide-dialog h2 { font-size: 24px; line-height: 1.28; letter-spacing: -.5px; margin: 0; }
.dialog-intro { color: #7c849b; line-height: 1.7; margin: 11px 0 21px; }
.guide-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.guide-steps li { display: flex; align-items: start; gap: 14px; padding: 15px; border: 1px solid #e9edf4; background: #fbfcff; border-radius: 10px; }
.guide-steps li > span { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #2f96f4; background: #eaf5ff; border-radius: 9px; }
.guide-steps strong { font-size: 13px; }
.guide-steps p { line-height: 1.6; color: #777f96; font-size: 12px; margin: 6px 0 0; }
.dialog-footer { margin-top: 20px; display: flex; gap: 15px; align-items: center; justify-content: space-between; }
.dialog-footer > span { display: flex; align-items: center; gap: 6px; color: #8e96a9; font-size: 11px; }
.dialog-footer .icon { width: 16px; height: 16px; flex: 0 0 auto; }

@media (max-width: 1370px) {
  :root { --sidebar-width: 220px; }
  .nav-item { gap: 11px; padding: 0 15px; }
  .page-body { padding: 25px 22px 30px; }
  .dashboard-layout { grid-template-columns: minmax(0, 2.5fr) minmax(235px, 1fr); gap: 18px; }
  .dashboard-main { gap: 22px; }
  .statistics-panel { padding: 17px 22px 22px; }
  .stat-grid { gap: 13px; }
  .stat-card { padding-left: 12px; padding-right: 12px; }
  .stat-footer span { font-size: 11.5px; }
  .chart-grid { gap: 18px; }
  .chart-panel, .recent-panel { padding: 16px; }
  .section-heading h1, .section-heading h2 { font-size: 18px; }
}
@media (max-width: 1040px) {
  .dashboard-layout { grid-template-columns: 1fr; }
  .recent-panel { min-height: 230px; }
  .recent-panel .empty-data { padding-top: 22px; }
  .chart-panel { height: 320px; }
  .stat-footer span { font-size: 13px; }
}
@media (max-width: 740px) {
  :root { --sidebar-width: 250px; }
  .app-shell { display: block; }
  .sidebar { position: fixed; left: 0; top: 0; transform: translateX(-100%); transition: transform .22s ease; box-shadow: 6px 0 30px rgba(13, 19, 39, .16); }
  .app-shell.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-brand { justify-content: space-between; padding-left: 24px; padding-right: 16px; }
  .sidebar-close { display: flex; }
  .mobile-backdrop:not([hidden]) { position: fixed; inset: 0; z-index: 25; background: rgba(9, 14, 30, .45); }
  .mobile-menu-button { display: flex; }
  .topbar { padding: 0 16px; height: 60px; }
  .topbar-right { gap: 11px; }
  .guide-button { padding: 8px; }
  .guide-button span { display: none; }
  .profile > span:first-child { display: none; }
  .page-body { padding: 18px 14px 26px; min-height: calc(100vh - 60px); }
  .statistics-panel { padding: 18px; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 19px; }
  .stat-card { padding: 18px 14px; }
  .chart-grid { grid-template-columns: 1fr; }
  .chart-panel { height: 280px; }
  .dashboard-main { gap: 18px; }
  .dashboard-layout { gap: 18px; }
  .recent-panel { min-height: 230px; }
  .demo-note { align-items: flex-start; line-height: 1.6; }
  .feature-intro { padding: 23px 20px; }
  .feature-heading-row { flex-direction: column-reverse; }
  .feature-grid { grid-template-columns: 1fr; gap: 16px; margin: 16px 0; }
  .feature-panel { padding: 22px 20px; }
  .feature-workspace { padding: 22px 18px; }
  .workspace-header { flex-direction: column; }
  .workspace-status { white-space: normal; }
  .workspace-preview { padding: 30px 14px; }
  .help-tooltip { pointer-events: none; }
  .tooltip-mobile-hint { display: block; }
  .guide-dialog { padding: 24px 19px; }
  .guide-dialog h2 { font-size: 22px; }
  .dialog-footer { align-items: stretch; flex-direction: column; }
}
@media (max-width: 400px) {
  .stat-footer span { font-size: 11px; }
  .stat-main strong { font-size: 21px; }
  .section-heading h1, .section-heading h2 { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Navegação dos módulos superiores */
.module-tabs { display:flex; gap:8px; align-items:center; overflow-x:auto; background:#fff; padding:12px 30px 0; border-bottom:1px solid var(--border); scrollbar-width:thin; }
.module-tab { flex:0 0 auto; display:inline-flex; gap:10px; align-items:center; min-height:48px; padding:12px 19px; border:0; border-bottom:3px solid transparent; border-radius:9px 9px 0 0; background:transparent; color:#7d849d; font-size:13px; font-weight:700; letter-spacing:.2px; cursor:pointer; transition:background .15s,color .15s; }
.module-tab:hover { color:#2486ef; background:#f4f8ff; }
.module-tab.is-active { color:#2586ec; background:#edf5ff; border-bottom-color:#3291ff; }
.module-live { background:#d8f5eb; color:#11836f; font-size:10px; font-weight:700; padding:4px 8px; border-radius:99px; white-space:nowrap; }
.module-placeholder { padding:48px; min-height:440px; max-width:860px; margin:0 auto; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
.module-placeholder-tag { font-size:11px; font-weight:750; letter-spacing:2px; color:#8793b1; }
.module-placeholder-icon { display:grid; place-items:center; width:78px; height:78px; border-radius:20px; background:#e8f2ff; color:#3291ff; }
.module-placeholder-icon .icon { width:37px; height:37px; }
.module-placeholder h1 { font-size:28px; margin:0; }
.module-placeholder > p { font-size:15px; color:#7b849c; margin:0; line-height:1.7; }
.module-placeholder-note { width:100%; max-width:520px; background:#f6f8fe; border:1px solid #e7eaf3; border-radius:12px; padding:17px 20px; text-align:left; line-height:1.7; }
.module-placeholder-note strong { color:#35425c; }
.module-placeholder-note p { margin:5px 0 0; color:#66718c; }
@media(max-width:740px) { .module-tabs { padding:8px 15px 0; gap:2px; } .module-tab { padding:12px; font-size:12px; } .module-live { display:none; } .module-placeholder { padding:28px 18px; min-height:390px; } }

/* Barra principal do site: acima do menu lateral e de todo o painel */
body > .module-tabs { position: relative; z-index: 35; width: 100%; box-sizing: border-box; min-height: 76px; display: flex; align-items: flex-end; padding: 8px 28px 0; border-bottom: 1px solid #e5e8f1; box-shadow: 0 1px 3px rgba(20, 30, 60, .04); }
body > .module-tabs .module-tab { min-height: 60px; }
.app-shell { min-height: calc(100vh - 76px); }
@media (min-width: 741px) { .sidebar { height: calc(100vh - 76px); } }
@media (max-width: 740px) { body > .module-tabs { min-height: 64px; padding: 5px 10px 0; } body > .module-tabs .module-tab { min-height: 50px; } .app-shell { min-height: calc(100vh - 64px); } }

/* Submenu de Cadastros — referência visual do IDFACE */
.cadastros-submenu {padding:0 0 10px 30px;background:rgba(0,0,0,.045);display:flex;flex-direction:column;}
.cadastros-submenu[hidden]{display:none!important;}
.submenu-item{width:100%;min-height:38px;border:0;background:transparent;color:#9aa3c2;display:flex;align-items:center;text-align:left;gap:11px;padding:8px 11px;font:inherit;font-size:12px;cursor:pointer;}
.submenu-dot{font-size:13px;color:#626c91;}
.submenu-item:hover,.submenu-item.is-active{color:#fff;background:rgba(255,255,255,.025);}
.submenu-item.is-active .submenu-dot{color:#319bff;}
.users-card{overflow:hidden;padding:0;}
.users-toolbar{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:16px 26px;border-bottom:1px solid #edf0f5;flex-wrap:wrap;}
.users-toolbar h1{margin:0;font-size:16px;white-space:nowrap;}
.users-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.users-search{display:flex;height:38px;border:1px solid #dfe4ed;border-radius:5px;overflow:hidden;background:white;}
.users-search select,.users-search input{border:0;background:white;min-width:0;padding:0 12px;color:#596782;}
.users-search select{width:115px;border-right:1px solid #e0e4ec;}
.users-search input{width:135px;}
.users-search button{background:white;color:#52617c;border:0;border-left:1px solid #e0e4ec;width:42px;cursor:pointer;font-size:22px;}
.users-btn{border:0;border-radius:5px;min-height:38px;padding:0 14px;font-size:12px;color:white;cursor:pointer;}
.users-btn.blue{background:#3295ff}.users-btn.red{background:#f44860}.users-btn.gray{background:#e9eaf1;color:#39425e}
.users-table-scroll{overflow-x:auto;padding:18px 24px 0;}
.users-table{border-collapse:collapse;width:100%;min-width:1170px;}
.users-table th{font-size:10px;letter-spacing:1.1px;color:#61708a;line-height:1.65;padding:18px 9px;border-bottom:1px solid #e8ebf1;text-align:center;}
.users-table td{padding:18px 12px;font-size:12px;color:#8490a6;}
.users-table .users-empty{text-align:left;padding-left:20px;}
.users-footer{display:flex;align-items:center;gap:13px;padding:18px 27px 33px;color:#596780;font-size:12px;}
.users-footer select{border:0;background:#f3f5fa;color:#3e4b69;padding:8px 12px;border-radius:4px;}
.users-hint{font-size:12px;color:#8590a5;margin:12px 3px;}
@media(max-width:740px){.users-toolbar{padding:16px;}.users-actions{gap:7px}.users-btn{padding:0 10px}.users-table-scroll{padding:8px 12px 0;}}

/* Controle de dicas no cabeçalho */
.tips-toggle{display:inline-flex;align-items:center;gap:9px;cursor:pointer;white-space:nowrap;color:#62708a;font-size:12px;font-weight:600;user-select:none}
.tips-toggle input{position:absolute;opacity:0;width:1px;height:1px}
.tips-toggle-track{position:relative;width:37px;height:21px;border-radius:20px;background:#b5bfd1;transition:background .16s ease;flex-shrink:0}
.tips-toggle-track:after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:white;box-shadow:0 1px 4px #0002;transition:transform .16s ease}
.tips-toggle input:checked+.tips-toggle-track{background:#278fff}
.tips-toggle input:checked+.tips-toggle-track:after{transform:translateX(16px)}
.tips-toggle input:focus-visible+.tips-toggle-track{outline:3px solid #65a9ff;outline-offset:3px}
@media(max-width:560px){.tips-toggle{gap:6px}.tips-toggle-label{font-size:0}.tips-toggle-label:after{content:"Dicas";font-size:12px}}

/* Dashboard fiel à referência: cartões, gráficos de eventos e linha do tempo */
.dashboard-view .dashboard-layout{grid-template-columns:minmax(0,2.95fr) minmax(315px,1fr);gap:26px}
.dashboard-view .dashboard-main{gap:38px}
.dashboard-view .statistics-panel{padding:13px 38px 24px;min-height:216px}
.dashboard-view .stat-grid{gap:clamp(12px,2vw,34px);margin-top:25px}
.dashboard-view .stat-card{min-height:125px;padding:24px 16px 18px}
.dashboard-view .chart-panel{height:456px;padding:16px 19px}
.dashboard-view .recent-panel{min-height:710px;padding:16px 19px}
.access-chart{position:relative;padding-top:20px;width:100%}
.chart-visual{height:332px;width:100%}
.chart-visual svg{width:100%;height:100%;overflow:visible}
.chart-legend{display:flex;justify-content:center;align-items:center;gap:13px;flex-wrap:wrap;margin-top:8px;font-size:11px;color:#5d5d65}
.chart-legend span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.chart-legend i{display:inline-block;width:18px;height:18px;border:3px solid;border-radius:50%}
.chart-tooltip{position:absolute;top:45%;left:32%;background:#fff;border:1px solid #d9dce4;box-shadow:0 4px 12px #0001;max-width:230px;padding:8px;border-radius:5px;font-size:11px;color:#384154;pointer-events:none;z-index:2}
.recent-timeline{position:relative;margin:40px 0 0 3px;padding:0 0 0 0}
.recent-timeline:before{content:"";position:absolute;left:77px;top:0;bottom:-310px;width:2px;background:#e5e8f0}
.timeline-item{position:relative;display:grid;grid-template-columns:58px 14px 53px minmax(0,1fr);gap:13px;align-items:center;min-height:67px}
.timeline-item time{font-size:11px;color:#26314b}
.timeline-marker{width:13px;height:13px;border:3px solid #87909a;background:#fff;border-radius:50%;z-index:1}
.timeline-marker.granted{border-color:#12c4bc}
.timeline-avatar{width:52px;height:52px;border-radius:50%;border:4px solid #f0f1f3;background:#9a9c9e;display:flex;align-items:center;justify-content:center;overflow:hidden}
.timeline-avatar.identified{background:linear-gradient(155deg,#616f7d,#ae8e7d)}
.timeline-avatar.unknown{background:#a2a5a8}
.avatar-person{position:relative;width:28px;height:32px}
.avatar-person:before{content:"";position:absolute;top:5px;left:10px;width:11px;height:11px;border-radius:50%;background:#565c63}
.avatar-person:after{content:"";position:absolute;bottom:0;left:3px;width:26px;height:16px;border-radius:14px 14px 4px 4px;background:#565c63}
.timeline-avatar.identified .avatar-person:before{background:#caa58b}
.timeline-avatar.identified .avatar-person:after{background:#343d4d}
.timeline-details{display:flex;flex-direction:column;gap:4px;min-width:0}
.timeline-details strong{font-size:13px;color:#26304b;line-height:1.25}
.timeline-details>span{font-size:12px;color:#6d7a97}
@media(max-width:1370px){.dashboard-view .statistics-panel{padding:17px 22px 22px}.dashboard-view .dashboard-layout{gap:18px}.dashboard-view .chart-panel{height:420px}.dashboard-view .recent-panel{min-height:660px}.dashboard-view .dashboard-main{gap:25px}.chart-visual{height:302px}.timeline-item{grid-template-columns:45px 12px 42px minmax(0,1fr);gap:9px}.timeline-avatar{width:42px;height:42px}.recent-timeline:before{left:59px}}
@media(max-width:1040px){.dashboard-view .dashboard-layout{grid-template-columns:1fr}.dashboard-view .recent-panel{min-height:360px}.recent-timeline:before{bottom:0}}
@media(max-width:740px){.dashboard-view .chart-panel{height:390px}.dashboard-view .statistics-panel{padding:18px}.dashboard-view .stat-card{min-height:118px}.dashboard-view .dashboard-main{gap:18px}.chart-visual{height:295px}.chart-legend{gap:9px;font-size:10px}}

/* Cadastros > Usuários — alinhamento com o painel de referência */
.users-view{width:100%;max-width:none}
.users-card{border-radius:6px;overflow:hidden}
.users-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 28px 13px;min-height:67px;flex-wrap:wrap;border-bottom:1px solid #e8ebf3}
.users-toolbar h1{font-size:16px;white-space:nowrap;font-weight:650;color:#202b49}
.users-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.users-search{height:38px;display:flex;align-items:stretch;background:#fff;border:1px solid #dce2ef;border-radius:5px;overflow:hidden}
.users-search select{width:137px;border:0;border-right:1px solid #dfe4ee;padding:0 13px;color:#394765;background:#fff}
.users-search input{width:145px;border:0;padding:0 12px;color:#46526a;background:#fff;font-size:12px;outline:none}
.users-search button{width:47px;border:0;border-left:1px solid #dfe4ee;background:white;color:#465574;display:grid;place-items:center}
.users-search .icon,.users-btn .icon{height:15px;width:15px}
.users-btn{border:0;border-radius:5px;height:38px;padding:0 15px;font-size:12px;font-weight:500;display:inline-flex;gap:7px;align-items:center;justify-content:center;white-space:nowrap}
.users-btn.blue{background:#3695fb;color:#fff}
.users-btn.red{background:#f4495d;color:#fff}
.users-btn.gray{background:#e8eaf1;color:#414b65}
.users-btn:hover{filter:brightness(.97)}
.users-filter-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;row-gap:10px;padding:23px 28px 8px}
.filter-field{display:flex;flex-direction:column;gap:8px;color:#35415d;font-size:13px;font-weight:400}
.filter-field select{height:38px;background:white;border:1px solid #dce2ee;border-radius:5px;color:#3e4b66;padding:0 14px}
.filter-actions{display:flex;align-items:end}
.filter-actions .users-btn{min-width:127px}
.users-table-scroll{padding:17px 28px 0;overflow-x:auto}
.users-table{width:100%;min-width:1420px;border-collapse:collapse;table-layout:auto}
.users-table th{border-bottom:1px solid #e8edf4;color:#61708b;font-size:10px;letter-spacing:1.2px;font-weight:700;text-align:center;line-height:1.6;padding:13px 8px 15px;white-space:nowrap}
.users-table td{border-bottom:1px solid #edf0f5;padding:15px 8px;text-align:center;font-size:12px;color:#35415e;line-height:1.55;height:77px}
.users-table .name-cell{min-width:164px;max-width:200px;line-height:1.5}
.users-table .users-empty{text-align:left;padding-left:16px}
.user-photo{width:44px;height:44px;border-radius:50%;background:linear-gradient(140deg,#b2bac8,#727f94);border:3px solid #e7edf0;display:grid;place-items:center;color:white;font-weight:600;font-size:12px;margin:auto}
.user-photo.photo-2{background:linear-gradient(135deg,#758d9e,#b99b8a)}
.user-photo.photo-3{background:linear-gradient(135deg,#a99285,#665f6f)}
.user-photo.photo-4{background:linear-gradient(135deg,#b5a7a1,#617d98)}
.user-photo.photo-5{background:linear-gradient(135deg,#8a939d,#a48e7b)}
.user-photo.photo-6{background:linear-gradient(135deg,#9fac8c,#6f7895)}
.table-circle{display:inline-block;width:15px;height:15px;border:2px solid #b5b9ca;border-radius:50%}
.table-dot{display:inline-block;width:16px;height:16px;border-radius:50%;background:#398fff}
.user-actions-cell{white-space:nowrap;min-width:85px}
.user-action{width:32px;height:32px;border:0;border-radius:5px;background:#f2f5f9;color:#3b96fa;display:inline-grid;place-items:center;margin-right:6px}
.user-action.delete{color:#f25269}
.user-action .icon{height:16px;width:16px}
.users-footer{padding:15px 28px 25px;display:flex;align-items:center;gap:12px;font-size:12px;color:#60708b}
.users-footer select{border:0;background:#f0f2f7;padding:8px 10px;border-radius:4px;color:#42516f}
.users-hint{margin:13px 4px;font-size:11px;color:#8c96ad}
@media(max-width:1300px){.users-toolbar{gap:12px}.users-actions{gap:8px}.users-toolbar{padding-inline:18px}.users-filter-panel,.users-table-scroll{padding-inline:18px}}
@media(max-width:920px){.users-filter-panel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.users-filter-panel{grid-template-columns:1fr}.users-toolbar,.users-table-scroll,.users-filter-panel{padding-inline:14px}.users-actions{gap:7px}}

/* Modal de cadastro IDFACE */
.user-modal-backdrop{position:fixed;inset:0;z-index:110;background:rgba(0,0,0,.74);display:grid;place-items:center;padding:20px}
.user-modal{width:min(918px,100%);max-height:95vh;overflow:auto;background:#fff;color:#303a56;border-radius:5px;box-shadow:0 18px 50px #0004}
.user-modal-heading{height:54px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8ebf3;padding:0 19px}
.user-modal-heading h2{font-size:15px;font-weight:600;margin:0}.user-modal-heading button{font-size:24px;background:none;border:0;color:#8890a6}
.user-modal-content{padding:20px 19px 30px;min-height:495px}
.user-modal-tabs{display:flex;gap:23px;border-bottom:1px solid #dfe5f0;overflow-x:auto}
.user-modal-tabs button{flex-shrink:0;border:0;border-bottom:2px solid transparent;background:none;padding:10px 0;font-size:11px;color:#757e98}
.user-modal-tabs button.active{border-bottom-color:#3295ff;color:#3295ff}
.user-tab-panel[data-user-panel="general"]{display:grid;grid-template-columns:52% 48%;gap:10px;padding-top:24px}
.user-photo-column{display:flex;flex-direction:column;align-items:center;padding-top:8px}
.user-photo-preview{height:175px;width:175px;border-radius:50%;background:#b6b6b6;display:grid;place-items:center;overflow:hidden}
.user-photo-preview svg{width:120px;height:120px;fill:#818181}.user-photo-preview img{width:100%;height:100%;object-fit:cover}
.user-photo-actions{display:flex;gap:8px;margin-top:25px}.user-photo-actions .users-btn{padding:0 12px;height:33px}
.user-photo-column p{font-size:11px;color:#8790a7;text-align:center;max-width:245px;line-height:1.5}
.user-form-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px 12px;padding-right:70px}
.user-form-fields label,.user-alt-panel label{display:flex;flex-direction:column;gap:6px;font-size:11px;color:#4f5971}
.user-form-fields input:not([type="checkbox"]),.user-alt-panel input:not([type="checkbox"]),.user-alt-panel select{height:33px;border:1px solid #dce2ef;border-radius:5px;background:#fff;padding:0 10px;color:#34415f;font-size:12px;min-width:0;width:100%}
.user-admin-field{align-items:flex-start}.user-switch{appearance:none;height:25px;width:46px;background:#e5e8f0;border-radius:20px;cursor:pointer;position:relative;margin:3px 0}
.user-switch:before{content:"";height:20px;width:20px;background:#fff;position:absolute;top:2px;left:2px;border-radius:50%;transition:left .15s}.user-switch:checked{background:#3795ff}.user-switch:checked:before{left:24px}
.user-alt-panel{padding:28px 24px;min-height:354px}.user-alt-panel h3{font-size:15px}.user-alt-panel label{max-width:320px}.user-alt-panel p{font-size:12px;color:#7c859a}
.user-modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:19px;border-top:1px solid #e8ebf3}
.user-modal-footer .users-btn{height:33px;min-width:87px}.user-form-error{color:#e44353;font-size:12px;margin:12px 0 0}
@media(max-width:720px){.user-tab-panel[data-user-panel="general"]{grid-template-columns:1fr}.user-form-fields{padding-right:0}.user-modal-content{padding:15px}.user-photo-preview{height:128px;width:128px}.user-photo-preview svg{height:95px;width:95px}.user-modal-tabs{gap:15px}}

/* Layout fixo: barra global e menu lateral sem faixa inferior */
:root{--global-nav-height:76px}
body{padding-top:var(--global-nav-height);min-width:320px}
body>.module-tabs{position:fixed;top:0;left:0;right:0;z-index:80;height:var(--global-nav-height);min-height:0;box-sizing:border-box;display:flex;align-items:stretch;gap:12px;justify-content:space-between;padding:0 25px 0 28px;overflow:visible;background:#fff;border-bottom:1px solid #e5e8f1}
.module-tab-list{display:flex;align-items:flex-end;min-width:0;flex:1 1 auto;gap:8px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;overscroll-behavior-inline:contain}
body>.module-tabs .module-tab{flex:0 0 auto;min-height:54px;align-self:flex-end}
body>.module-tabs .tips-toggle{flex:0 0 auto;align-self:center;padding:9px 5px;margin-left:auto;z-index:1}
.app-shell{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);min-height:calc(100vh - var(--global-nav-height));min-height:calc(100dvh - var(--global-nav-height))}
.sidebar{position:fixed;top:var(--global-nav-height);left:0;bottom:0;width:var(--sidebar-width);height:auto!important;min-height:0;z-index:50;background:var(--sidebar-bg);overflow-y:auto;overflow-x:hidden}
.app-content{grid-column:2;min-width:0}
.page-body{min-height:calc(100vh - var(--global-nav-height) - 63px)}
@media(max-width:740px){
  :root{--global-nav-height:65px}
  body>.module-tabs{height:var(--global-nav-height);padding:0 10px;gap:6px}
  body>.module-tabs .module-tab{min-height:49px;padding:10px 12px}
  body>.module-tabs .tips-toggle{margin-left:0;padding:7px 4px}
  body>.module-tabs .tips-toggle-label{font-size:0}
  body>.module-tabs .tips-toggle-label::after{content:"Dicas";font-size:11px}
  .app-shell{display:block;min-height:calc(100dvh - var(--global-nav-height))}
  .app-content{width:100%;grid-column:auto}
  .sidebar{top:var(--global-nav-height);bottom:0;left:0;height:auto!important;max-height:none}
  .mobile-backdrop:not([hidden]){position:fixed;inset:var(--global-nav-height) 0 0;z-index:45}
  .page-body{min-height:calc(100dvh - var(--global-nav-height) - 60px)}
}
@media(max-width:420px){
  body>.module-tabs{padding-inline:6px}
  .module-tab-list{gap:3px}
  body>.module-tabs .module-tab{padding-inline:10px;font-size:11px}
  body>.module-tabs .tips-toggle{gap:4px}
}