/**
 * Compatibilidade visual — força identidade Measure (Propostas) em módulos legados.
 * Carregado por último via measure_render_head_assets().
 */

/* ── Base ─────────────────────────────────────────────────────────────── */
body.measure-module,
body.measure-module.engaja-app,
body.measure-module.transacoes,
body.measure-module.planilhas-custom,
body.measure-module.whiteboard-page,
body.body--app,
body.body--auth {
  background: var(--portal-wash) !important;
  background-attachment: fixed !important;
  color: var(--ink) !important;
  font-family: var(--font) !important;
  -webkit-font-smoothing: antialiased;
}

body.measure-module::before,
body.measure-module:not(.auth-page)::before,
body.body--app::before {
  display: none !important;
}

html[data-theme] body.measure-module {
  --card: var(--bg);
  --input-bg: var(--bg);
  --primary-color: var(--accent);
  --primary-dark: color-mix(in srgb, var(--accent) 72%, #000);
  --primary-light: var(--accent);
  --primary-hover: color-mix(in srgb, var(--accent) 72%, #000);
  --selected-border: var(--accent);
  --bg-color: var(--bg);
  --bg-secondary: var(--bg);
  --card-bg: var(--bg);
  --card-bg-alt: var(--bg);
  --text-primary: var(--ink);
  --text-secondary: var(--muted);
  --border-color: var(--line);
  --success-color: var(--ok);
  --danger-color: var(--danger);
  --background: var(--bg);
  --surface: var(--bg);
  --text: var(--ink);
  --text-dim: var(--muted);
  --border: var(--line);
  --brand: var(--accent);
  --brand-user: var(--accent);
  --brand-2: color-mix(in srgb, var(--accent) 72%, #000);
  --dark-bg: var(--bg);
  --dark-card: var(--bg);
  --focus: color-mix(in srgb, var(--accent) 22%, transparent);
}

/* Shells deixam a atmosfera do portal aparecer */
body.measure-module > .app-shell,
body.measure-module > .finance-shell,
body.measure-module > .engaja-shell,
body.measure-module > .comercial-shell,
body.measure-module > #app,
body.measure-module .finance-main,
body.measure-module .engaja-main,
body.measure-module .comercial-main,
body.measure-module .app-shell > .main,
body.measure-module .app-shell .main,
body.measure-module .app-shell .main-panel {
  background: transparent !important;
  background-image: none !important;
}

/* Header do portal — mesma caixa (logo → Sair) em todas as ferramentas */
body.measure-module > header.portal-topbar,
body.measure-module header.portal-topbar {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

body.measure-module > header.portal-topbar .portal-topbar-inner,
body.measure-module > header.portal-topbar .portal-topbar-inner.wide,
body.measure-module > header.portal-topbar .topbar-inner,
body.measure-module > header.portal-topbar .topbar-inner.wide,
body.measure-module header.portal-topbar .portal-topbar-inner,
body.measure-module header.portal-topbar .portal-topbar-inner.wide,
body.measure-module header.portal-topbar .topbar-inner,
body.measure-module header.portal-topbar .topbar-inner.wide {
  display: grid !important;
  width: 100% !important;
  max-width: var(--portal-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  padding-left: var(--portal-inline) !important;
  padding-right: var(--portal-inline) !important;
  box-sizing: border-box !important;
}

@media (max-width: 1024px) {
  body.measure-module > header.portal-topbar .portal-topbar-inner,
  body.measure-module > header.portal-topbar .portal-topbar-inner.wide,
  body.measure-module > header.portal-topbar .topbar-inner,
  body.measure-module > header.portal-topbar .topbar-inner.wide,
  body.measure-module header.portal-topbar .portal-topbar-inner,
  body.measure-module header.portal-topbar .portal-topbar-inner.wide,
  body.measure-module header.portal-topbar .topbar-inner,
  body.measure-module header.portal-topbar .topbar-inner.wide {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: var(--portal-inline) !important;
    padding-right: var(--portal-inline) !important;
  }
}

/* Header do portal — nunca herdar cores de links dos módulos */
body.measure-module > header.portal-topbar .portal-nav a,
body.measure-module header.portal-topbar .portal-nav a {
  color: color-mix(in srgb, currentColor 62%, transparent) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  padding: 6px 9px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 999px !important;
}

body.measure-module > header.portal-topbar .portal-nav a:hover,
body.measure-module header.portal-topbar .portal-nav a:hover,
body.measure-module > header.portal-topbar .portal-nav a.is-active,
body.measure-module header.portal-topbar .portal-nav a.is-active {
  color: inherit !important;
  background: color-mix(in srgb, var(--accent, #0b6e6e) 16%, transparent) !important;
}

body.measure-module > header.portal-topbar .portal-logout,
body.measure-module header.portal-topbar .portal-logout {
  color: inherit !important;
}

/* ── Topbar legado (ocultar) ──────────────────────────────────────────── */
body.measure-module .navbar,
body.measure-module .app-header,
body.measure-module .app-logo,
body.measure-module .header-top,
body.measure-module .header-title-container,
body.measure-module .nav-bar,
body.measure-module .header-nav,
body.measure-module .legacy-header,
body.measure-module .legacy-nav,
body.measure-module .site-header {
  display: none !important;
}

/* ── Barras verdes → toolbar Measure ──────────────────────────────────── */
body.measure-module .green-header-bar,
body.measure-module .app-green-bar {
  background: transparent !important;
  border-bottom: 1px solid var(--line) !important;
  width: 100% !important;
  max-width: var(--portal-max) !important;
  margin: 0 auto 20px !important;
  padding: 12px var(--portal-inline) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.measure-module .app-green-bar__inner {
  max-width: var(--portal-max);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

body.measure-module .app-green-bar__input {
  border: 1px solid var(--line) !important;
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-radius: 999px !important;
  padding: 10px 16px !important;
}

/* ── Botões legados → Measure ─────────────────────────────────────────── */
body.measure-module .btn-new-briefing,
body.measure-module .btn-boards,
body.measure-module .btn-view,
body.measure-module .btn-login,
body.measure-module .btn--green-bar,
body.measure-module .btn--green-bar-dark,
body.measure-module .btn,
body.measure-module button.btn,
body.measure-module a.btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 42px !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border: 1px solid var(--btn-icon-border) !important;
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  text-decoration: none !important;
  cursor: pointer !important;
  font-family: var(--font) !important;
  box-shadow: none !important;
  transform: none !important;
  background-image: none !important;
}

body.measure-module .btn-new-briefing:hover,
body.measure-module .btn-boards:hover,
body.measure-module .btn-view:hover,
body.measure-module .btn--green-bar:hover,
body.measure-module .btn:hover,
body.measure-module button.btn:hover,
body.measure-module a.btn:hover {
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  border-color: var(--btn-icon-hover-border) !important;
  transform: none !important;
}

/* Primários = destaque do usuário (como CTAs do index) */
body.measure-module button.btn-primary,
body.measure-module a.btn-primary,
body.measure-module .btn-primary,
body.measure-module .primary-btn,
body.measure-module input[type="submit"]:not(.btn-ghost):not(.btn-outline),
body.measure-module .engaja-app .btn-primary,
body.measure-module .btn.btn-primary,
body.measure-module button.btn.btn-primary,
body.measure-module a.btn.btn-primary {
  background: var(--accent, var(--lime)) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
  border: 1px solid var(--accent, var(--lime)) !important;
  background-image: none !important;
}

body.measure-module button.btn-primary:hover,
body.measure-module a.btn-primary:hover,
body.measure-module .btn-primary:hover,
body.measure-module .primary-btn:hover,
body.measure-module input[type="submit"]:not(.btn-ghost):not(.btn-outline):hover,
body.measure-module .engaja-app .btn-primary:hover,
body.measure-module .btn.btn-primary:hover,
body.measure-module button.btn.btn-primary:hover,
body.measure-module a.btn.btn-primary:hover {
  background: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  border-color: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
}

body.measure-module .btn-outline,
body.measure-module .btn-secondary,
body.measure-module .btn-ghost,
body.measure-module .btn-sm.btn-outline,
body.measure-module .engaja-app .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 42px !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  background: var(--btn-icon-bg) !important;
  border: 1px solid var(--btn-icon-border) !important;
  color: var(--btn-icon-color) !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

body.measure-module .btn-outline:hover,
body.measure-module .btn-secondary:hover,
body.measure-module .btn-ghost:hover,
body.measure-module .engaja-app .btn:hover {
  background: var(--btn-icon-hover-bg) !important;
  border-color: var(--btn-icon-hover-border) !important;
  color: var(--ink) !important;
}

body.measure-module .btn-danger,
body.measure-module .btn-sm.btn-danger {
  background: var(--btn-icon-bg) !important;
  border: 1px solid var(--btn-icon-border) !important;
  color: var(--btn-icon-color) !important;
  border-radius: 999px !important;
}

body.measure-module .btn-danger:hover,
body.measure-module .btn-sm.btn-danger:hover {
  background: var(--danger-bg) !important;
  border-color: var(--danger-line) !important;
  color: var(--danger) !important;
}

body.measure-module .btn-sm,
body.measure-module .btn-sm.btn-outline {
  height: 34px !important;
  padding: 0 12px !important;
  font-size: 13.5px !important;
}

body.measure-module .btn-circle {
  width: var(--btn-icon-size) !important;
  height: var(--btn-icon-size) !important;
  min-width: var(--btn-icon-size) !important;
  min-height: var(--btn-icon-size) !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1px solid var(--btn-icon-border) !important;
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  box-shadow: none !important;
}

/* ── Tipografia de títulos ────────────────────────────────────────────── */
body.measure-module h1,
body.measure-module .page-header h1,
body.measure-module .page-header h2,
body.measure-module .page-header__text h2,
body.measure-module .content-header h1,
body.measure-module .module-page-head h1,
body.measure-module .dashboard-section h2,
body.measure-module .section-header h2 {
  font-family: var(--display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: var(--ink) !important;
  text-shadow: none !important;
}

body.measure-module .page-head h1,
body.measure-module .page-header h1,
body.measure-module .content-header h1,
body.measure-module .module-page-head h1,
body.measure-module .agenda-page-head h1,
body.measure-module .boards-header h1,
body.measure-module.kanban-page .board-header-content h1,
body.measure-module .board-header-content h1,
body.measure-module .wb-title-heading,
body.measure-module.autosocial-app .page-head h1,
html[data-theme] body.measure-module.autosocial-app .panel > .topbar h1,
html[data-theme] body.measure-module .page-header h1 {
  font-size: var(--page-title-size) !important;
  letter-spacing: var(--page-title-tracking) !important;
  line-height: var(--page-title-leading) !important;
}

body.measure-module .content-header h1,
body.measure-module .page-header h1,
body.measure-module .page-header h2 {
  margin: 0 0 8px;
}

/* ── Layout principal ─────────────────────────────────────────────────── */
body.measure-module .container,
body.measure-module .main-content,
body.measure-module main.container,
body.measure-module .module-page {
  max-width: var(--portal-max) !important;
  margin: 0 auto !important;
  padding: 20px var(--portal-inline) 0 !important;
  width: 100% !important;
}

/* Shells / páginas alinhadas ao header do portal */
body.measure-module > .app-shell,
body.measure-module > .app-shell.page,
body.measure-module > .app-shell.page.wide,
body.measure-module > #app,
body.measure-module > #app.page.wide {
  max-width: var(--portal-max) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--portal-inline) !important;
  padding-right: var(--portal-inline) !important;
  box-sizing: border-box !important;
}

body.measure-module > main.page,
body.measure-module > main.page.wide,
body.measure-module > .page.wide {
  max-width: var(--portal-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--portal-inline) !important;
  padding-right: var(--portal-inline) !important;
  padding-bottom: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  flex: none !important;
}

body.measure-module > .app-shell.page,
body.measure-module > .app-shell.page.wide,
body.measure-module > #app,
body.measure-module > #app.page.wide {
  padding-bottom: 24px !important;
}

body.measure-module #app > .main-content,
body.measure-module .app-shell > .main,
body.measure-module .app-shell .main,
body.measure-module .comercial-page > .main-content,
body.measure-module > main.page .container,
body.measure-module > main.page .main-content {
  max-width: none !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  width: 100% !important;
}

/* Agenda: main sem padding extra para a grade preencher até perto do footer */
body.measure-module #app.agenda-app > .main-content {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.measure-module #app.agenda-app > .agenda-page-head {
  margin-bottom: 22px !important;
}

body.measure-module:has(#app.agenda-app) {
  overflow-x: hidden;
  overflow-y: auto;
}

/* Sem linha no footer das ferramentas; espaçamento = Agenda (24px + 24px) */
body.measure-module > .measure-module-foot.portal-foot::before,
body.measure-module .measure-module-foot.portal-foot::before,
.measure-module-foot.portal-foot::before {
  display: none !important;
  content: none !important;
  margin: 0 !important;
  border: 0 !important;
}

body.measure-module > .measure-module-foot.portal-foot,
body.measure-module > footer.measure-module-foot,
.measure-module-foot.portal-foot {
  margin-top: 24px !important;
  margin-bottom: 12px !important;
}

/* Não esticar o conteúdo até o fundo da tela (abre um vão enorme acima do footer) */
body.measure-module {
  display: block !important;
}

body.measure-module.pass-app,
body.measure-module.pass-app.kanban-page {
  display: block !important;
}

body.measure-module.pass-app main.page,
body.measure-module > main.page {
  flex: none;
}

body.measure-module.autosocial-app > .app-shell,
body.measure-module.autosocial-app > .app-shell.page,
body.measure-module.autosocial-app > main.app-shell {
  min-height: 0 !important;
}

body.measure-module.kanban-page .board-container {
  padding-bottom: 24px !important;
  min-height: 0 !important;
}

body.measure-module.kanban-page .lists-container,
body.measure-module .kanban-page .lists-container {
  padding-bottom: 0 !important;
}

body.measure-module .kanban-page .board-header,
body.measure-module .kanban-page .board-container {
  max-width: var(--portal-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--portal-inline) !important;
  padding-right: var(--portal-inline) !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

body.measure-module .page-header,
body.measure-module .content-header,
body.measure-module .boards-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
  flex-wrap: wrap;
  text-align: left;
}

/* Títulos de página — sempre à esquerda */
body.measure-module .page-head,
body.measure-module .page-header,
body.measure-module .page-header__text,
body.measure-module .content-header,
body.measure-module .boards-header,
body.measure-module .portal-head,
body.measure-module .topbar > div:first-child:not(.topbar-actions),
body.measure-module .module-page-head {
  text-align: left !important;
}

/* Espaçamento entre header do portal e título — padrão Agenda */
body.measure-module .agenda-page-head,
body.measure-module .comercial-page > .page-head,
body.measure-module .finance-page > .page-head,
body.measure-module .engaja-page > .page-head,
body.measure-module.kanban-page > main.page .page-head,
body.measure-module.pass-app .page-head,
body.measure-module.autosocial-app .page-head,
body.measure-module.autosocial-app .page-head.page-head--stack,
body.measure-module.whiteboard-page .wb-page-head {
  padding-top: 16px !important;
}

/* Topo da página: mesma base que a Agenda (.page.wide = 20px) */
body.measure-module.comercial-app > main.comercial-page,
body.measure-module.finance-app > main.finance-page,
body.measure-module.engaja-app > main.engaja-page,
body.measure-module.pass-app > main.page.wide,
body.measure-module.kanban-page > main.page.wide,
body.measure-module.whiteboard-page > main.page.wide,
body.measure-module.autosocial-app > main.page,
body.measure-module.autosocial-app > main.page.wide,
body.measure-module.autosocial-app > main.app-shell {
  padding-top: 20px !important;
}

/* Menu em botões abaixo do título (padrão Propostas) */
body.measure-module .page-head.page-head--stack,
body.measure-module .comercial-page > .page-head,
body.measure-module .finance-page > .page-head,
body.measure-module .engaja-page > .page-head,
body.measure-module .agenda-page-head,
body.measure-module.kanban-page .page-head,
body.measure-module.pass-app .page-head,
body.measure-module.kanban-page .board-header-content,
body.measure-module.autosocial-app .page-head.page-head--stack,
body.measure-module.whiteboard-page .wb-page-head {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 14px !important;
}

body.measure-module .page-head.page-head--stack > .toolbar-actions,
body.measure-module .comercial-page > .page-head > .toolbar-actions,
body.measure-module .finance-page > .page-head > .toolbar-actions,
body.measure-module .finance-page > .page-head > nav,
body.measure-module .engaja-page > .page-head > .toolbar-actions,
body.measure-module .agenda-page-head > .toolbar-actions,
body.measure-module.kanban-page .page-head > .toolbar-actions,
body.measure-module.pass-app .page-head > .toolbar-actions,
body.measure-module.kanban-page .board-header-button,
body.measure-module.autosocial-app .page-head.page-head--stack > .autosocial-toolbar,
body.measure-module.whiteboard-page .wb-page-head > .toolbar-actions {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

body.measure-module .page-head h1,
body.measure-module .page-header h1,
body.measure-module .page-header h2,
body.measure-module .page-header__text h2,
body.measure-module .content-header h1,
body.measure-module .boards-header h1,
body.measure-module .boards-header h2,
body.measure-module .portal-head h1,
body.measure-module .topbar h1,
body.measure-module .module-page-head h1,
body.measure-module .agenda-page-head h1 {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

body.measure-module.kanban-page .board-header,
body.measure-module.kanban-page .board-header-content {
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
}

body.measure-module.kanban-page .board-header-content h1 {
  text-align: left !important;
  width: 100%;
}

body.measure-module .content-header {
  align-items: center !important;
  justify-content: space-between !important;
}

/* ── Cards e painéis ──────────────────────────────────────────────────── */
body.measure-module .card,
body.measure-module .panel,
body.measure-module .dashboard-card,
body.measure-module .stat-card,
body.measure-module .content-card,
body.measure-module .dashboard-section,
body.measure-module .filters-box,
body.measure-module .board-card,
body.measure-module .note-card,
body.measure-module .whiteboard-card,
body.measure-module .briefing-card,
body.measure-module .engaja-app .card,
body.measure-module .engaja-app .panel,
body.measure-module .auth-box,
body.measure-module .auth-modal,
body.measure-module .modal-content,
body.measure-module .chart-card,
body.measure-module .form-container,
body.measure-module .planilha-card,
body.measure-module .pass-table,
body.measure-module .create-step,
body.measure-module .hp-editor,
body.measure-module .settings-card,
body.measure-module .article-card,
body.measure-module .dash-day-modal {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius, 20px) !important;
  box-shadow: var(--shadow) !important;
  color: var(--ink) !important;
}

body.measure-module .card-receita,
body.measure-module .card-despesa,
body.measure-module .card-saldo {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
}

body.measure-module .card-value,
body.measure-module .card-content h3,
body.measure-module .card-content p {
  color: var(--ink) !important;
}

body.measure-module .stat,
body.measure-module .cards-grid .card {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
}

/* ── Tabelas ──────────────────────────────────────────────────────────── */
body.measure-module .table-wrap,
body.measure-module .table-responsive,
body.measure-module .table-container,
body.measure-module .data-table-wrap {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  box-shadow: var(--shadow) !important;
}

body.measure-module table,
body.measure-module .table,
body.measure-module .data-table,
body.measure-module .projecao-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--ink) !important;
  background: transparent !important;
}

body.measure-module th,
body.measure-module .table th,
body.measure-module .data-table th,
body.measure-module .projecao-table th {
  text-align: left !important;
  padding: 14px 16px !important;
  border-bottom: 1px solid var(--line) !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--faint) !important;
  font-weight: 500 !important;
  background: transparent !important;
}

body.measure-module td,
body.measure-module .table td,
body.measure-module .data-table td,
body.measure-module .projecao-table td {
  padding: 14px 16px !important;
  border-bottom: 1px solid var(--line) !important;
  color: var(--ink) !important;
  background: transparent !important;
}

body.measure-module tbody tr:hover td,
body.measure-module .data-table tbody tr:hover td {
  background: var(--hover-row) !important;
}

body.measure-module .projecao-table,
body.measure-module .line-chart-wrap,
body.measure-module .dashboard-section > .chart-container,
body.measure-module .form-container > h2 {
  background: var(--bg) !important;
}

/* ── Formulários ──────────────────────────────────────────────────────── */
body.measure-module input[type="text"],
body.measure-module input[type="email"],
body.measure-module input[type="password"],
body.measure-module input[type="number"],
body.measure-module input[type="date"],
body.measure-module input[type="month"],
body.measure-module input[type="search"],
body.measure-module input[type="url"],
body.measure-module input[type="tel"],
body.measure-module input[type="datetime-local"],
body.measure-module input[type="time"],
body.measure-module input[type="week"],
body.measure-module select,
body.measure-module textarea,
body.measure-module .form-control,
body.measure-module .field,
body.measure-module .select,
body.measure-module .area,
body.measure-module .search,
body.measure-module .engaja-app .panel input,
body.measure-module .engaja-app .chips-input input {
  width: 100%;
  border: 1px solid var(--line) !important;
  background: var(--bg) !important;
  border-radius: 14px !important;
  padding: 11px 14px !important;
  outline: none !important;
  color: var(--ink) !important;
  font-family: var(--font) !important;
  box-shadow: none !important;
}

body.measure-module input:focus,
body.measure-module input:focus-visible,
body.measure-module select:focus,
body.measure-module select:focus-visible,
body.measure-module textarea:focus,
body.measure-module textarea:focus-visible {
  border-color: var(--accent, var(--lime)) !important;
  box-shadow: 0 0 0 3px var(--focus) !important;
  outline: none !important;
}

body.measure-module label,
body.measure-module .form-label,
body.measure-module .field-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
}

body.measure-module .form-group {
  margin-bottom: 14px;
}

/* Modais — espaçamento entre campos (Agenda › Nova Tarefa: 20px / label 8px) */
body.measure-module .modal-content form,
body.measure-module .modal-card form,
body.measure-module .modal-body > form {
  display: flex;
  flex-direction: column;
  gap: 0 !important;
}

body.measure-module .modal .form-group,
body.measure-module .modal-content .form-group,
body.measure-module .modal-body .form-group,
body.measure-module .modal-card .body .form-group,
body.measure-module .modal-card > .body > .form-group {
  margin-bottom: var(--modal-field-gap) !important;
  display: block !important;
  gap: 0 !important;
}

body.measure-module .modal .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: var(--modal-field-gap);
}

body.measure-module .modal .form-row .form-group {
  margin-bottom: 0 !important;
}

body.measure-module .modal .form-row:last-child {
  margin-bottom: 0;
}

body.measure-module .modal-content .event-form-body > :last-child,
body.measure-module .modal-body > .form-group:last-child,
body.measure-module .modal-body form > .form-group:last-child,
body.measure-module .modal-content form > .form-group:last-child,
body.measure-module .modal-content .event-form-body > .form-row:last-child .form-group {
  margin-bottom: 0 !important;
}

body.measure-module .modal-content .form-group label,
body.measure-module .modal-body .form-group label,
body.measure-module .modal .form-group .field-label {
  margin-bottom: var(--modal-label-gap) !important;
}

body.measure-module .modal .stack,
body.measure-module .modal-body.stack,
body.measure-module .modal-card .stack,
body.measure-module .modal-card .body.stack {
  gap: var(--modal-field-gap) !important;
}

body.measure-module .modal .lbl,
body.measure-module .modal-content .lbl,
body.measure-module .modal-card .lbl {
  gap: var(--modal-label-gap) !important;
}

body.measure-module .modal-backdrop .modal .field,
body.measure-module .modal-backdrop.open .modal .field {
  margin-bottom: var(--modal-field-gap) !important;
}

body.measure-module .modal-backdrop .modal .field:last-child,
body.measure-module .modal-backdrop .modal form > .field:last-of-type {
  margin-bottom: 0 !important;
}

body.measure-module .pass-credential-form-modal .pass-form {
  gap: var(--modal-field-gap) !important;
}

body.measure-module .pass-credential-form-modal .pass-field {
  gap: var(--modal-label-gap) !important;
}

body.measure-module .engaja-app .drawer-body .field-label {
  margin-bottom: var(--modal-label-gap) !important;
}

body.measure-module .engaja-app .drawer-body .chips-input {
  margin-bottom: var(--modal-field-gap) !important;
}

/* ── Modais ───────────────────────────────────────────────────────────── */
/* Overlay aberto — controlado por [hidden] (Measure.modal) ou .show/.active legado */
body.measure-module .modal:not([hidden]),
body.measure-module .modal.show:not([hidden]),
body.measure-module .modal.active:not([hidden]),
body.measure-module .modal-overlay:not([hidden]),
body.measure-module .modal-overlay.show:not([hidden]),
body.measure-module .modal-overlay.active:not([hidden]),
body.measure-module .modal-backdrop.open {
  position: fixed !important;
  inset: 0 !important;
  background: var(--overlay) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
  z-index: 1000 !important;
}

/* Overlay fechado */
body.measure-module .modal[hidden],
body.measure-module .modal-overlay[hidden] {
  display: none !important;
}

body.measure-module .modal-backdrop:not(.open) {
  display: none;
}

/* AutoSocial: .modal é o painel interno, não o overlay */
body.measure-module .modal-backdrop .modal {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  background: var(--bg) !important;
  width: min(680px, 100%) !important;
  max-height: 90vh !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-gutter: stable;
  box-sizing: border-box;
  padding: 20px var(--modal-inline-pad, 16px) 24px !important;
}

body.measure-module .modal-backdrop .modal.modal-hp-preview {
  display: flex !important;
  flex-direction: column !important;
  width: min(1280px, calc(100vw - 64px)) !important;
  max-width: calc(100vw - 64px) !important;
  height: calc(100vh - 36px) !important;
  max-height: calc(100vh - 36px) !important;
  overflow: hidden !important;
  padding: 18px 20px 16px !important;
}

body.measure-module #hpPreviewModal.has-inspector .modal.modal-hp-preview {
  width: min(1480px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
}

body.measure-module .modal-content,
body.measure-module .modal-card,
body.measure-module .modal-dialog {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 24px !important;
  box-shadow: var(--shadow) !important;
  color: var(--ink) !important;
  max-width: 640px;
  width: 100%;
  padding: 20px var(--modal-inline-pad, 16px) 24px !important;
  display: flex !important;
  flex-direction: column;
  max-height: min(90vh, calc(100% - 40px));
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-gutter: stable;
  box-sizing: border-box;
}

body.measure-module .modal-content.modal-large,
body.measure-module .modal-card.modal-large {
  max-width: 720px;
}

body.measure-module .drawer-header,
body.measure-module .drawer-footer {
  padding: 16px var(--modal-inline-pad, 16px) !important;
  border-color: var(--line) !important;
  background: transparent !important;
}

body.measure-module .modal-header,
body.measure-module .modal-card > header {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  flex-shrink: 0;
}

body.measure-module .modal-header h2,
body.measure-module .modal-card > header strong,
body.measure-module .modal-card > header h2,
body.measure-module .modal-title {
  margin: 0 !important;
  font-family: var(--display) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  line-height: 0.95 !important;
  color: var(--ink) !important;
}

body.measure-module .modal-body,
body.measure-module .modal-card > .body {
  padding-block: 0 !important;
  padding-inline: 0 !important;
  color: var(--ink) !important;
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
  box-sizing: border-box;
}

body.measure-module .drawer-body {
  padding: 20px var(--modal-inline-pad, 16px) !important;
  overflow-y: auto !important;
  scrollbar-gutter: stable;
  box-sizing: border-box;
}

/* Agenda: formulário longo e lista de metas rolam por dentro, barra na borda do card */
body.measure-module #eventModal .modal-content,
body.measure-module .modal-content.modal-todo {
  overflow: hidden !important;
}

body.measure-module .modal-content .event-form-body,
body.measure-module .modal-todo .todo-list {
  margin-inline: calc(-1 * var(--modal-inline-pad, 16px));
  padding-inline: var(--modal-inline-pad, 16px);
  scrollbar-gutter: stable;
  box-sizing: border-box;
}

body.measure-module .modal-body,
body.measure-module .drawer-body,
body.measure-module .modal-card > .body,
body.measure-module .modal-content,
body.measure-module .modal-card,
body.measure-module .modal-dialog,
body.measure-module .modal-backdrop .modal,
body.measure-module .modal-content .event-form-body,
body.measure-module .modal-todo .todo-list {
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--ink) 28%, transparent) transparent;
}

body.measure-module .modal-body::-webkit-scrollbar,
body.measure-module .drawer-body::-webkit-scrollbar,
body.measure-module .modal-card > .body::-webkit-scrollbar,
body.measure-module .modal-content::-webkit-scrollbar,
body.measure-module .modal-card::-webkit-scrollbar,
body.measure-module .modal-dialog::-webkit-scrollbar,
body.measure-module .modal-backdrop .modal::-webkit-scrollbar,
body.measure-module .modal-content .event-form-body::-webkit-scrollbar,
body.measure-module .modal-todo .todo-list::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

body.measure-module .modal-body::-webkit-scrollbar-track,
body.measure-module .drawer-body::-webkit-scrollbar-track,
body.measure-module .modal-card > .body::-webkit-scrollbar-track,
body.measure-module .modal-content::-webkit-scrollbar-track,
body.measure-module .modal-card::-webkit-scrollbar-track,
body.measure-module .modal-dialog::-webkit-scrollbar-track,
body.measure-module .modal-backdrop .modal::-webkit-scrollbar-track,
body.measure-module .modal-content .event-form-body::-webkit-scrollbar-track,
body.measure-module .modal-todo .todo-list::-webkit-scrollbar-track {
  background: transparent;
}

body.measure-module .modal-body::-webkit-scrollbar-thumb,
body.measure-module .drawer-body::-webkit-scrollbar-thumb,
body.measure-module .modal-card > .body::-webkit-scrollbar-thumb,
body.measure-module .modal-content::-webkit-scrollbar-thumb,
body.measure-module .modal-card::-webkit-scrollbar-thumb,
body.measure-module .modal-dialog::-webkit-scrollbar-thumb,
body.measure-module .modal-backdrop .modal::-webkit-scrollbar-thumb,
body.measure-module .modal-content .event-form-body::-webkit-scrollbar-thumb,
body.measure-module .modal-todo .todo-list::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--ink) 26%, transparent);
  background-clip: padding-box;
  border: 2px solid transparent;
  border-radius: 999px;
}

body.measure-module .modal-body::-webkit-scrollbar-thumb:hover,
body.measure-module .drawer-body::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-card > .body::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-content::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-card::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-dialog::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-backdrop .modal::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-content .event-form-body::-webkit-scrollbar-thumb:hover,
body.measure-module .modal-todo .todo-list::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--ink) 42%, transparent);
  background-clip: padding-box;
  border: 2px solid transparent;
}

body.measure-module .modal-footer,
body.measure-module .modal-card > footer,
body.measure-module .modal-card footer,
body.measure-module .modal-actions,
body.measure-module .export-modal-actions,
body.measure-module .view-note-actions,
body.measure-module .drawer-footer,
body.measure-module .pass-form-actions,
body.measure-module .modal .form-actions,
body.measure-module .modal .form-actions-buttons {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

body.measure-module .modal-footer,
body.measure-module .modal-card > footer {
  margin: 16px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  flex-shrink: 0;
}

body.measure-module .modal-content .form-group label,
body.measure-module .modal-card .lbl {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--muted);
  letter-spacing: 0;
  text-transform: none;
}

body.measure-module .auth-title {
  font-family: var(--display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: var(--ink) !important;
}

body.measure-module .engaja-app .drawer-overlay {
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  background: var(--overlay) !important;
  z-index: 200 !important;
}

body.measure-module .engaja-app .drawer-overlay[hidden] {
  display: none !important;
}

body.measure-module .engaja-app .drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  width: min(420px, 92vw) !important;
  max-width: 92vw !important;
  height: 100vh !important;
  transform: translateX(100%) !important;
  border-radius: 0 !important;
  border-left: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
  z-index: 210 !important;
  display: flex !important;
  flex-direction: column !important;
}

body.measure-module .engaja-app .drawer[hidden] {
  display: none !important;
}

body.measure-module .engaja-app .drawer.open {
  transform: translateX(0) !important;
}

body.measure-module .engaja-app .drawer-header h2 {
  font-family: var(--display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.04em !important;
  color: var(--ink) !important;
}

/* ── Badges e status ──────────────────────────────────────────────────── */
body.measure-module .badge,
body.measure-module .status-badge,
body.measure-module .engaja-app .badge,
body.measure-module .engaja-app .chip {
  display: inline-flex !important;
  align-items: center !important;
  height: 24px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  border: 1px solid var(--line) !important;
  background: var(--bg) !important;
  color: var(--ink) !important;
}

body.measure-module .text-success,
body.measure-module .text-success strong {
  color: var(--ok) !important;
}

body.measure-module .text-danger,
body.measure-module .text-danger strong {
  color: var(--danger) !important;
}

/* ── CRM Leads ────────────────────────────────────────────────────────── */
body.measure-module .sidebar {
  background: var(--bg) !important;
  border-right: 1px solid var(--line) !important;
}

body.measure-module .sidebar-nav a.active,
body.measure-module .sidebar-nav a:hover {
  background: var(--focus) !important;
  color: var(--ink) !important;
}

/* ── AutoSocial ───────────────────────────────────────────────────────── */
body.measure-module.autosocial-app .sidebar-inner,
body.measure-module.autosocial-app .app-shell .sidebar {
  background: var(--bg) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

body.measure-module.autosocial-app .brand-mark {
  color: var(--ink) !important;
  font-family: var(--display) !important;
}

body.measure-module.autosocial-app .brand-mark span {
  color: var(--accent) !important;
}

body.measure-module.autosocial-app .autosocial-toolbar .nav-btn {
  background: var(--btn-icon-bg) !important;
  border: 1px solid var(--btn-icon-border) !important;
  color: var(--btn-icon-color) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-family: var(--font) !important;
  height: 34px !important;
  min-height: 34px !important;
}

body.measure-module.autosocial-app .autosocial-toolbar .nav-btn:hover {
  background: var(--btn-icon-hover-bg) !important;
  border-color: var(--btn-icon-hover-border) !important;
  color: var(--ink) !important;
}

body.measure-module.autosocial-app .autosocial-toolbar .nav-btn.active,
body.measure-module.autosocial-app .autosocial-toolbar .nav-btn.is-active {
  background: var(--accent, var(--lime)) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
  border: 1px solid var(--accent, var(--lime)) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}

body.measure-module.autosocial-app .autosocial-toolbar .nav-btn.active:hover,
body.measure-module.autosocial-app .autosocial-toolbar .nav-btn.is-active:hover {
  background: var(--accent, var(--lime)) !important;
  border-color: var(--accent, var(--lime)) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
}

body.measure-module.autosocial-app .app-shell,
body.measure-module.autosocial-app .main-panel,
body.measure-module.autosocial-app .main {
  background: transparent !important;
  color: var(--ink) !important;
}

body.measure-module.autosocial-app .btn-primary,
body.measure-module.autosocial-app .btn-publish,
body.measure-module.autosocial-app .primary-btn {
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  border: 1px solid var(--btn-icon-border) !important;
  background-image: none !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

body.measure-module.autosocial-app .btn-primary:hover,
body.measure-module.autosocial-app .btn-publish:hover,
body.measure-module.autosocial-app .primary-btn:hover {
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  border-color: var(--btn-icon-hover-border) !important;
}

body.measure-module.autosocial-app .autosocial-page-actions .btn-primary {
  background: var(--accent, var(--lime)) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
  border: 1px solid var(--accent, var(--lime)) !important;
  background-image: none !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 18px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

body.measure-module.autosocial-app .autosocial-page-actions .btn-primary:hover {
  background: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  border-color: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
}

body.measure-module.autosocial-app .stat,
body.measure-module.autosocial-app .card,
body.measure-module.autosocial-app .article-card {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}

body.measure-module.autosocial-app .panel {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* ── Agenda (calendário) ──────────────────────────────────────────────── */
body.measure-module .calendar-header {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}

body.measure-module .calendar-grid,
body.measure-module .sidebar-panel {
  background: var(--bg) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

body.measure-module .calendar-cell,
body.measure-module .day-cell {
  background: var(--bg) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

body.measure-module .btn-primary.auth-modal .btn,
body.measure-module .auth-modal .btn-primary {
  width: 100%;
}

/* ── Footer legado ────────────────────────────────────────────────────── */
body.measure-module .footer,
body.measure-module .user-footer {
  border-top: 0 !important;
  background: transparent !important;
  color: var(--muted) !important;
  margin-top: auto;
}

/* ── Empty states ─────────────────────────────────────────────────────── */
body.measure-module .empty-state,
body.measure-module .empty-state p {
  color: var(--muted) !important;
}

body.measure-module .empty-state h2 {
  color: var(--ink) !important;
}

/* ── Toast ────────────────────────────────────────────────────────────── */
body.measure-module #toast,
body.measure-module .toast {
  background: var(--btn) !important;
  color: var(--btn-text) !important;
  border: none !important;
  border-radius: 999px !important;
}

body.measure-module .engaja-app #toast {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
}

/* ── Tabs / filtros (pill) — não aplicar ao box .filters do Finance ─── */
body.measure-module .tabs,
body.measure-module .engaja-app .tabs {
  display: flex !important;
  gap: 4px !important;
  padding: 4px !important;
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
}

body.measure-module .tab,
body.measure-module .engaja-app .tab {
  border: none !important;
  background: transparent !important;
  color: var(--muted) !important;
  padding: 7px 16px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
}

body.measure-module .tab.active,
body.measure-module .engaja-app .tab.active {
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--btn-icon-hover-border) !important;
}

/* ── Tasks / Tools boards ─────────────────────────────────────────────── */
body.measure-module .board-header,
body.measure-module .wb-editor-header {
  background: transparent !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 16px 0 !important;
  margin-bottom: 16px !important;
}

body.measure-module .board-header-content {
  max-width: var(--portal-max);
  width: 100%;
  margin: 0 auto;
  padding-left: var(--portal-inline);
  padding-right: var(--portal-inline);
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

body.measure-module .lists-container,
body.measure-module .kanban-page .lists-container,
body.measure-module.kanban-page .lists-container {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  justify-content: flex-start !important;
}

body.measure-module .board-header h1,
body.measure-module .wb-title-heading,
body.measure-module .wb-title-input {
  font-family: var(--display) !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
}

body.measure-module .wb-title-heading {
  display: flex !important;
  align-items: baseline;
  gap: 0.28em;
}

body.measure-module .wb-title-input,
body.measure-module input.wb-title-input[type="text"] {
  display: block !important;
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 8ch !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 0 4px !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  line-height: inherit !important;
}

body.measure-module .wb-title-input:hover,
body.measure-module .wb-title-input:focus,
body.measure-module input.wb-title-input[type="text"]:focus {
  outline: none !important;
  border-color: transparent !important;
  border-bottom-color: var(--line-strong) !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.measure-module .btn-view.active {
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--btn-icon-hover-border) !important;
}

body.measure-module .list,
body.measure-module .list-card,
body.measure-module .kanban-list {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius, 20px) !important;
  box-shadow: var(--shadow) !important;
  color: var(--ink) !important;
}

body.measure-module .list-title {
  font-family: var(--display) !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
  letter-spacing: -0.04em !important;
}

body.measure-module .task-card {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
}

body.measure-module .logout-footer,
body.measure-module .footer.user-footer {
  display: none !important;
}

body.measure-module .vault-card,
body.measure-module .credential-card,
body.measure-module .vault-item {
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: 18px !important;
  color: var(--ink) !important;
}

body.measure-module .summary-card,
body.measure-module .categoria-form-box,
body.measure-module .categoria-section,
body.measure-module .categoria-item,
body.measure-module .annual-chart-container,
body.measure-module .ai-chat-panel,
body.measure-module .ai-chat-input {
  background: var(--bg) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

body.measure-module .dashboard-section .section-header,
body.measure-module .form-container > h2,
body.measure-module .categoria-section h2,
body.measure-module .ai-chat-form {
  background: var(--bg) !important;
  border-color: var(--line) !important;
}

body.measure-module .alert--success {
  background: var(--ok-bg) !important;
  border: 1px solid var(--ok-line) !important;
  color: var(--ok) !important;
  border-radius: 14px !important;
}

body.measure-module .alert--error {
  background: var(--danger-bg) !important;
  border: 1px solid var(--danger-line) !important;
  color: var(--danger) !important;
  border-radius: 14px !important;
}

body.measure-module .sidebar,
body.measure-module .sidebar-panel {
  background: var(--bg) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

body.measure-module .agenda-toolbar .btn-create-event,
body.measure-module .btn-create-event {
  background: color-mix(in srgb, var(--accent, var(--lime)) 86%, #000) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
  border: 1px solid color-mix(in srgb, var(--accent, var(--lime)) 86%, #000) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body.measure-module .agenda-toolbar .btn-create-event:hover,
body.measure-module .btn-create-event:hover {
  background: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  border-color: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
}

body.measure-module .view-btn.active,
body.measure-module .btn-view.active,
body.measure-module .agenda-toolbar .view-btn.active {
  background: var(--accent, var(--lime)) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
  border: 1px solid var(--accent, var(--lime)) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}

body.measure-module .view-btn,
body.measure-module .btn-nav {
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  border: 1px solid var(--btn-icon-border) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

body.measure-module .view-btn:hover,
body.measure-module .btn-nav:hover {
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  border-color: var(--btn-icon-hover-border) !important;
}

body.measure-module .search-input {
  border-radius: 999px !important;
}

body.measure-module ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

body.measure-module ::-webkit-scrollbar-track {
  background: var(--bg);
}

body.measure-module.whiteboard-page .wb-page-head .btn-primary {
  background: var(--accent, var(--lime)) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
  border: 1px solid var(--accent, var(--lime)) !important;
}

body.measure-module.whiteboard-page .wb-page-head .btn-primary:hover {
  background: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  border-color: color-mix(in srgb, var(--accent, var(--lime)) 72%, #000) !important;
  color: var(--accent-ink, var(--charcoal, #121212)) !important;
}

body.measure-module ::-webkit-scrollbar-thumb {
  background: var(--line-strong);
  border-radius: 999px;
}

/* ── Botões circulares (ícone) — estilo de referência Measure ─────────── */
body.measure-module .btn-icon,
body.measure-module .btn-circle,
body.measure-module .btn-view-note,
body.measure-module .btn-edit-note,
body.measure-module .btn-delete-note,
body.measure-module .btn-export-note,
body.measure-module .board-icon-btn,
body.measure-module .list-btn-edit,
body.measure-module .list-btn-delete,
body.measure-module .wb-icon-btn,
body.measure-module .modal .close,
body.measure-module .modal-close,
body.measure-module .btn-close,
body.measure-module .btn-menu,
body.measure-module .btn-edit-calendar,
body.measure-module .btn-complete,
body.measure-module .campos-builder .btn-campo-remover,
body.measure-module .case-thumb button,
body.measure-module .engaja-app .drawer-close,
body.measure-module.autosocial-app .btn-icon,
body.measure-module.autosocial-app .btn-icon-primary,
body.measure-module.autosocial-app .btn-icon-muted,
body.measure-module.autosocial-app .btn-icon-danger,
body.measure-module.whiteboard-page .wb-tool:not(.wb-tool--label) {
  width: var(--btn-icon-size) !important;
  height: var(--btn-icon-size) !important;
  min-width: var(--btn-icon-size) !important;
  min-height: var(--btn-icon-size) !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  border: 1px solid var(--btn-icon-border) !important;
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  text-decoration: none !important;
  opacity: 1 !important;
  transform: none !important;
  box-shadow: none !important;
  background-image: none !important;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease !important;
}

body.measure-module .btn.btn-circle,
body.measure-module .btn-sm.btn-circle,
body.measure-module .btn-sm.btn-outline.btn-circle,
body.measure-module .btn-sm.btn-danger.btn-circle {
  width: var(--btn-icon-size) !important;
  height: var(--btn-icon-size) !important;
  min-width: var(--btn-icon-size) !important;
  min-height: var(--btn-icon-size) !important;
  max-width: var(--btn-icon-size) !important;
  max-height: var(--btn-icon-size) !important;
  flex: 0 0 var(--btn-icon-size) !important;
  padding: 0 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

body.measure-module .btn-icon:hover,
body.measure-module .btn-circle:hover,
body.measure-module .btn-view-note:hover,
body.measure-module .btn-edit-note:hover,
body.measure-module .btn-export-note:hover,
body.measure-module .board-icon-btn:hover,
body.measure-module .list-btn-edit:hover,
body.measure-module .wb-icon-btn:hover,
body.measure-module .modal .close:hover,
body.measure-module .modal-close:hover,
body.measure-module .btn-close:hover,
body.measure-module .btn-menu:hover,
body.measure-module .btn-edit-calendar:hover,
body.measure-module .btn-complete:hover,
body.measure-module .campos-builder .btn-campo-remover:hover,
body.measure-module .case-thumb button:hover,
body.measure-module .engaja-app .drawer-close:hover,
body.measure-module.autosocial-app .btn-icon:hover:not(:disabled),
body.measure-module.autosocial-app .btn-icon-primary:hover:not(:disabled),
body.measure-module.autosocial-app .btn-icon-muted:hover:not(:disabled),
body.measure-module.whiteboard-page .wb-tool:not(.wb-tool--label):hover:not(:disabled) {
  border-color: var(--btn-icon-hover-border) !important;
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  transform: none !important;
}

body.measure-module .btn-delete-note,
body.measure-module .list-btn-delete,
body.measure-module .wb-icon-btn--danger,
body.measure-module .board-icon-btn-delete,
body.measure-module .btn-icon.btn-danger,
body.measure-module.autosocial-app .btn-icon-danger {
  color: var(--btn-icon-color) !important;
}

body.measure-module .btn-delete-note:hover,
body.measure-module .list-btn-delete:hover,
body.measure-module .wb-icon-btn--danger:hover,
body.measure-module .board-icon-btn-delete:hover,
body.measure-module .btn-icon.btn-danger:hover,
body.measure-module.autosocial-app .btn-icon-danger:hover:not(:disabled) {
  border-color: var(--danger-line) !important;
  background: var(--danger-bg) !important;
  color: var(--danger) !important;
}

body.measure-module.whiteboard-page .wb-tool.active,
body.measure-module.whiteboard-page .wb-tool.wb-toggle.active {
  border-color: var(--btn-icon-hover-border) !important;
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
}

body.measure-module .btn-view-note svg,
body.measure-module .btn-edit-note svg,
body.measure-module .btn-delete-note svg,
body.measure-module .btn-export-note svg,
body.measure-module .board-icon-btn svg,
body.measure-module .list-btn-edit svg,
body.measure-module .list-btn-delete svg,
body.measure-module .wb-icon-btn svg,
body.measure-module .btn-icon svg,
body.measure-module .btn-circle svg,
body.measure-module.autosocial-app .btn-icon svg {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  stroke: currentColor !important;
  fill: none !important;
}

body.measure-module .btn-icon.btn-export-pdf::before {
  content: "" !important;
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
  background-color: currentColor !important;
  background-image: none !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M8 11l4 4 4-4M4 21h16'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12M8 11l4 4 4-4M4 21h16'/%3E%3C/svg%3E") !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
}

body.measure-module .board-icon-btn svg circle,
body.measure-module .list-btn-edit svg circle,
body.measure-module .list-btn-delete svg circle,
body.measure-module .board-icon-btn svg path[fill="#FFFFFF"],
body.measure-module .list-btn-edit svg path[fill="#FFFFFF"] {
  display: none !important;
}

body.measure-module .responsaveis-list .btn-edit,
body.measure-module .responsaveis-list .btn-delete {
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid var(--btn-icon-border) !important;
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

body.measure-module .responsaveis-list .btn-delete {
  color: var(--btn-icon-color) !important;
}

body.measure-module .responsaveis-list .btn-edit:hover,
body.measure-module .responsaveis-list .btn-delete:hover {
  border-color: var(--btn-icon-hover-border) !important;
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
}

body.measure-module .responsaveis-list .btn-delete:hover {
  color: var(--danger) !important;
  border-color: var(--danger-line) !important;
  background: var(--danger-bg) !important;
}

body.measure-module .note-card .board-card-actions,
body.measure-module .note-card-actions {
  flex-wrap: nowrap !important;
}

body.measure-module .board-card-actions .btn-primary,
body.measure-module .board-card-actions .btn-danger,
body.measure-module .board-card-actions .btn,
body.measure-module .board-card-actions .btn-ghost,
body.measure-module .pkg-admin .row-actions .btn,
body.measure-module .pkg-admin .board-card-actions .btn {
  height: 34px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border: 1px solid var(--btn-icon-border) !important;
  background: var(--btn-icon-bg) !important;
  color: var(--btn-icon-color) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
}

body.measure-module .note-card .board-card-actions .btn,
body.measure-module .note-card-actions .btn {
  padding: 0 10px !important;
  font-size: 12.5px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

body.measure-module .board-card-actions .btn-primary:hover,
body.measure-module .board-card-actions .btn-ghost:hover,
body.measure-module .note-card .board-card-actions .btn:hover,
body.measure-module .pkg-admin .row-actions .btn:hover,
body.measure-module .pkg-admin .board-card-actions .btn:hover {
  background: var(--btn-icon-hover-bg) !important;
  color: var(--ink) !important;
  border-color: var(--btn-icon-hover-border) !important;
}

body.measure-module .board-card-actions .btn-danger,
body.measure-module .pkg-admin .row-actions .btn-danger,
body.measure-module .pkg-admin .board-card-actions .btn-danger {
  color: var(--btn-icon-color) !important;
}

body.measure-module .board-card-actions .btn-danger:hover,
body.measure-module .pkg-admin .row-actions .btn-danger:hover,
body.measure-module .pkg-admin .board-card-actions .btn-danger:hover {
  background: var(--danger-bg) !important;
  color: var(--danger) !important;
  border-color: var(--danger-line) !important;
}

/* ── Fundo idêntico ao index.php (última palavra) ─────────────────────── */
html:has(body.measure-module),
html[data-theme]:has(body.measure-module) {
  background: var(--portal-wash) !important;
  background-attachment: fixed !important;
  min-height: 100%;
}

html[data-theme] body.measure-module,
html[data-theme] body.measure-module.autosocial-app,
html[data-theme] body.measure-module.engaja-app,
html[data-theme] body.measure-module.comercial-app,
html[data-theme] body.measure-module.finance-app,
html[data-theme] body.measure-module.pass-app,
html[data-theme] body.measure-module.kanban-page,
body.measure-module {
  background: var(--portal-wash) !important;
  background-attachment: fixed !important;
}

body.measure-module > .app-shell,
body.measure-module > .finance-shell,
body.measure-module > .engaja-shell,
body.measure-module > .comercial-shell,
body.measure-module > #app,
body.measure-module > main.page,
body.measure-module > main.page.wide,
body.measure-module > .page,
body.measure-module > .page.wide,
body.measure-module .finance-main,
body.measure-module .engaja-main,
body.measure-module .comercial-main,
body.measure-module .app-shell > .main,
body.measure-module .app-shell .main,
body.measure-module .app-shell .main-panel,
body.measure-module #app > .main-content,
body.measure-module .module-page,
body.measure-module.autosocial-app .app-shell,
body.measure-module.autosocial-app .main,
body.measure-module.autosocial-app .main-panel {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Comercial — cores dos pills de status (Leads + Propostas) */
body.measure-module.comercial-app .badge.badge-novo,
body.measure-module.comercial-app .badge.novo {
  background: rgba(37, 99, 235, 0.15) !important;
  color: #2563eb !important;
  border-color: rgba(37, 99, 235, 0.35) !important;
}

body.measure-module.comercial-app .badge.badge-rascunho,
body.measure-module.comercial-app .badge.rascunho {
  background: rgba(59, 130, 246, 0.15) !important;
  color: #60a5fa !important;
  border-color: rgba(59, 130, 246, 0.3) !important;
}

body.measure-module.comercial-app .badge.badge-registrado,
body.measure-module.comercial-app .badge.registrado {
  background: rgba(148, 163, 184, 0.18) !important;
  color: #94a3b8 !important;
  border-color: rgba(148, 163, 184, 0.35) !important;
}

body.measure-module.comercial-app .badge.badge-contatado,
body.measure-module.comercial-app .badge.contatado,
body.measure-module.comercial-app .badge.badge-enviada,
body.measure-module.comercial-app .badge.enviada,
body.measure-module.comercial-app .badge.badge-proposta_enviada,
body.measure-module.comercial-app .badge.proposta_enviada {
  background: rgba(71, 205, 137, 0.15) !important;
  color: var(--status-green, #47cd89) !important;
  border-color: rgba(71, 205, 137, 0.35) !important;
}

body.measure-module.comercial-app .badge.badge-aprovada,
body.measure-module.comercial-app .badge.aprovada,
body.measure-module.comercial-app .badge.badge-proposta_aceita,
body.measure-module.comercial-app .badge.proposta_aceita {
  background: rgba(83, 177, 253, 0.15) !important;
  color: var(--status-blue, #53b1fd) !important;
  border-color: rgba(83, 177, 253, 0.35) !important;
}

body.measure-module.comercial-app .badge.badge-recusada,
body.measure-module.comercial-app .badge.recusada,
body.measure-module.comercial-app .badge.badge-proposta_recusada,
body.measure-module.comercial-app .badge.proposta_recusada {
  background: rgba(239, 68, 68, 0.15) !important;
  color: var(--danger, #ef4444) !important;
  border-color: rgba(239, 68, 68, 0.35) !important;
}

body.measure-module.comercial-app .badge.badge-arquivado,
body.measure-module.comercial-app .badge.arquivado {
  background: rgba(139, 92, 246, 0.15) !important;
  color: #a78bfa !important;
  border-color: rgba(139, 92, 246, 0.35) !important;
}