/* Fusion+ Professional Console — selected direction 01 */
:root {
  --pro-bg: #070d17;
  --pro-sidebar: #080f1a;
  --pro-surface: #0f1827;
  --pro-surface-2: #121d2d;
  --pro-surface-3: #162235;
  --pro-line: #223149;
  --pro-line-soft: rgba(124, 146, 181, .16);
  --pro-text: #f4f7fb;
  --pro-muted: #91a0b8;
  --pro-pink: #ff4d9d;
  --pro-purple: #945cff;
  --pro-blue: #4f86ff;
  --pro-green: #45df8a;
  --pro-red: #ff5578;
  --pro-orange: #f6a625;
  --pro-radius: 10px;
  --pro-shadow: 0 14px 34px rgba(0, 0, 0, .22);
  --bg: var(--pro-bg);
  --panel: var(--pro-surface);
  --panel-2: var(--pro-surface-2);
  --line: var(--pro-line);
  --ink: var(--pro-text);
  --muted: var(--pro-muted);
  --brand-pink: var(--pro-pink);
}

html {
  color-scheme: dark;
  background: var(--pro-bg);
}

body {
  min-width: 0 !important;
  background:
    radial-gradient(circle at 72% -18%, rgba(55, 91, 151, .13), transparent 34%),
    linear-gradient(180deg, #080f1a 0%, var(--pro-bg) 48%, #060b13 100%) !important;
  color: var(--pro-text) !important;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 14px;
}

button,
input,
select,
textarea {
  font-family: inherit !important;
}

.shell {
  display: block !important;
  min-width: 0 !important;
  min-height: 100vh !important;
  background: transparent !important;
}

.shell aside {
  position: fixed !important;
  inset: 0 auto 0 0 !important;
  z-index: 120 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 216px !important;
  min-width: 216px !important;
  height: 100vh !important;
  padding: 0 12px 132px !important;
  overflow: hidden auto !important;
  background: linear-gradient(180deg, rgba(8, 15, 26, .99), rgba(6, 12, 21, .99)) !important;
  border: 0 !important;
  border-right: 1px solid var(--pro-line) !important;
  box-shadow: none !important;
}

.shell main {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 100vh !important;
  margin: 0 0 0 216px !important;
  padding: 0 22px 34px !important;
  background: transparent !important;
}

.shell.sidebar-collapsed aside {
  width: 76px !important;
  min-width: 76px !important;
}

.shell.sidebar-collapsed main {
  margin-left: 76px !important;
}

.brand {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 82px !important;
  margin: 0 0 10px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pro-line-soft) !important;
  background: transparent !important;
}

.brand-mark {
  display: grid !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  place-items: center !important;
  border: 1px solid rgba(255, 77, 157, .38) !important;
  border-radius: 9px !important;
  background: linear-gradient(145deg, rgba(148, 92, 255, .18), rgba(255, 77, 157, .12)) !important;
  box-shadow: none !important;
  color: var(--pro-pink) !important;
}

.brand-text {
  min-width: 0 !important;
}

.brand-text strong {
  color: var(--pro-text) !important;
  font-size: 19px !important;
  font-weight: 820 !important;
  letter-spacing: -.02em !important;
}

.brand-text strong::after {
  content: "" !important;
}

.brand-mark span {
  margin: 0 !important;
  color: var(--pro-pink) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
}

.brand-mark img {
  border-radius: 8px !important;
  object-fit: contain !important;
}

.brand-text span {
  color: var(--pro-muted) !important;
  font-size: 10px !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

.nav-title {
  margin: 12px 12px 7px !important;
  color: #6f7c91 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.nav-btn {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 42px !important;
  margin: 1px 0 !important;
  padding: 0 12px !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #aeb8ca !important;
  font-size: 13px !important;
  font-weight: 630 !important;
  text-align: left !important;
}

.nav-btn:hover {
  border-color: rgba(134, 153, 184, .16) !important;
  background: rgba(255, 255, 255, .035) !important;
  color: var(--pro-text) !important;
  transform: none !important;
}

.nav-btn.active,
.nav-btn.is-active,
.nav-btn[aria-current="page"] {
  border-color: rgba(255, 77, 157, .24) !important;
  background: linear-gradient(90deg, rgba(255, 77, 157, .17), rgba(148, 92, 255, .08)) !important;
  color: #ff7db6 !important;
  box-shadow: inset 3px 0 0 var(--pro-pink) !important;
}

.nav-btn.active::after {
  display: none !important;
}

.nav-icon {
  display: grid !important;
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  place-items: center !important;
  color: currentColor !important;
}

.nav-icon svg {
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.65 !important;
}

.sidebar-toggle {
  position: fixed !important;
  z-index: 122 !important;
  top: auto !important;
  right: auto !important;
  left: 12px !important;
  bottom: 18px !important;
  width: 192px !important;
  height: 40px !important;
  min-height: 40px !important;
  border: 1px solid var(--pro-line) !important;
  border-radius: 8px !important;
  background: rgba(15, 24, 39, .92) !important;
  box-shadow: none !important;
  color: var(--pro-muted) !important;
  font-size: 17px !important;
}

.shell.sidebar-collapsed .sidebar-toggle {
  width: 52px !important;
}

.topbar {
  position: relative !important;
  z-index: 30 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 20px !important;
  min-height: 102px !important;
  margin: 0 -22px 18px !important;
  padding: 20px 22px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pro-line-soft) !important;
  background: rgba(7, 13, 23, .88) !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px);
}

.topbar h1 {
  margin: 0 !important;
  color: var(--pro-text) !important;
  font-size: clamp(26px, 2.2vw, 34px) !important;
  font-weight: 820 !important;
  letter-spacing: -.035em !important;
  line-height: 1.08 !important;
  text-transform: none !important;
}

.topbar-subtitle {
  margin: 7px 0 0 !important;
  color: var(--pro-muted) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

.toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  max-width: 930px !important;
  padding: 0 !important;
  flex-wrap: wrap !important;
}

.toolbar button,
.toolbar select,
.toolbar .control,
.parent-period-button,
.sync-btn,
.pending-payable-btn {
  min-height: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  border: 1px solid var(--pro-line) !important;
  border-radius: 8px !important;
  background: rgba(13, 22, 35, .84) !important;
  box-shadow: none !important;
  color: #d6deeb !important;
  font-size: 12px !important;
  font-weight: 680 !important;
}

.toolbar button:hover,
.toolbar select:hover {
  border-color: #3a4d68 !important;
  background: var(--pro-surface-2) !important;
  transform: none !important;
}

.dashboard-period-controls {
  order: 20 !important;
  display: flex !important;
  flex: 0 0 100% !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.tabs.period-quick {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.toolbar .period-quick .seg,
.toolbar .parent-period-button {
  min-width: auto !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 17px !important;
  border: 1px solid #34363d !important;
  border-radius: 8px !important;
  background: rgba(12, 15, 21, .92) !important;
  color: #aeb2bb !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 720 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.toolbar .dashboard-period-controls .reseller-scope-filter {
  width: 224px !important;
  min-width: 224px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 38px 0 17px !important;
  border: 1px solid #34363d !important;
  border-radius: 8px !important;
  background-color: rgba(12, 15, 21, .92) !important;
  color: #e4e8f0 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 720 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.toolbar .dashboard-period-controls .reseller-scope-filter:hover,
.toolbar .dashboard-period-controls .reseller-scope-filter:focus {
  border-color: #4a4d56 !important;
  background-color: rgba(18, 23, 32, .98) !important;
  color: #fff !important;
  outline: none !important;
}

.toolbar .period-quick .seg:hover,
.toolbar .parent-period-button:hover {
  border-color: #4a4d56 !important;
  background: rgba(18, 23, 32, .98) !important;
  color: #f4f6fb !important;
}

.toolbar .period-quick .seg.active,
.toolbar .parent-period-button.active {
  border-color: #eb0cba !important;
  background: #e600b7 !important;
  color: #fff !important;
  box-shadow: none !important;
}

.toolbar .parent-period-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.toolbar .parent-period-button svg {
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
}

.sync-btn .sync-dot {
  box-shadow: none !important;
}

.pending-payable-btn strong {
  color: var(--pro-text) !important;
}

.icon-btn {
  width: 42px !important;
  padding: 0 !important;
  font-size: 16px !important;
}

.local-server-warning {
  border-radius: var(--pro-radius) !important;
}

.view {
  min-width: 0 !important;
}

.view:not(.active) {
  display: none !important;
}

main .panel,
main .card,
main .kpi,
main .modal,
.dashboard-command-card,
.auth-panel,
.loop-filter-drawer {
  border: 1px solid var(--pro-line) !important;
  border-radius: var(--pro-radius) !important;
  background: linear-gradient(145deg, rgba(18, 29, 45, .96), rgba(13, 22, 35, .98)) !important;
  box-shadow: var(--pro-shadow) !important;
}

main .panel:hover,
main .kpi:hover,
.dashboard-command-card:hover {
  border-color: #334560 !important;
  transform: translateY(-1px) !important;
}

.panel-header,
.panel-head,
.statement-head {
  min-height: 50px !important;
  padding: 13px 16px !important;
  border-bottom: 1px solid var(--pro-line-soft) !important;
  background: transparent !important;
}

.panel-title,
.panel-head h2,
.statement-head h2 {
  color: var(--pro-text) !important;
  font-size: 15px !important;
  font-weight: 760 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
}

.panel-note,
.muted,
.note {
  color: var(--pro-muted) !important;
}

#operacao.view.active {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 358px) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

body .shell main #operacao.view:not(.active) {
  display: none !important;
}

#operacao > .parent-alert-center,
#operacao > .dashboard-surface,
#operacao > .dashboard-secondary-insights {
  grid-column: 1 / -1 !important;
}

#operacao > .dashboard-surface {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#operacao > .dashboard-surface > .panel-header {
  display: none !important;
}

#operacao .dashboard-grid,
#operacao .kpi-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
}

#operacao .dashboard-grid .kpi {
  position: relative !important;
  min-width: 0 !important;
  min-height: 122px !important;
  grid-column: auto !important;
  padding: 16px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#operacao .dashboard-grid .kpi::after {
  content: "" !important;
  position: absolute !important;
  right: 12px !important;
  bottom: 11px !important;
  left: 56px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, currentColor) !important;
  opacity: .52 !important;
}

#operacao .dashboard-grid .kpi:nth-child(4),
#operacao .dashboard-grid .kpi:nth-child(6),
#operacao .dashboard-grid .kpi:nth-child(8),
#operacao .dashboard-grid .kpi:nth-child(9) {
  display: none !important;
}

#operacao .dashboard-grid .kpi:nth-child(5) {
  order: 4 !important;
}

#operacao .dashboard-grid .kpi:nth-child(7) {
  order: 5 !important;
}

.kpi-head {
  align-items: flex-start !important;
  gap: 10px !important;
}

.kpi .name {
  color: var(--pro-muted) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.kpi .metric {
  margin-top: 10px !important;
  color: var(--pro-text) !important;
  font-size: clamp(20px, 1.65vw, 27px) !important;
  font-weight: 760 !important;
  letter-spacing: -.025em !important;
  line-height: 1.05 !important;
}

.kpi .delta {
  margin-top: 9px !important;
  color: var(--pro-green) !important;
  font-size: 11px !important;
}

.kpi-icon {
  width: 44px !important;
  height: 44px !important;
  flex: 0 0 44px !important;
  border-width: 1px !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .025) !important;
  box-shadow: none !important;
}

.dashboard-insights {
  display: contents !important;
}

.dashboard-insights > .panel:first-child {
  grid-column: 1 !important;
  grid-row: 2 / span 2 !important;
  min-height: 458px !important;
  margin: 0 !important;
}

.dashboard-insights > .top-plan-panel {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-height: 218px !important;
  margin: 0 !important;
}

.dashboard-command-center {
  grid-column: 2 !important;
  grid-row: 3 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  min-height: 226px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  overflow: hidden !important;
  border: 1px solid var(--pro-line) !important;
  border-radius: var(--pro-radius) !important;
  background: linear-gradient(145deg, rgba(18, 29, 45, .96), rgba(13, 22, 35, .98)) !important;
  box-shadow: var(--pro-shadow) !important;
}

.dashboard-command-center::before {
  content: "Resumo do período" !important;
  display: flex !important;
  align-items: center !important;
  min-height: 48px !important;
  border-bottom: 1px solid var(--pro-line-soft) !important;
  color: var(--pro-text) !important;
  font-size: 15px !important;
  font-weight: 760 !important;
}

.dashboard-command-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-content: center !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 9px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pro-line-soft) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.dashboard-command-card:last-child {
  border-bottom: 0 !important;
}

.dashboard-command-card::before,
.dashboard-command-card::after {
  display: none !important;
}

.dashboard-command-card span {
  color: #dfe5ef !important;
  font-size: 12px !important;
  font-weight: 680 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.dashboard-command-card strong {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  margin: 0 0 0 12px !important;
  color: var(--pro-orange) !important;
  font-size: 16px !important;
  font-weight: 780 !important;
}

.dashboard-command-card.good strong {
  color: var(--pro-green) !important;
}

.dashboard-command-card small {
  margin-top: 3px !important;
  color: var(--pro-muted) !important;
  font-size: 10px !important;
}

.dashboard-finance-chart {
  min-height: 385px !important;
  padding: 16px !important;
}

.dashboard-chart-shell {
  min-height: 240px !important;
  border-color: transparent !important;
  background: transparent !important;
}

.dashboard-secondary-insights {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 0 !important;
}

.dashboard-secondary-insights > .panel {
  margin: 0 !important;
}

table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

th {
  height: 42px !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--pro-line) !important;
  background: rgba(8, 15, 26, .36) !important;
  color: #91a0b8 !important;
  font-size: 10px !important;
  font-weight: 760 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
}

td {
  min-height: 44px !important;
  padding: 11px 12px !important;
  border-bottom: 1px solid var(--pro-line-soft) !important;
  color: #dbe2ee !important;
  font-size: 12px !important;
}

tbody tr:hover {
  background: rgba(255, 255, 255, .025) !important;
}

.status,
.status-toggle,
.badge {
  border-radius: 999px !important;
  box-shadow: none !important;
}

.control,
input,
select,
textarea,
.manual-entry-control {
  min-height: 40px !important;
  border: 1px solid var(--pro-line) !important;
  border-radius: 8px !important;
  background: #0b1422 !important;
  box-shadow: none !important;
  color: var(--pro-text) !important;
}

input:focus,
select:focus,
textarea:focus,
button:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid rgba(255, 77, 157, .78) !important;
  outline-offset: 2px !important;
}

.action-btn.primary,
.auth-submit,
.modal-actions .primary {
  border-color: var(--pro-pink) !important;
  background: var(--pro-pink) !important;
  box-shadow: none !important;
  color: #fff !important;
}

.modal,
.auth-panel,
.loop-entry-modal {
  border-radius: 12px !important;
}

@media (max-width: 1260px) {
  .toolbar {
    max-width: 720px !important;
  }

  #operacao {
    grid-template-columns: minmax(0, 1fr) 310px !important;
  }

  #operacao .dashboard-grid,
  #operacao .kpi-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1080px) {
  .shell aside {
    width: 76px !important;
    min-width: 76px !important;
    padding-inline: 10px !important;
  }

  .shell main,
  .shell.sidebar-expanded main {
    margin-left: 76px !important;
  }

  .brand {
    justify-content: center !important;
    padding-inline: 0 !important;
  }

  .brand-text,
  .nav-title,
  .nav-label {
    display: none !important;
  }

  .nav-btn {
    justify-content: center !important;
    padding-inline: 0 !important;
  }

  .sidebar-toggle {
    width: 52px !important;
  }

  .topbar {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  .toolbar {
    justify-content: flex-start !important;
    max-width: none !important;
  }

  #operacao {
    grid-template-columns: 1fr !important;
  }

  #operacao > *,
  .dashboard-insights > .panel:first-child,
  .dashboard-insights > .top-plan-panel,
  .dashboard-command-center {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  .dashboard-command-center {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dashboard-command-center::before {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 760px) {
  body {
    font-size: 13px !important;
  }

  .shell aside,
  .shell.sidebar-expanded aside,
  .shell.sidebar-collapsed aside {
    inset: auto 0 0 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 70px !important;
    padding: 8px 10px !important;
    overflow: hidden auto !important;
    border: 0 !important;
    border-top: 1px solid var(--pro-line) !important;
    border-right: 0 !important;
  }

  .brand,
  .nav-title,
  .sidebar-toggle {
    display: none !important;
  }

  .nav-btn {
    flex: 0 0 50px !important;
    width: 50px !important;
    min-height: 50px !important;
    margin: 0 2px !important;
    padding: 0 !important;
  }

  .shell main,
  .shell.sidebar-expanded main,
  .shell.sidebar-collapsed main {
    margin-left: 0 !important;
    padding: 0 12px 88px !important;
  }

  .topbar {
    min-height: 0 !important;
    margin: 0 -12px 14px !important;
    padding: 16px 12px !important;
  }

  .topbar h1 {
    font-size: 26px !important;
  }

  .toolbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  .toolbar > *,
  .toolbar .control,
  .parent-period-shell {
    min-width: 0 !important;
    width: 100% !important;
  }

  .toolbar .icon-btn {
    width: 100% !important;
  }

  .dashboard-period-controls {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }

  .toolbar .period-quick {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  .toolbar .period-quick .seg,
  .toolbar .parent-period-button,
  .toolbar .dashboard-period-controls .reseller-scope-filter {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
  }

  #operacao .dashboard-grid,
  #operacao .kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #operacao .dashboard-grid .kpi {
    min-height: 112px !important;
    padding: 12px !important;
  }

  #operacao .dashboard-grid .kpi:nth-child(7) {
    grid-column: 1 / -1 !important;
  }

  .dashboard-command-center,
  .dashboard-secondary-insights {
    grid-template-columns: 1fr !important;
  }

  .dashboard-command-center::before {
    grid-column: 1 !important;
  }

  .dashboard-finance-chart {
    min-height: 300px !important;
    padding: 10px !important;
  }

  .panel-header,
  .panel-head,
  .statement-head {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  .table-wrap {
    max-width: calc(100vw - 24px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Specificity guard for the legacy theme's final dashboard rules. */
body .shell aside .brand {
  opacity: 1 !important;
  filter: none !important;
  color: #f4f7fb !important;
  -webkit-text-fill-color: currentColor !important;
}

body .shell aside .brand .brand-mark,
body .shell aside .brand .brand-mark.has-logo,
body .shell aside .brand #brandMark {
  display: grid !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  place-items: center !important;
}

body .shell aside .brand .brand-mark.has-logo img {
  display: none !important;
}

body .shell aside .brand .brand-mark.has-logo span {
  display: block !important;
}

body .shell aside .brand #brandMark > span {
  display: block !important;
  color: var(--pro-pink) !important;
  -webkit-text-fill-color: var(--pro-pink) !important;
}

body .shell aside .brand .brand-text {
  display: block !important;
  opacity: 1 !important;
}

body .shell aside .brand #brandName {
  color: #f4f7fb !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #f4f7fb !important;
}

body .shell main #operacao .dashboard-chart-label {
  display: none !important;
}

@media (min-width: 1100px) {
  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }

  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi,
  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi:nth-child(n) {
    grid-column: auto !important;
  }

  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi:nth-child(4),
  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi:nth-child(6),
  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi:nth-child(8),
  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi:nth-child(9) {
    display: none !important;
  }

  body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid.kpi-grid > .kpi .metric {
    overflow: visible !important;
    font-size: 16px !important;
    white-space: nowrap !important;
  }
}

/* Refinamento visual — filtros globais e financeiro (11/08/2026). */
.topbar {
  align-items: center !important;
}

.topbar .toolbar {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  grid-template-areas: "status filters actions" !important;
  align-items: center !important;
  gap: 10px !important;
  width: min(100%, 1040px) !important;
  max-width: 1040px !important;
  flex: 1 1 760px !important;
}

.topbar .toolbar-status {
  grid-area: status !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.topbar .dashboard-period-controls {
  grid-area: filters !important;
  order: initial !important;
  display: flex !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

.topbar .toolbar-actions {
  grid-area: actions !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.topbar .toolbar-status .sync-btn,
.topbar .toolbar-status .pending-payable-btn {
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  box-shadow: none !important;
}

.topbar .toolbar-status .pending-payable-btn strong {
  font-size: 12px !important;
}

.topbar .toolbar .period-quick .seg,
.topbar .toolbar .parent-period-button,
.topbar .toolbar .dashboard-period-controls .reseller-scope-filter {
  height: 36px !important;
  min-height: 36px !important;
  font-size: 12px !important;
}

.topbar .toolbar .period-quick .seg {
  padding: 0 11px !important;
}

.topbar .toolbar .parent-period-button {
  padding: 0 12px !important;
}

.topbar .toolbar .dashboard-period-controls .reseller-scope-filter {
  width: 192px !important;
  min-width: 192px !important;
  padding-left: 12px !important;
}

.topbar .toolbar-actions .icon-btn {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
}

#operacao .dashboard-grid .kpi::after {
  content: none !important;
  display: none !important;
}

#operacao .dashboard-grid .kpi .metric {
  font-size: clamp(20px, 1.45vw, 23px) !important;
}

#operacao .dashboard-grid .kpi-icon {
  color: #aeb8c7 !important;
  border-color: rgba(174, 184, 199, .28) !important;
  background: rgba(174, 184, 199, .07) !important;
  box-shadow: none !important;
}

#operacao .dashboard-grid .kpi:nth-child(2) .kpi-icon,
#operacao .dashboard-grid .kpi:nth-child(3) .kpi-icon {
  color: #ff7b85 !important;
  border-color: rgba(255, 123, 133, .34) !important;
  background: rgba(255, 123, 133, .08) !important;
}

#operacao .dashboard-grid .kpi:nth-child(5) .kpi-icon {
  color: #f0bd61 !important;
  border-color: rgba(240, 189, 97, .34) !important;
  background: rgba(240, 189, 97, .08) !important;
}

/* A folha legada usa seletores de alta especificidade para os ícones. */
body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid .kpi .kpi-icon {
  color: #aeb8c7 !important;
  border-color: rgba(174, 184, 199, .28) !important;
  background: rgba(174, 184, 199, .07) !important;
  box-shadow: none !important;
}

body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid .kpi:nth-child(1) .kpi-icon,
body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid .kpi:nth-child(2) .kpi-icon {
  color: #62d9a5 !important;
  border-color: rgba(98, 217, 165, .3) !important;
  background: rgba(98, 217, 165, .08) !important;
}

body .shell main #operacao.view.active > .dashboard-surface .dashboard-grid .kpi:nth-child(3) .kpi-icon {
  color: #ff7886 !important;
  border-color: rgba(255, 120, 134, .32) !important;
  background: rgba(255, 120, 134, .08) !important;
}

#carteira .finance-workspace {
  gap: 16px !important;
}

#carteira .finance-tabs {
  display: flex !important;
  grid-template-columns: none !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  overflow-x: auto !important;
  scrollbar-width: thin;
}

#carteira .finance-tab {
  flex: 1 0 0 !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

#carteira .finance-summary-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

#carteira .finance-summary-grid > :nth-child(-n + 3) {
  grid-column: span 2 !important;
}

#carteira .finance-summary-grid > :nth-child(n + 4) {
  grid-column: span 3 !important;
}

@media (max-width: 1440px) {
  .topbar {
    align-items: flex-start !important;
    flex-direction: column !important;
  }

  .topbar .toolbar {
    flex: 0 1 auto !important;
    width: 100% !important;
    max-width: none !important;
  }
}

@media (max-width: 1140px) {
  .topbar .toolbar {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "status actions" "filters filters" !important;
  }

  #carteira .finance-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #carteira .finance-summary-grid > :nth-child(n) {
    grid-column: span 1 !important;
  }
}

@media (max-width: 760px) {
  .topbar .toolbar {
    grid-template-columns: 1fr auto !important;
    grid-template-areas: "status actions" "filters filters" !important;
  }

  .topbar .toolbar-status {
    min-width: 0 !important;
    width: auto !important;
  }

  .topbar .toolbar-actions {
    width: auto !important;
  }

  .topbar .toolbar-actions .icon-btn {
    width: 36px !important;
  }

  .topbar .toolbar-status .sync-btn,
  .topbar .toolbar-status .pending-payable-btn {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .topbar .dashboard-period-controls {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .topbar .dashboard-period-controls .period-quick {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .topbar .toolbar .dashboard-period-controls .reseller-scope-filter,
  .topbar .toolbar .parent-period-button {
    width: 100% !important;
    min-width: 0 !important;
  }

  #carteira .finance-tab {
    flex: 0 0 auto !important;
    min-width: 138px !important;
  }

  #carteira .finance-summary-grid {
    grid-template-columns: 1fr !important;
  }
}