/* NowFinance R3 — linguagem visual clean, corporativa e funcional. */
:root {
  --nf-primary: #0b5cab;
  --nf-primary-strong: #08457f;
  --nf-accent: #0b8f74;
  --nf-bg: #f4f6f8;
  --nf-bg-gradient: #f4f6f8;
  --nf-surface-soft: #f7f9fb;
  --nf-border: #dce2e8;
  --nf-muted: #5f6f82;
  --nf-shadow: 0 2px 8px rgba(15, 23, 42, .05);
  --nf-shadow-soft: 0 1px 3px rgba(15, 23, 42, .045);
  --nf-radius-sm: 6px;
  --nf-radius-md: 9px;
  --nf-radius-lg: 13px;
  --nf-radius-xl: 16px;
  --nf-card-padding: 20px;
  --nf-section-gap: 18px;
  --nf-grid-gap: 14px;
}

html[data-theme="dark"] {
  --nf-bg: #0b1220;
  --nf-bg-gradient: #0b1220;
  --nf-sidebar-bg: #0e1827;
  --nf-surface: #111d2d;
  --nf-surface-soft: #162438;
  --nf-border: #26374c;
  --nf-text: #edf2f7;
  --nf-muted: #9babc0;
  --nf-shadow: 0 2px 8px rgba(0, 0, 0, .18);
  --nf-shadow-soft: 0 1px 3px rgba(0, 0, 0, .16);
}

body {
  background: var(--nf-bg) !important;
  letter-spacing: normal;
}

.app-shell:not(.sidebar-collapsed) { grid-template-columns: 252px minmax(0, 1fr); }
.sidebar {
  padding: 16px !important;
  gap: 12px !important;
  background: var(--nf-sidebar-bg) !important;
  backdrop-filter: none !important;
}
.sidebar-nav { gap: 3px !important; }
.sidebar-nav a {
  min-height: 40px !important;
  padding: 9px 10px !important;
  border-radius: 8px !important;
  font-weight: 550 !important;
}
.sidebar-nav a.is-active {
  background: color-mix(in srgb, var(--nf-primary) 10%, var(--nf-surface)) !important;
  color: var(--nf-primary) !important;
  box-shadow: inset 3px 0 0 var(--nf-primary);
}
.tenant-pill, .version-card {
  border-radius: 10px !important;
  background: var(--nf-surface-soft) !important;
}
.tenant-pill > span {
  background: var(--nf-primary) !important;
  border-radius: 8px !important;
}

.topbar {
  height: 64px !important;
  padding: 0 22px !important;
  background: var(--nf-surface) !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}
.content { padding: 22px !important; }

.card,
.metric-card,
.account-card,
.dashboard-hero,
.module-hero,
.hero-card,
.empty-state,
.taxonomy-card,
.goal-tile,
.notification-card,
.profile-hero,
.quick-actions-strip,
.nf-balance-card,
.smart-finance-hub {
  border-radius: var(--nf-radius-lg) !important;
  border: 1px solid var(--nf-border) !important;
  box-shadow: var(--nf-shadow-soft) !important;
}

:where(.card,.metric-card,.account-card,.dashboard-hero,.module-hero,.hero-card,.empty-state,.taxonomy-card,.goal-tile,.notification-card,.profile-hero,.quick-actions-strip,.nf-balance-card,.smart-finance-hub)::before,
:where(.card,.metric-card,.account-card,.dashboard-hero,.module-hero,.hero-card,.empty-state,.taxonomy-card,.goal-tile,.notification-card,.profile-hero,.quick-actions-strip,.nf-balance-card,.smart-finance-hub)::after {
  display: none !important;
}

.card:hover,
.metric-card:hover,
.account-card:hover {
  border-color: var(--nf-border) !important;
  transform: none !important;
}

.card { padding: var(--nf-card-padding) !important; }
.card-header { margin-bottom: 14px !important; }
.card-header h2 { font-size: 19px !important; letter-spacing: -.25px !important; }

.btn {
  min-height: 40px;
  border-radius: 8px !important;
  padding: 9px 14px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}
.btn:hover { transform: none !important; }
.btn-primary {
  background: var(--nf-primary) !important;
  color: #fff !important;
  box-shadow: none !important;
}
.btn-primary:hover { background: var(--nf-primary-strong) !important; filter: none !important; }
.btn-outline { background: var(--nf-surface) !important; }
.btn-ghost { background: var(--nf-surface-soft) !important; }
.icon-btn {
  border-radius: 8px !important;
  box-shadow: none !important;
}

input, select, textarea {
  border-radius: 8px !important;
  background: var(--nf-surface) !important;
}
input:focus, select:focus, textarea:focus {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--nf-primary) 14%, transparent) !important;
}
.badge { border-radius: 6px !important; font-weight: 600 !important; }
.page-kicker {
  font-size: 11px !important;
  letter-spacing: .08em !important;
  font-weight: 650 !important;
}

.dashboard-order-layout { gap: 16px !important; }
.quick-actions-strip {
  padding: 20px !important;
  background: var(--nf-surface) !important;
}
.quick-actions-strip h1 {
  font-size: clamp(26px, 3vw, 34px) !important;
  letter-spacing: -.7px !important;
}
.isf-pill {
  min-width: 138px !important;
  padding: 12px 14px !important;
  border-radius: 9px !important;
  background: var(--nf-surface-soft) !important;
}
.isf-pill strong { font-size: 22px !important; }

.nf-finance-overview { gap: 14px !important; }
.nf-balance-card {
  min-height: 170px !important;
  padding: 24px !important;
  background: var(--nf-surface) !important;
  color: var(--nf-text) !important;
}
.nf-balance-content > span,
.nf-balance-content > b { color: var(--nf-muted) !important; }
.nf-balance-content > strong {
  color: var(--nf-text) !important;
  font-size: clamp(34px, 5vw, 48px) !important;
}
.nf-balance-chart { opacity: .36 !important; }
.nf-chart-line { stroke: var(--nf-primary) !important; }
.nf-chart-shadow { stroke: color-mix(in srgb, var(--nf-primary) 18%, transparent) !important; }
.nf-summary-tiles { gap: 14px !important; }
.nf-summary-tile { min-height: 148px !important; padding: 18px !important; }
.nf-summary-tile strong { font-size: clamp(24px, 3vw, 30px) !important; }
.metric-card::after { display: none !important; }

.smart-finance-hub {
  padding: 22px !important;
  background: var(--nf-surface) !important;
}
.smart-finance-hub__header h2 { font-size: clamp(24px, 3vw, 30px) !important; }
.smart-finance-metrics { gap: 12px !important; }
.smart-metric,
.smart-next-action,
.smart-briefing-card {
  border-radius: 9px !important;
  background: var(--nf-surface-soft) !important;
  box-shadow: none !important;
}

.profile-hero,
.module-hero,
.dashboard-hero,
.hero-card {
  padding: 20px !important;
  background: var(--nf-surface) !important;
}
.profile-hero h1,
.module-hero h1,
.dashboard-hero h1,
.hero-card h1 {
  font-size: clamp(26px, 3vw, 34px) !important;
  letter-spacing: -.7px !important;
}
.profile-completion-card,
.settings-link-card,
.profile-summary-card,
.profile-account-mode,
.toggle-card {
  border-radius: 9px !important;
  box-shadow: none !important;
}
.settings-link-card {
  background: var(--nf-surface) !important;
  border: 1px solid var(--nf-border) !important;
}
.settings-card-icon { border-radius: 8px !important; }

.progress,
.mini-progress,
.profile-completion-track { border-radius: 4px !important; }
.progress span,
.mini-progress span,
.profile-completion-track i {
  background: var(--nf-primary) !important;
  border-radius: inherit !important;
}

@media (max-width: 900px) {
  .app-shell:not(.sidebar-collapsed) { grid-template-columns: 1fr; }
  .content { padding: 14px !important; padding-bottom: calc(6.5rem + env(safe-area-inset-bottom)) !important; }
  .topbar { padding: 0 12px !important; }
  .quick-actions-strip,
  .profile-hero,
  .module-hero,
  .dashboard-hero,
  .hero-card { padding: 16px !important; }
  .dashboard-status-pills { gap: 8px !important; }
  .isf-pill { min-width: 0 !important; }
}

@media (max-width: 560px) {
  :root { --nf-card-padding: 16px; }
  .nf-balance-card { min-height: 150px !important; }
  .nf-balance-chart { display: none !important; }
  .quick-actions-buttons { gap: 8px !important; }
  .quick-actions-buttons .btn { flex: 1 1 auto; }
}