@import "./_variables.css";
@import "./_reset.css";
@import "./_typography.css";

:root[data-theme="light"] {
  color-scheme: light;
  --finance-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(47, 174, 53, 0.12), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 248, 245, 0.96));
  --finance-shell-border: rgba(15, 23, 42, 0.10);
  --finance-shell-shadow: 0 24px 56px rgba(15, 23, 42, 0.10);
  --finance-surface-bg: rgba(255, 255, 255, 0.90);
  --finance-surface-strong: rgba(255, 255, 255, 0.98);
  --finance-surface-border: rgba(15, 23, 42, 0.10);
  --finance-muted: rgba(71, 85, 105, 0.90);
  --finance-modal-overlay: rgba(15, 23, 42, 0.42);
  --finance-modal-bg: #f4fbf6;
  --finance-modal-section-bg: rgba(255, 255, 255, 0.94);
  --finance-modal-border: rgba(15, 23, 42, 0.12);
  --finance-modal-shadow: 0 28px 72px rgba(15, 23, 42, 0.18);
  --support-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(47, 174, 53, 0.10), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.06), transparent 40%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 249, 246, 0.98));
  --support-shell-border: rgba(15, 23, 42, 0.10);
  --support-shell-shadow: 0 24px 56px rgba(15, 23, 42, 0.10);
  --support-panel-bg: rgba(255, 255, 255, 0.96);
  --support-panel-muted: rgba(247, 250, 248, 0.96);
  --support-panel-border: rgba(15, 23, 42, 0.10);
  --support-thread-bg: rgba(255, 255, 255, 0.84);
  --support-thread-border: rgba(15, 23, 42, 0.08);
  --support-thread-master: rgba(47, 174, 53, 0.08);
  --support-thread-internal: rgba(245, 158, 11, 0.10);
  --support-muted-text: rgba(71, 85, 105, 0.88);
  --support-ink: #0f172a;
  --quality-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(47, 174, 53, 0.14), transparent 48%),
    radial-gradient(90% 120% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 40%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(244, 248, 245, 0.96));
  --quality-shell-border: rgba(15, 23, 42, 0.10);
  --quality-shell-shadow: 0 24px 56px rgba(15, 23, 42, 0.10);
  --quality-panel-bg: rgba(255, 255, 255, 0.88);
  --quality-panel-muted: rgba(247, 250, 248, 0.90);
  --quality-card-bg: rgba(255, 255, 255, 0.94);
  --quality-card-strong: rgba(255, 255, 255, 0.98);
  --quality-card-border: rgba(15, 23, 42, 0.10);
  --quality-card-border-strong: rgba(47, 174, 53, 0.18);
  --quality-thread-bg: rgba(248, 252, 249, 0.90);
  --quality-thread-border: rgba(255, 255, 255, 0.60);
  --quality-input-bg: rgba(255, 255, 255, 0.84);
  --quality-input-border: rgba(148, 163, 184, 0.26);
  --quality-button-bg: rgba(255, 255, 255, 0.76);
  --quality-button-border: rgba(148, 163, 184, 0.20);
  --quality-chip-bg: rgba(47, 174, 53, 0.10);
  --quality-chip-border: rgba(47, 174, 53, 0.18);
  --quality-kicker: rgba(15, 23, 42, 0.64);
  --quality-muted: rgba(71, 85, 105, 0.88);
  --quality-ink: #0f172a;
  --reports-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(47, 174, 53, 0.12), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 248, 245, 0.96));
  --reports-shell-border: rgba(15, 23, 42, 0.10);
  --reports-shell-shadow: 0 24px 56px rgba(15, 23, 42, 0.10);
  --reports-surface-bg: rgba(255, 255, 255, 0.90);
  --reports-surface-strong: rgba(255, 255, 255, 0.98);
  --reports-surface-border: rgba(15, 23, 42, 0.10);
  --reports-muted: rgba(71, 85, 105, 0.90);
  --reports-toolbar-bg: rgba(255, 255, 255, 0.72);
  --reports-toolbar-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.38);
  --reports-pill-bg: rgba(47, 174, 53, 0.10);
  --reports-pill-border: rgba(47, 174, 53, 0.18);
  --reports-table-head: rgba(240, 247, 241, 0.96);
  --reports-table-row-alt: rgba(248, 252, 249, 0.92);
  --reports-table-hover: rgba(47, 174, 53, 0.08);
  --reports-empty-bg: rgba(247, 250, 248, 0.98);
  --reports-print-accent: #1f6b46;
  --pipeline-modal-overlay: rgba(15, 23, 42, 0.34);
  --pipeline-modal-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(247, 250, 248, 0.97));
  --pipeline-modal-border: rgba(15, 23, 42, 0.10);
  --pipeline-modal-shadow: 0 28px 72px rgba(15, 23, 42, 0.18);
  --pipeline-modal-header-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.72));
  --pipeline-modal-section-bg:
    radial-gradient(520px 180px at 15% 0%, rgba(47, 174, 53, 0.06), transparent 60%),
    rgba(255, 255, 255, 0.92);
  --pipeline-modal-muted: rgba(71, 85, 105, 0.88);
  --pipeline-modal-ink: #0f172a;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --brand: #2fae35;
  --brand-dark: #0a5a1d;
  --brand-light: #6edb3a;
  --brand-accent: #c9ff5a;
  --brand-soft: rgba(47, 174, 53, 0.12);
  --surface: #08110f;
  --surface-strong: #0e1916;
  --surface-muted: #13211d;
  --border: rgba(148, 163, 184, 0.18);
  --text-default: #ecf5ef;
  --text-muted: rgba(214, 228, 220, 0.74);
  --shadow-soft: 0 24px 48px rgba(0, 0, 0, 0.34);
  --shadow-strong: 0 18px 34px rgba(0, 0, 0, 0.42);
  --brand-grad-1: rgba(110, 219, 58, 0.18);
  --brand-grad-2: rgba(201, 255, 90, 0.12);
  --brand-ring: rgba(47, 174, 53, 0.24);
  --brand-ring-strong: rgba(201, 255, 90, 0.3);
  --brand-avatar-1: rgba(47, 174, 53, 0.56);
  --brand-avatar-2: rgba(201, 255, 90, 0.2);
  --bs-primary-rgb: 47, 174, 53;

  --menu-bg: rgba(8, 15, 13, 0.9);
  --menu-bg-compact: rgba(8, 15, 13, 0.82);
  --menu-text: #edf6f0;
  --menu-subtext: rgba(214, 228, 220, 0.7);
  --menu-shadow: 0 12px 28px rgba(0, 0, 0, 0.34);
  --menu-shadow-compact: 0 8px 22px rgba(0, 0, 0, 0.3);
  --menu-border: 1px solid rgba(148, 163, 184, 0.14);
  --menu-border-compact: 1px solid rgba(148, 163, 184, 0.16);
  --menu-glow: linear-gradient(180deg, rgba(110, 219, 58, 0.24), rgba(110, 219, 58, 0));
  --menu-pill-bg: rgba(47, 174, 53, 0.14);
  --menu-pill-border: 1px solid rgba(110, 219, 58, 0.22);
  --menu-list-border: 1px solid rgba(148, 163, 184, 0.12);
  --menu-list-shadow: 0 16px 34px rgba(0, 0, 0, 0.22);

  --page-gradient: linear-gradient(180deg, #08110f 0%, #0c1714 46%, #10201b 100%);
  --card-glow: 0 28px 60px rgba(0, 0, 0, 0.34);

  --modal-overlay: rgba(2, 8, 6, 0.72);
  --modal-bg: rgba(10, 18, 15, 0.96);
  --modal-border: rgba(148, 163, 184, 0.18);
  --modal-shadow: 0 30px 90px rgba(0, 0, 0, 0.45);
  --modal-header-bg: rgba(10, 18, 15, 0.92);
  --modal-header-border: rgba(110, 219, 58, 0.18);

  --inicio-bg: #09120f;
  --inicio-paper: rgba(11, 20, 17, 0.92);
  --inicio-ink: #edf5ef;
  --inicio-muted: rgba(214, 228, 220, 0.72);
  --inicio-line: rgba(148, 163, 184, 0.16);
  --inicio-accent: var(--brand);
  --inicio-accent-strong: var(--brand-light);
  --inicio-shadow: 0 14px 32px rgba(0, 0, 0, 0.26);
  --inicio-paper-soft: rgba(15, 24, 21, 0.94);
  --inicio-paper-strong: rgba(13, 23, 20, 0.98);
  --inicio-hero-aura: rgba(110, 219, 58, 0.14);
  --inicio-glow-left: rgba(110, 219, 58, 0.16);
  --inicio-glow-right: rgba(201, 255, 90, 0.10);
  --inicio-border-strong: rgba(148, 163, 184, 0.18);
  --inicio-panel-strong: #08140f;
  --inicio-panel-strong-ink: #f1fbf3;

  --login-bg: #08110f;
  --login-paper: rgba(11, 19, 17, 0.94);
  --login-paper-soft: rgba(15, 24, 21, 0.94);
  --login-ink: #eef6f0;
  --login-muted: rgba(214, 228, 220, 0.72);
  --login-line: rgba(148, 163, 184, 0.18);
  --login-accent: var(--brand);
  --login-accent-strong: var(--brand-dark);
  --login-shadow: 0 26px 56px rgba(0, 0, 0, 0.34);
  --login-spot-1: rgba(110, 219, 58, 0.16);
  --login-spot-2: rgba(201, 255, 90, 0.10);
  --login-shell-highlight: rgba(255, 255, 255, 0.05);
  --login-shell-shadow: 0 36px 90px rgba(0, 0, 0, 0.42);

  --landing-bg: #08110f;
  --landing-paper: rgba(11, 19, 17, 0.94);
  --landing-paper-strong: rgba(13, 23, 20, 0.98);
  --landing-paper-soft: rgba(15, 24, 21, 0.94);
  --landing-ink: #eef6f0;
  --landing-muted: rgba(214, 228, 220, 0.72);
  --landing-line: rgba(148, 163, 184, 0.18);
  --landing-accent: var(--brand);
  --landing-accent-strong: var(--brand-accent);
  --landing-accent-soft: rgba(47, 174, 53, 0.12);
  --landing-shadow: 0 26px 56px rgba(0, 0, 0, 0.34);
  --landing-shadow-strong: 0 22px 48px rgba(0, 0, 0, 0.42);
  --landing-glow-left: rgba(110, 219, 58, 0.16);
  --landing-glow-right: rgba(201, 255, 90, 0.10);
  --landing-hero-aura: rgba(110, 219, 58, 0.16);
  --landing-chip-bg: rgba(255, 255, 255, 0.04);
  --landing-chip-border: rgba(148, 163, 184, 0.18);
  --landing-kicker: rgba(214, 228, 220, 0.7);
  --landing-dark-panel: #08110f;
  --dashboard-shell-bg: linear-gradient(180deg, #08110f 0%, #0b1512 100%);
  --dashboard-shell-spot-1: rgba(110, 219, 58, 0.14);
  --dashboard-shell-spot-2: rgba(201, 255, 90, 0.10);
  --dashboard-card-bg: rgba(11, 20, 17, 0.92);
  --dashboard-card-border: rgba(148, 163, 184, 0.16);
  --dashboard-card-muted: rgba(255, 255, 255, 0.04);
  --dashboard-kpi-ink: rgba(236, 245, 239, 0.98);
  --dashboard-kpi-muted: rgba(214, 228, 220, 0.74);
  --dashboard-table-head: rgba(47, 174, 53, 0.12);
  --dashboard-table-head-border: rgba(110, 219, 58, 0.22);
  --dashboard-hover: rgba(47, 174, 53, 0.08);
  --dashboard-chart-track: rgba(47, 174, 53, 0.16);
  --dashboard-error-bg: rgba(11, 20, 17, 0.98);
  --dashboard-error-border: rgba(110, 219, 58, 0.18);
  --dashboard-error-muted: rgba(214, 228, 220, 0.72);
  --dashboard-error-detail: rgba(255, 255, 255, 0.04);
  --pdv-shell-bg: linear-gradient(180deg, #08110f 0%, #10201b 100%);
  --pdv-spot-1: rgba(110, 219, 58, 0.16);
  --pdv-spot-2: rgba(234, 179, 8, 0.1);
  --pdv-panel-bg: rgba(14, 25, 22, 0.92);
  --pdv-panel-border: rgba(148, 163, 184, 0.16);
  --pdv-panel-muted: rgba(110, 219, 58, 0.08);
  --pdv-line: rgba(148, 163, 184, 0.16);
  --pdv-ink: #ecf5ef;
  --pdv-muted: rgba(214, 228, 220, 0.76);
  --pdv-accent-soft: rgba(110, 219, 58, 0.12);
  --pdv-danger-soft: rgba(248, 113, 113, 0.12);
  --pdv-summary-bg: linear-gradient(180deg, #0c1f17 0%, #08140f 100%);
  --pdv-summary-border: rgba(110, 219, 58, 0.2);
  --pdv-summary-panel: linear-gradient(135deg, rgba(22, 62, 41, 0.96) 0%, rgba(11, 34, 24, 0.96) 100%);
  --pdv-summary-panel-border: rgba(110, 219, 58, 0.18);
  --pdv-summary-chip: rgba(255, 255, 255, 0.05);
  --pdv-summary-chip-border: rgba(110, 219, 58, 0.12);
  --pdv-summary-ink: #f3fff5;
  --pdv-summary-muted: rgba(220, 241, 226, 0.76);
  --pdv-summary-accent: var(--brand);
  --pdv-summary-accent-strong: var(--brand-dark);
  --estoque-shell-bg: linear-gradient(180deg, #08110f 0%, #0d1714 100%);
  --estoque-shell-spot-1: rgba(110, 219, 58, 0.18);
  --estoque-shell-spot-2: rgba(201, 255, 90, 0.10);
  --estoque-card-bg: rgba(11, 20, 17, 0.9);
  --estoque-card-muted: rgba(14, 24, 21, 0.94);
  --estoque-card-strong: rgba(18, 30, 26, 0.98);
  --estoque-card-border: rgba(148, 163, 184, 0.18);
  --estoque-card-border-strong: rgba(148, 163, 184, 0.26);
  --estoque-ink: #eef6f0;
  --estoque-muted: rgba(224, 237, 230, 0.88);
  --estoque-table-head: linear-gradient(180deg, rgba(110, 219, 58, 0.16), rgba(11, 20, 17, 0.96));
  --estoque-hover: rgba(110, 219, 58, 0.08);
  --estoque-accent-soft: rgba(47, 174, 53, 0.12);
  --estoque-accent-soft-strong: rgba(110, 219, 58, 0.18);
  --estoque-focus-ring: rgba(110, 219, 58, 0.18);
  --estoque-danger-soft: rgba(248, 113, 113, 0.12);
  --estoque-inventory-scan-bg: linear-gradient(135deg, rgba(47, 174, 53, 0.16), rgba(18, 30, 26, 0.98));
  --estoque-inventory-stat-bg: rgba(18, 30, 26, 0.94);
  --estoque-inventory-positive: #86efac;
  --estoque-inventory-negative: #fca5a5;
  --estoque-shadow: 0 24px 52px rgba(0, 0, 0, 0.34);
  --agenda-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.16), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 42%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --agenda-shell-border: rgba(148, 163, 184, 0.14);
  --agenda-shell-shadow: 0 28px 56px rgba(0, 0, 0, 0.34);
  --agenda-shell-ink: #edf6f0;
  --agenda-shell-muted: rgba(214, 228, 220, 0.74);
  --agenda-toolbar-bg: rgba(255, 255, 255, 0.04);
  --agenda-toolbar-border: rgba(148, 163, 184, 0.12);
  --agenda-panel-bg: rgba(11, 20, 17, 0.92);
  --agenda-panel-border: rgba(148, 163, 184, 0.14);
  --agenda-panel-muted: rgba(14, 24, 21, 0.96);
  --agenda-chip-bg: rgba(47, 174, 53, 0.12);
  --agenda-chip-border: rgba(110, 219, 58, 0.16);
  --agenda-chip-ink: #d8f6b9;
  --agenda-calendar-day-bg: rgba(13, 24, 20, 0.96);
  --agenda-calendar-day-muted: rgba(23, 34, 30, 0.9);
  --agenda-calendar-event-bg: rgba(47, 174, 53, 0.12);
  --agenda-calendar-event-border: rgba(110, 219, 58, 0.16);
  --agenda-calendar-event-ink: #edf6f0;
  --agenda-calendar-reminder-bg: rgba(120, 53, 15, 0.32);
  --agenda-calendar-reminder-border: rgba(251, 191, 36, 0.24);
  --agenda-calendar-reminder-ink: #fde68a;
  --agenda-modal-bg: rgba(10, 18, 15, 0.98);
  --agenda-modal-border: rgba(148, 163, 184, 0.14);
  --agenda-modal-shadow: 0 30px 80px rgba(0, 0, 0, 0.38);
  --agenda-modal-muted: rgba(214, 228, 220, 0.72);
  --kanban-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.18), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 42%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --kanban-shell-border: rgba(148, 163, 184, 0.14);
  --kanban-shell-shadow: 0 28px 56px rgba(0, 0, 0, 0.34);
  --kanban-shell-ink: #edf6f0;
  --kanban-shell-muted: rgba(214, 228, 220, 0.74);
  --kanban-toolbar-bg: rgba(255, 255, 255, 0.04);
  --kanban-toolbar-border: rgba(148, 163, 184, 0.12);
  --kanban-board-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.08), transparent 52%),
    linear-gradient(180deg, rgba(10, 16, 14, 0.92), rgba(8, 13, 12, 0.90));
  --kanban-board-border: rgba(148, 163, 184, 0.12);
  --kanban-column-bg: rgba(15, 23, 21, 0.92);
  --kanban-column-border: rgba(148, 163, 184, 0.12);
  --kanban-column-head-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.12), transparent 52%),
    rgba(16, 25, 22, 0.92);
  --kanban-card-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.08), transparent 52%),
    linear-gradient(180deg, rgba(12, 19, 17, 0.98), rgba(9, 15, 13, 0.96));
  --kanban-card-border: rgba(148, 163, 184, 0.12);
  --kanban-card-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
  --kanban-chip-bg: rgba(255, 255, 255, 0.04);
  --kanban-chip-border: rgba(148, 163, 184, 0.12);
  --kanban-chip-ink: rgba(214, 228, 220, 0.74);
  --kanban-modal-bg: rgba(10, 18, 15, 0.98);
  --kanban-modal-border: rgba(148, 163, 184, 0.14);
  --kanban-modal-shadow: 0 30px 80px rgba(0, 0, 0, 0.38);
  --finance-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.16), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 42%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --finance-shell-border: rgba(148, 163, 184, 0.14);
  --finance-shell-shadow: 0 28px 56px rgba(0, 0, 0, 0.34);
  --finance-surface-bg: rgba(11, 20, 17, 0.94);
  --finance-surface-strong: rgba(10, 18, 15, 0.98);
  --finance-surface-border: rgba(148, 163, 184, 0.14);
  --finance-muted: rgba(214, 228, 220, 0.74);
  --finance-modal-overlay: rgba(2, 8, 6, 0.78);
  --finance-modal-bg: #0d1714;
  --finance-modal-section-bg: #12201c;
  --finance-modal-border: rgba(148, 163, 184, 0.18);
  --finance-modal-shadow: 0 34px 94px rgba(0, 0, 0, 0.52);
  --support-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.16), transparent 48%),
    radial-gradient(100% 140% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 42%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --support-shell-border: rgba(148, 163, 184, 0.14);
  --support-shell-shadow: 0 28px 56px rgba(0, 0, 0, 0.34);
  --support-panel-bg: rgba(11, 20, 17, 0.94);
  --support-panel-muted: rgba(14, 25, 21, 0.96);
  --support-panel-border: rgba(148, 163, 184, 0.14);
  --support-thread-bg: rgba(12, 22, 18, 0.94);
  --support-thread-border: rgba(148, 163, 184, 0.12);
  --support-thread-master: rgba(47, 174, 53, 0.12);
  --support-thread-internal: rgba(245, 158, 11, 0.12);
  --support-muted-text: rgba(214, 228, 220, 0.74);
  --support-ink: #ecf5ef;
  --quality-shell-bg:
    radial-gradient(120% 150% at 0% 0%, rgba(110, 219, 58, 0.16), transparent 44%),
    radial-gradient(110% 160% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 40%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --quality-shell-border: rgba(148, 163, 184, 0.14);
  --quality-shell-shadow: 0 28px 64px rgba(0, 0, 0, 0.36);
  --quality-panel-bg: rgba(12, 22, 18, 0.92);
  --quality-panel-muted: rgba(11, 20, 17, 0.88);
  --quality-card-bg: rgba(13, 24, 20, 0.94);
  --quality-card-strong: rgba(13, 24, 20, 0.98);
  --quality-card-border: rgba(148, 163, 184, 0.15);
  --quality-card-border-strong: rgba(110, 219, 58, 0.28);
  --quality-thread-bg: rgba(255, 255, 255, 0.04);
  --quality-thread-border: rgba(148, 163, 184, 0.12);
  --quality-input-bg: rgba(9, 16, 14, 0.94);
  --quality-input-border: rgba(148, 163, 184, 0.16);
  --quality-button-bg: rgba(255, 255, 255, 0.04);
  --quality-button-border: rgba(148, 163, 184, 0.16);
  --quality-chip-bg: rgba(110, 219, 58, 0.12);
  --quality-chip-border: rgba(110, 219, 58, 0.22);
  --quality-kicker: rgba(214, 228, 220, 0.68);
  --quality-muted: rgba(214, 228, 220, 0.74);
  --quality-ink: #ecf5ef;
  --contabil-shell-bg:
    radial-gradient(120% 150% at 0% 0%, rgba(110, 219, 58, 0.16), transparent 44%),
    radial-gradient(110% 160% at 100% 0%, rgba(201, 255, 90, 0.10), transparent 40%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --contabil-shell-border: rgba(148, 163, 184, 0.14);
  --contabil-shell-shadow: 0 28px 64px rgba(0, 0, 0, 0.36);
  --contabil-surface-bg: rgba(12, 22, 18, 0.92);
  --contabil-surface-strong: rgba(13, 24, 20, 0.98);
  --contabil-surface-border: rgba(148, 163, 184, 0.15);
  --contabil-muted: rgba(214, 228, 220, 0.72);
  --contabil-kicker-bg: rgba(110, 219, 58, 0.14);
  --contabil-kicker-ink: #d8f6b9;
  --contabil-table-head: rgba(24, 35, 41, 0.98);
  --contabil-table-row-hover: rgba(24, 34, 41, 0.96);
  --contabil-chip-bg: rgba(255, 255, 255, 0.04);
  --contabil-chip-border: rgba(148, 163, 184, 0.12);
  --contabil-chip-ink: rgba(236, 245, 239, 0.82);
  --reports-shell-bg: rgba(11, 20, 17, 0.94);
  --reports-shell-border: rgba(148, 163, 184, 0.16);
  --reports-shell-shadow: 0 28px 64px rgba(0, 0, 0, 0.38);
  --reports-surface-bg: rgba(12, 22, 18, 0.92);
  --reports-surface-strong: rgba(13, 24, 20, 0.98);
  --reports-surface-border: rgba(148, 163, 184, 0.15);
  --reports-muted: rgba(214, 228, 220, 0.72);
  --reports-toolbar-bg: rgba(255, 255, 255, 0.04);
  --reports-toolbar-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --reports-pill-bg: rgba(47, 174, 53, 0.14);
  --reports-pill-border: rgba(110, 219, 58, 0.18);
  --reports-table-head: rgba(24, 42, 33, 0.96);
  --reports-table-row-alt: rgba(16, 30, 24, 0.92);
  --reports-table-hover: rgba(47, 174, 53, 0.12);
  --reports-empty-bg: rgba(13, 24, 20, 0.98);
  --reports-print-accent: #1f6b46;
  --orc-shell-bg: rgba(11, 20, 17, 0.94);
  --orc-shell-border: rgba(148, 163, 184, 0.16);
  --orc-shell-shadow: 0 28px 64px rgba(0, 0, 0, 0.38);
  --orc-surface-bg: rgba(12, 22, 18, 0.92);
  --orc-surface-strong: rgba(13, 24, 20, 0.98);
  --orc-surface-border: rgba(148, 163, 184, 0.15);
  --orc-muted: rgba(214, 228, 220, 0.72);
  --orc-modal-overlay: rgba(2, 8, 6, 0.80);
  --orc-modal-bg: #0d1714;
  --orc-modal-section-bg: #12201c;
  --orc-modal-border: rgba(148, 163, 184, 0.18);
  --orc-modal-shadow: 0 34px 94px rgba(0, 0, 0, 0.52);
  --wa-shell-bg: rgba(11, 20, 17, 0.94);
  --wa-shell-border: rgba(148, 163, 184, 0.16);
  --wa-shell-shadow: 0 28px 64px rgba(0, 0, 0, 0.38);
  --wa-surface-bg: rgba(12, 22, 18, 0.92);
  --wa-surface-strong: rgba(13, 24, 20, 0.98);
  --wa-surface-muted: rgba(17, 29, 24, 0.94);
  --wa-surface-border: rgba(148, 163, 184, 0.15);
  --wa-muted: rgba(214, 228, 220, 0.72);
  --wa-modal-overlay: rgba(2, 8, 6, 0.80);
  --wa-modal-bg: #0d1714;
  --wa-modal-section-bg: #12201c;
  --wa-modal-border: rgba(148, 163, 184, 0.18);
  --wa-modal-shadow: 0 34px 94px rgba(0, 0, 0, 0.52);
  --pcp-shell-bg: linear-gradient(180deg, #08110f 0%, #0b1512 100%);
  --pcp-shell-spot-1: rgba(110, 219, 58, 0.14);
  --pcp-shell-spot-2: rgba(201, 255, 90, 0.10);
  --pcp-modal-bg: rgba(9, 16, 14, 0.98);
  --pcp-modal-strong: rgba(12, 20, 18, 0.98);
  --pcp-modal-border: rgba(148, 163, 184, 0.14);
  --pcp-modal-border-strong: rgba(110, 219, 58, 0.18);
  --pcp-modal-muted: rgba(214, 228, 220, 0.72);
  --pcp-modal-ink: rgba(236, 245, 239, 0.96);
  --pcp-modal-subtle: rgba(47, 174, 53, 0.10);
  --pcp-modal-header-bg: rgba(10, 18, 15, 0.96);
  --pcp-modal-footer-bg: rgba(9, 16, 14, 0.94);
  --pcp-modal-table-head: rgba(47, 174, 53, 0.12);
  --pcp-modal-shadow: 0 30px 80px rgba(0, 0, 0, 0.34);
  --fiscal-layout-surface: rgba(12, 22, 18, 0.98);
  --fiscal-layout-border: rgba(110, 219, 58, 0.16);
  --fiscal-layout-spot: rgba(110, 219, 58, 0.12);
  --fiscal-layout-kicker-bg: rgba(110, 219, 58, 0.14);
  --fiscal-layout-kicker-ink: #d8f6b9;
  --fiscal-layout-badge-bg: rgba(13, 26, 21, 0.9);
  --fiscal-layout-badge-border: rgba(110, 219, 58, 0.16);
  --fiscal-layout-badge-ink: rgba(236, 245, 239, 0.88);
  --fiscal-layout-row-bg: rgba(13, 24, 20, 0.98);
  --fiscal-layout-row-border: rgba(110, 219, 58, 0.14);
  --fiscal-layout-row-spot: rgba(110, 219, 58, 0.1);
  --fiscal-layout-library-group-bg: rgba(13, 24, 20, 0.88);
  --fiscal-layout-library-group-border: rgba(110, 219, 58, 0.14);
  --fiscal-layout-library-summary-bg: rgba(12, 22, 18, 0.96);
  --fiscal-layout-library-summary-hover: rgba(15, 28, 22, 0.98);
  --fiscal-layout-library-summary-ink: #d8f6b9;
  --fiscal-layout-library-summary-muted: rgba(236, 245, 239, 0.72);
  --fiscal-shell-bg:
    radial-gradient(980px 320px at 8% 0%, rgba(37, 211, 102, 0.11), transparent 58%),
    radial-gradient(760px 260px at 100% 0%, rgba(83, 189, 235, 0.08), transparent 56%),
    linear-gradient(180deg, #07110d 0%, #0b1411 100%);
  --fiscal-shell-spot-1: rgba(37, 211, 102, 0.12);
  --fiscal-shell-spot-2: rgba(83, 189, 235, 0.08);
  --fiscal-card-bg: rgba(17, 27, 33, 0.94);
  --fiscal-card-border: rgba(134, 150, 160, 0.18);
  --fiscal-card-shadow: 0 24px 56px rgba(0, 0, 0, 0.34);
  --fiscal-muted: #8696a0;
  --fiscal-kicker-bg: rgba(37, 211, 102, 0.14);
  --fiscal-kicker-ink: #d8f6b9;
  --fiscal-table-head: rgba(24, 35, 41, 0.98);
  --fiscal-table-row-hover: rgba(24, 34, 41, 0.96);
  --fiscal-modal-bg: rgba(11, 20, 17, 0.98);
  --fiscal-modal-section-bg: rgba(17, 27, 33, 0.98);
  --fiscal-modal-border: rgba(134, 150, 160, 0.16);
  --fiscal-modal-shadow: 0 34px 96px rgba(0, 0, 0, 0.44);
  --fiscal-received-shell-bg: rgba(37, 211, 102, 0.16);
  --fiscal-received-panel-bg: rgba(15, 24, 21, 0.98);
  --fiscal-received-filter-bg: rgba(18, 30, 25, 0.94);
  --fiscal-received-filter-chip-bg: rgba(17, 27, 33, 0.96);
  --fiscal-received-filter-chip-border: rgba(110, 219, 58, 0.16);
  --fiscal-received-table-card-bg: rgba(17, 27, 33, 0.98);
  --fiscal-received-table-card-border: rgba(134, 150, 160, 0.20);
  --fiscal-received-table-card-shadow: 0 20px 44px rgba(0, 0, 0, 0.28);
  --fiscal-received-modal-backdrop: rgba(2, 8, 6, 0.64);
  --fiscal-received-xml-bg: rgba(11, 20, 17, 0.98);
  --fiscal-order-shell-bg:
    radial-gradient(760px 220px at 0% 0%, rgba(37, 211, 102, 0.14), transparent 58%),
    linear-gradient(180deg, rgba(8, 15, 13, 0.99), rgba(10, 18, 15, 0.98));
  --fiscal-order-shell-border: rgba(134, 150, 160, 0.18);
  --fiscal-order-shell-shadow: 0 40px 110px rgba(0, 0, 0, 0.5);
  --fiscal-order-topbar-bg: rgba(11, 20, 17, 0.92);
  --fiscal-order-intro-bg:
    linear-gradient(135deg, rgba(13, 24, 19, 0.98), rgba(18, 34, 26, 0.96));
  --fiscal-order-aside-bg: rgba(13, 23, 19, 0.92);
  --fiscal-order-step-bg: rgba(17, 27, 33, 0.9);
  --fiscal-order-step-active-bg: rgba(20, 39, 29, 0.96);
  --fiscal-order-step-complete-bg: rgba(18, 33, 24, 0.94);
  --fiscal-order-summary-bg: rgba(13, 23, 19, 0.94);
  --fiscal-order-section-bg: rgba(17, 27, 33, 0.98);
  --fiscal-order-chip-bg: rgba(11, 20, 17, 0.9);
  --fiscal-order-warn-bg: rgba(71, 52, 14, 0.86);
  --fiscal-order-warn-border: rgba(245, 158, 11, 0.22);
  --fiscal-order-warn-ink: #f7ddb0;

  --lh-bg: #08110f;
  --lh-bg-ink: #eef6f0;
  --lh-bg-soft: rgba(11, 19, 17, 0.94);
  --lh-line: rgba(148, 163, 184, 0.18);
  --lh-primary: #2fae35;
  --lh-primary-ink: #07110f;
  --lh-accent: #c9ff5a;
  --lh-card: rgba(11, 19, 17, 0.94);
  --lh-muted: rgba(214, 228, 220, 0.72);
  --lh-shadow: 0 26px 56px rgba(0, 0, 0, 0.34);

  --fin-card: rgba(11, 20, 17, 0.92);
  --fin-border: rgba(148, 163, 184, 0.16);
  --fin-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);

  --func-card: rgba(11, 20, 17, 0.92);
  --func-border: rgba(148, 163, 184, 0.16);
  --func-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);

  --master-card: rgba(11, 20, 17, 0.92);
  --master-border: rgba(148, 163, 184, 0.16);
  --master-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
  --master-ok: #6edb3a;
  --master-warn: #f3c96b;
  --master-fail: #f18d8d;
  --master-surface-subtle: rgba(255, 255, 255, 0.05);
  --master-surface-strong: rgba(255, 255, 255, 0.08);
  --master-ink-soft: rgba(214, 228, 220, 0.72);
  --master-ink-strong: rgba(236, 245, 239, 0.94);
  --master-overlay: rgba(2, 8, 6, 0.72);
  --admin-shell-bg: linear-gradient(180deg, #08110f 0%, #0b1512 100%);
  --admin-shell-spot-1: rgba(110, 219, 58, 0.14);
  --admin-shell-spot-2: rgba(201, 255, 90, 0.10);
  --admin-card-bg: rgba(11, 20, 17, 0.90);
  --admin-card-muted: rgba(255, 255, 255, 0.04);
  --admin-card-border: rgba(148, 163, 184, 0.16);
  --admin-table-head: rgba(47, 174, 53, 0.10);
  --admin-danger-bg: rgba(127, 29, 29, 0.26);
  --tenant-profile-shell-bg: linear-gradient(180deg, #07110d 0%, #0b1512 100%);
  --tenant-profile-spot-1: rgba(110, 219, 58, 0.16);
  --tenant-profile-spot-2: rgba(201, 255, 90, 0.10);
  --tenant-profile-card-bg: rgba(11, 20, 17, 0.92);
  --tenant-profile-card-muted: rgba(17, 32, 27, 0.92);
  --tenant-profile-border: rgba(148, 163, 184, 0.16);
  --tenant-profile-border-soft: rgba(148, 163, 184, 0.12);
  --tenant-profile-surface: rgba(255, 255, 255, 0.04);
  --tenant-profile-table-head: rgba(47, 174, 53, 0.08);
  --tenant-profile-kicker-bg: rgba(110, 219, 58, 0.12);
  --tenant-profile-kicker-border: rgba(110, 219, 58, 0.24);
  --tenant-profile-kicker-ink: rgba(228, 255, 214, 0.92);
  --tenant-profile-stat-ink: rgba(236, 245, 239, 0.98);

  --rep-card: rgba(11, 20, 17, 0.92);
  --rep-border: rgba(148, 163, 184, 0.16);
  --rep-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);

  --pipe-card: rgba(11, 20, 17, 0.9);
  --pipe-border: rgba(148, 163, 184, 0.16);
  --pipe-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
  --pipe-accent: rgba(47, 174, 53, 0.18);
  --pipeline-shell-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.18), transparent 48%),
    radial-gradient(90% 120% at 100% 0%, rgba(163, 230, 53, 0.10), transparent 40%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.94));
  --pipeline-shell-border: rgba(148, 163, 184, 0.14);
  --pipeline-shell-shadow: 0 28px 56px rgba(0, 0, 0, 0.34);
  --pipeline-shell-ink: #edf6f0;
  --pipeline-shell-muted: rgba(214, 228, 220, 0.74);
  --pipeline-toolbar-bg: rgba(255, 255, 255, 0.04);
  --pipeline-toolbar-border: rgba(148, 163, 184, 0.12);
  --pipeline-toolbar-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --pipeline-board-frame-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.08), transparent 52%),
    linear-gradient(180deg, rgba(10, 16, 14, 0.92), rgba(8, 13, 12, 0.90));
  --pipeline-board-frame-border: rgba(148, 163, 184, 0.12);
  --pipeline-column-bg: rgba(15, 23, 21, 0.92);
  --pipeline-column-border: rgba(148, 163, 184, 0.12);
  --pipeline-column-head-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.12), transparent 52%),
    rgba(16, 25, 22, 0.92);
  --pipeline-column-head-border: rgba(148, 163, 184, 0.12);
  --pipeline-card-bg:
    radial-gradient(120% 160% at 0% 0%, rgba(110, 219, 58, 0.08), transparent 48%),
    linear-gradient(180deg, rgba(17, 26, 23, 0.98), rgba(12, 18, 16, 0.96));
  --pipeline-card-border: rgba(148, 163, 184, 0.12);
  --pipeline-card-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
  --pipeline-pill-bg: rgba(255, 255, 255, 0.05);
  --pipeline-pill-border: rgba(148, 163, 184, 0.12);
  --pipeline-pill-ink: rgba(226, 236, 230, 0.84);
  --pipeline-modal-overlay: rgba(2, 8, 6, 0.68);
  --pipeline-modal-bg:
    radial-gradient(820px 220px at 18% 0%, rgba(110, 219, 58, 0.12), transparent 62%),
    linear-gradient(180deg, rgba(10, 18, 15, 0.98), rgba(9, 16, 14, 0.96));
  --pipeline-modal-border: rgba(110, 219, 58, 0.14);
  --pipeline-modal-shadow: 0 28px 72px rgba(0, 0, 0, 0.42);
  --pipeline-modal-header-bg: linear-gradient(180deg, rgba(10, 18, 15, 0.92), rgba(10, 18, 15, 0.68));
  --pipeline-modal-section-bg:
    radial-gradient(520px 180px at 15% 0%, rgba(110, 219, 58, 0.08), transparent 60%),
    rgba(255, 255, 255, 0.04);
  --pipeline-modal-muted: rgba(214, 228, 220, 0.78);
  --pipeline-modal-ink: #edf6f0;

  --noti-green: #2fae35;
  --noti-green-ink: #eaf7f0;
}

body {
  font-family: "Inter", "Segoe UI", system-ui, sans-serif;
  background:
    radial-gradient(72vw 72vw at -10% -24%, rgba(31, 107, 82, 0.14), transparent 58%),
    radial-gradient(60vw 60vw at 110% -26%, rgba(42, 138, 96, 0.12), transparent 56%),
    linear-gradient(180deg, #f7f8f3 0%, var(--surface) 100%);
  color: var(--text-default);
}

:root[data-theme="dark"] body {
  background:
    radial-gradient(82vw 82vw at -10% -24%, rgba(110, 219, 58, 0.18), transparent 58%),
    radial-gradient(64vw 64vw at 112% -26%, rgba(201, 255, 90, 0.12), transparent 56%),
    linear-gradient(180deg, #06100e 0%, var(--surface) 100%);
  color: var(--text-default);
}

main.page-content {
  width: calc(100% - (var(--page-gutter) * 2));
  max-width: 100%;
  margin: 0 auto;
  padding: clamp(20px, 3vw, 32px) 0 calc(48px + var(--safe-bottom));
  min-width: 0;
}

@media (max-width: 520px) {
  main.page-content { padding: 16px 12px 40px; }
  .page-header { padding-bottom: 12px; }
  .card-body { padding: 12px; }
  .section-title, .page-title { font-size: 18px; }
}

@media (max-width: 420px) {
  :root { --radius-card: 14px; --radius-control: 10px; }
  .card-body { padding: 10px; }
}

@media (max-width: 360px) {
  body { font-size: 14px; }
}

/* ============================================================
   Form validation (global)
   - Per-field error message + subtle red highlight
============================================================ */

.noti-field-error {
  display: none;
  margin-top: -10px;
  margin-bottom: 14px;
  font-size: 12px;
  font-weight: 800;
  color: #b91c1c;
}

.noti-field-error.is-visible {
  display: block;
}

:where(input, select, textarea).noti-input-error {
  border-color: rgba(220, 38, 38, 0.65);
  background: rgba(220, 38, 38, 0.06);
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.14);
}

.noti-btn-loading {
  opacity: 0.85;
  cursor: progress;
}

.page-header {
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 24px;
}

.card.table-card,
.card {
  background: var(--surface-strong);
  border-radius: var(--radius-card);
  border: 1px solid rgba(24, 37, 40, 0.12);
  box-shadow: var(--shadow-soft);
}

.card-body {
  padding: clamp(14px, 2.6vw, 24px);
  min-width: 0;
}

/* Bootstrap overrides (pages that import Bootstrap) */


.btn-primary {
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand-dark);
  --bs-btn-hover-border-color: var(--brand-dark);
  --bs-btn-active-bg: var(--brand-dark);
  --bs-btn-active-border-color: var(--brand-dark);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
  --bs-btn-color: #eaf7f1;
  background: linear-gradient(125deg, var(--brand) 0%, var(--brand-dark) 100%);
  border-color: var(--brand-dark);
  box-shadow: 0 12px 22px var(--brand-soft);
}

.btn-primary:hover,
.btn-primary:focus-visible {
  background: linear-gradient(125deg, var(--brand-light) 0%, var(--brand-dark) 100%);
  border-color: var(--brand-dark);
  box-shadow: 0 14px 24px var(--brand-ring);
}

/* Mobile-friendly: ensure action bars and buttons are usable on small screens */
@media (max-width: 520px) {
  .page-actions,
  .row-actions,
  .section-actions,
  .estoque-actions,
  .kanban-actions,
  .pipeline-actions,
  .card-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    width: 100%;
  }

  /* Make primary and important buttons full-width for easier tapping */
  :where(.btn, .noti-btn, .estoque-btn, button, .btn-primary, .btn-secondary) {
    width: 100%;
    max-width: 100%;
    padding: 12px 14px;
    font-size: 15px;
    border-radius: 12px;
  }

  /* Keep small control buttons (close, small icons) visually separate */
  .noti-close,
  .btn-icon,
  .icon-only,
  .login-password-toggle {
    width: var(--noti-close-size, 40px);
    height: var(--noti-close-size, 40px);
    min-width: var(--noti-close-size, 40px);
    min-height: var(--noti-close-size, 40px);
    max-width: none;
    padding: 0;
    align-self: auto;
  }
  /* Small utility buttons stay compact - don't stretch to full width */
  .btn-sm {
    width: auto;
    max-width: none;
    font-size: .875rem;
    padding: .25rem .625rem;
  }
  /* Master page custom buttons stay compact */
  .master-btn {
    width: auto;
    max-width: none;
    padding: 9px 10px;
    font-size: 13px;
  }

  /* Ensure search inputs and filters don't collapse under buttons */
  .estoque-search,
  .search-wrapper,
  .filter-row {
    width: 100%;
    min-width: 0;
  }
}

.btn-outline-primary {
  --bs-btn-color: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand);
  --bs-btn-hover-border-color: var(--brand);
  --bs-btn-active-bg: var(--brand-dark);
  --bs-btn-active-border-color: var(--brand-dark);
  --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 0.25rem var(--brand-ring);
}

.form-check-input:checked {
  background-color: var(--brand);
  border-color: var(--brand);
}

/* Default polish (Bootstrap + custom UIs) */
.btn,
.form-control,
.form-select,
.input-group-text,
.modal-content {
  border-radius: var(--radius-control);
}

.btn {
  transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast);
}

.btn:focus-visible,
:where(button, [role="button"]):focus-visible,
:where(a, input, select, textarea):focus-visible {
  outline: none;
  box-shadow: 0 0 0 0.25rem var(--brand-ring-strong);
}

.badge {
  border-radius: var(--radius-pill);
}

.table > :not(caption) > * > * {
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
}

:root[data-theme="dark"] .card.table-card,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .table-card,
:root[data-theme="dark"] .filters-card,
:root[data-theme="dark"] .section-card {
  background: var(--surface-strong);
  border-color: var(--border);
  box-shadow: var(--shadow-soft);
}

:root[data-theme="dark"] :where(
  .form-control,
  .form-select,
  .input-group-text,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select,
  textarea
) {
  background: rgba(9, 16, 14, 0.94);
  border-color: rgba(148, 163, 184, 0.16);
  color: var(--text-default);
}

:root[data-theme="dark"] :where(
  .form-control,
  .form-select,
  input,
  select,
  textarea
)::placeholder {
  color: rgba(214, 228, 220, 0.44);
}

:root[data-theme="dark"] .form-check-input {
  background-color: rgba(9, 16, 14, 0.96);
  border-color: rgba(148, 163, 184, 0.24);
}

:root[data-theme="dark"] .btn-outline-secondary,
:root[data-theme="dark"] .btn-outline-dark,
:root[data-theme="dark"] .btn-light {
  --bs-btn-color: var(--text-default);
  --bs-btn-border-color: rgba(148, 163, 184, 0.2);
  --bs-btn-bg: rgba(255, 255, 255, 0.04);
  --bs-btn-hover-color: #07110f;
  --bs-btn-hover-bg: var(--brand-accent);
  --bs-btn-hover-border-color: var(--brand-accent);
  --bs-btn-active-bg: var(--brand);
  --bs-btn-active-border-color: var(--brand);
}

:root[data-theme="dark"] .table {
  --bs-table-color: var(--text-default);
  --bs-table-bg: transparent;
  --bs-table-border-color: rgba(148, 163, 184, 0.12);
  --bs-table-accent-bg: transparent;
  --bs-table-striped-color: var(--text-default);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
  --bs-table-hover-color: var(--text-default);
  --bs-table-hover-bg: rgba(47, 174, 53, 0.08);
}

:root[data-theme="dark"] .table thead th,
:root[data-theme="dark"] .table > :not(caption) > thead > tr > th {
  background: rgba(47, 174, 53, 0.12);
  color: var(--text-default);
  border-bottom-color: rgba(110, 219, 58, 0.22);
}

:root[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(255, 255, 255, 0.03);
}

:root[data-theme="dark"] .dropdown-menu,
:root[data-theme="dark"] .list-group-item,
:root[data-theme="dark"] .popover,
:root[data-theme="dark"] .offcanvas,
:root[data-theme="dark"] .toast,
:root[data-theme="dark"] .pagination .page-link {
  background: var(--surface-strong);
  border-color: var(--border);
  color: var(--text-default);
}

:root[data-theme="dark"] .pagination .page-link:hover,
:root[data-theme="dark"] .pagination .page-link:focus {
  background: rgba(47, 174, 53, 0.12);
  border-color: rgba(110, 219, 58, 0.24);
  color: var(--text-default);
}

:root[data-theme="dark"] .alert-light,
:root[data-theme="dark"] .alert-secondary {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(148, 163, 184, 0.18);
  color: var(--text-default);
}

:root[data-theme="dark"] .bg-light,
:root[data-theme="dark"] .text-bg-light {
  background-color: rgba(255, 255, 255, 0.06);
  color: var(--text-default);
}

:root[data-theme="dark"] .text-muted,
:root[data-theme="dark"] .small.text-muted,
:root[data-theme="dark"] .form-text {
  color: var(--text-muted);
}

:root[data-theme="dark"] .noti-field-error {
  color: #ff9f9f;
}

/* ============================================================
   Modals (Bootstrap + Noti custom)
============================================================ */



@keyframes notiModalFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes notiModalPop {
  from {
    transform: translateY(10px) scale(0.99);
    opacity: 0.75;
  }
  to {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}

/* Custom modal used by some pages (non-Bootstrap) */
.noti-modal {
  position: fixed;
  inset: 0;
  display: none;
  background: var(--modal-overlay);
  padding: calc(18px + var(--safe-top)) 18px calc(18px + var(--safe-bottom));
  z-index: var(--z-pipeline-modal);
  overflow: auto;
  backdrop-filter: blur(2px);
}

.noti-modal.is-open {
  display: block;
  animation: notiModalFadeIn 160ms ease-out;
}

.noti-modal-content {
  max-width: 920px;
  margin: 0 auto;
  background:
    radial-gradient(820px 260px at 18% 0%, var(--brand-grad-1), transparent 62%),
    radial-gradient(720px 240px at 86% 10%, var(--brand-grad-2), transparent 60%),
    var(--modal-bg);
  border: 1px solid var(--modal-border);
  border-radius: var(--modal-radius);
  box-shadow: var(--modal-shadow);
  padding: 18px;
  backdrop-filter: blur(12px);
  max-height: calc(100vh - 36px);
  max-height: calc(100dvh - 36px);
  overflow: auto;
  overscroll-behavior: contain;
  animation: notiModalPop 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.noti-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: -18px -18px 14px;
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--modal-header-bg);
  backdrop-filter: blur(14px);
  padding: 14px 18px 12px;
  border-bottom: 1px solid var(--modal-header-border);
}

.noti-modal-title {
  font-weight: 900;
  color: var(--text-default);
  font-size: 18px;
  letter-spacing: -0.02em;
}

.noti-modal-subtitle {
  color: rgba(15, 23, 42, 0.65);
  font-size: 12px;
  font-weight: 700;
}

.noti-modal-close {
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.noti-modal-close i {
  font-size: 16px;
}

/* Unified "X" close button (used by pipeline + NotiComponents-created Bootstrap modals) */
.noti-close {
  --noti-close-size: 40px;
  --noti-close-bg: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.96) 0%,
    rgba(247, 250, 248, 0.98) 100%
  );
  --noti-close-border: rgba(47, 174, 53, 0.16);
  --noti-close-shadow: 0 8px 18px rgba(15, 23, 42, 0.10);
  --noti-close-icon: color-mix(in srgb, var(--brand-dark) 74%, #173122);
  --noti-close-hover-bg: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
  --noti-close-hover-border: color-mix(in srgb, var(--brand) 76%, white 24%);
  --noti-close-hover-icon: #ffffff;
  --noti-close-hover-tilt: 90deg;
  width: var(--noti-close-size);
  height: var(--noti-close-size);
  min-width: var(--noti-close-size);
  min-height: var(--noti-close-size);
  padding: 0;
  margin: 0;
  border-radius: 999px;
  background: var(--noti-close-bg);
  border: 1px solid var(--noti-close-border);
  box-shadow: var(--noti-close-shadow);
  opacity: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative; /* pseudo X */
  color: transparent; /* X drawn with pseudo elements */
  cursor: pointer;
  overflow: hidden;
  transition:
    transform 0.2s ease,
    background-color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
}

.noti-close:hover {
  background: var(--noti-close-hover-bg);
  border-color: var(--noti-close-hover-border);
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.16);
  filter: saturate(1.05);
}

.noti-close:active {
  transform: scale(0.96);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.14);
}

.noti-close::before,
.noti-close::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 2px;
  background-color: var(--noti-close-icon);
  border-radius: 999px;
  transform-origin: 50% 50%;
  transition:
    background-color 0.25s ease,
    transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.22s ease;
}

.noti-close::before { transform: rotate(45deg); }
.noti-close::after { transform: rotate(-45deg); }

.noti-close:hover::before,
.noti-close:hover::after {
  background-color: var(--noti-close-hover-icon);
}

.noti-close:hover::before {
  transform: rotate(calc(45deg + var(--noti-close-hover-tilt)));
}

.noti-close:hover::after {
  transform: rotate(calc(-45deg + var(--noti-close-hover-tilt)));
}

.noti-close:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--brand-ring-strong), var(--noti-close-shadow);
}

.noti-close span {
  display: none;
}

:root[data-theme="dark"] .noti-close {
  --noti-close-bg: linear-gradient(
    135deg,
    rgba(17, 29, 25, 0.96) 0%,
    rgba(10, 18, 15, 0.98) 100%
  );
  --noti-close-border: rgba(148, 163, 184, 0.22);
  --noti-close-shadow: 0 10px 22px rgba(0, 0, 0, 0.34);
  --noti-close-icon: color-mix(in srgb, var(--brand-accent) 72%, #eefbf1 28%);
  --noti-close-hover-bg: linear-gradient(
    135deg,
    color-mix(in srgb, var(--brand-light) 44%, #163525) 0%,
    color-mix(in srgb, var(--brand) 68%, #0d2419) 100%
  );
  --noti-close-hover-border: rgba(110, 219, 58, 0.32);
  --noti-close-hover-icon: #f4fff5;
}

@media (max-width: 640px) {
  .noti-modal-content {
    padding: 12px;
  }
  .noti-modal-header {
    margin: -12px -12px 10px;
    padding: 12px 12px 10px;
  }
}

/* Bootstrap modal: skin to match Noti modal */
.modal-backdrop.show {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  background: var(--modal-overlay);
  backdrop-filter: blur(2px);
}

.modal.show .modal-dialog {
  animation: notiModalPop 180ms cubic-bezier(0.22, 1, 0.36, 1);
  transform: none;
  box-sizing: border-box;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--z-bootstrap-modal);
  overflow: hidden;
  outline: 0;
  display: none;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  pointer-events: auto;
  border-radius: var(--modal-radius);
  background:
    radial-gradient(820px 260px at 18% 0%, var(--brand-grad-1), transparent 62%),
    radial-gradient(720px 240px at 86% 10%, var(--brand-grad-2), transparent 60%),
    var(--modal-bg);
  border: 1px solid var(--modal-border);
  box-shadow: var(--modal-shadow);
  backdrop-filter: blur(12px);
  max-height: calc(100vh - 80px);
  max-height: calc(100dvh - 80px);
  overflow: hidden;
  box-sizing: border-box;
}

.modal-body {
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
  padding: 1rem;
  box-sizing: border-box;
}

.modal-header {
  background: var(--modal-header-bg);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--modal-header-border);
  position: sticky;
  top: 0;
  z-index: 2;
  flex-shrink: 0;
  box-sizing: border-box;
}

.modal-title {
  font-weight: 900;
  letter-spacing: -0.02em;
}

.modal-footer {
  border-top: 1px solid rgba(15, 23, 42, 0.10);
  flex-shrink: 0;
  position: sticky;
  bottom: 0;
  background: inherit;
  z-index: 2;
  box-sizing: border-box;
}

.btn-close {
  width: 40px;
  height: 40px;
  padding: 0;
  border-radius: 999px;
  opacity: 0.9;
  box-shadow: none;
}

.btn-close:hover {
  opacity: 1;
}

/* ============================================================
   Responsive defaults (global)
============================================================ */

:where(img, video, canvas) {
  max-width: 100%;
  height: auto;
}

/* Avoid layout overflow with long text/IDs */
:where(.page-content, .card, .card-body) {
  overflow-wrap: anywhere;
}

/* Utility: horizontal scroller for wide tables/grids */
.table-scroller {
  width: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Bootstrap helper: smooth horizontal scroll on mobile */
.table-responsive {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Mobile: Indicador visual de scroll horizontal em tabelas */
@media (max-width: 768px) {
  .table-scroller,
  .table-responsive {
    position: relative;
    background:
      linear-gradient(90deg, white 30%, rgba(255,255,255,0)),
      linear-gradient(-90deg, white 30%, rgba(255,255,255,0)),
      linear-gradient(90deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0)),
      linear-gradient(-90deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0));
    background-color: white;
    background-attachment: local, local, scroll, scroll;
    background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
    background-position: left center, right center, left center, right center;
    background-repeat: no-repeat;
  }
}

@media (max-width: 900px) {
  main.page-content {
    padding-bottom: 32px;
  }

  .page-header {
    padding-bottom: 14px;
    margin-bottom: 18px;
  }
}

@media (max-width: 520px) {
  main.page-content {
    width: calc(100% - 24px);
  }
}

/* ============================================================
   Mobile ergonomics (global)
   - Prevent iOS Safari auto-zoom on input focus (>= 16px)
   - Slightly larger tap targets
============================================================ */

@media (max-width: 520px) {
  :where(
    input[type="text"],
    input[type="search"],
    input[type="email"],
    input[type="password"],
    input[type="tel"],
    input[type="url"],
    input[type="number"],
    input[type="date"],
    input[type="datetime-local"],
    input[type="time"],
    select,
    textarea
  ) {
    font-size: 16px;
  }

  :where(button, .btn, [role="button"]) {
    min-height: 44px;
  }

  :where(button, .btn) {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .page-title {
    font-size: 22px;
  }

  /* Bootstrap modals: better on phones */
  .modal-dialog {
    position: relative;
    width: auto;
    margin: auto;
    pointer-events: none;
    box-sizing: border-box;
  }

  /* Modal sizes */
  .modal-sm .modal-dialog {
    max-width: 400px;
  }

  .modal-md .modal-dialog {
    max-width: 600px;
  }

  .modal-lg .modal-dialog {
    max-width: 900px;
  }

  .modal-footer {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    box-sizing: border-box;
  }

  .modal-footer .btn {
    width: 100%;
    box-sizing: border-box;
  }
}

/* Mobile: Max-height em modais para viewports baixos (previne overflow) */
@media (max-width: 520px) and (max-height: 700px) {
  .modal-content,
  .noti-modal-content {
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
  }

  .modal-body,
  .noti-modal-body {
    padding: 1rem;
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    box-sizing: border-box;
  }
}

/* Altura muito baixa (landscape mobile ou telas pequenas) */
@media (max-width: 768px) and (max-height: 500px) {
  .modal-content,
  .noti-modal-content {
    max-height: 90vh;
    box-sizing: border-box;
  }

  .modal-header,
  .noti-modal-header {
    padding: 8px 12px;
    box-sizing: border-box;
  }

  .modal-footer,
  .noti-modal-footer {
    padding: 8px 12px;
    box-sizing: border-box;
  }
}

/* Common page layouts (Bootstrap-like pages + custom dashboards) */
@media (max-width: 680px) {
  .page-header {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .page-actions {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }

  .page-actions > * {
    flex: 0 0 auto;
  }

  .filters-row {
    flex-direction: column;
    align-items: stretch;
  }

  .filters-row > * {
    width: 100%;
    min-width: 0;
  }

  .filters-meta {
    flex-direction: column;
    align-items: flex-start;
  }

  .table-footer {
    flex-direction: column;
    align-items: stretch;
  }
}

  /* Global small-screen defaults: unify tokens and behaviors across pages */
  @media (max-width: 520px) {
    :root {
      --radius-card: 14px;
      --radius-control: 10px;
      --page-gutter: 12px;
    }

    /* Make primary controls full-width ONLY em contextos de formulario/modal,
       nao em tables, inline actions ou toolbars */
    .modal-footer .btn,
    .noti-modal-footer .btn,
    .form-actions .btn {
      width: 100%;
      display: block;
      box-sizing: border-box;
    }

    /* Inputs & selects should expand to container width */
    :where(input, select, textarea, .master-input, .pipeline-input, .form-control) {
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    /* Tables and wide grids get a consistent scroller */
    table, .table, .table-responsive, .table-scroller {
      width: 100%;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
    }

    /* Reduce inner paddings on very small screens to maximize content */
    .card-body, .page-header, .filters-card, .table-card {
      padding: 10px;
    }
  }

  @media (max-width: 420px) {
    :root { --radius-card: 12px; --radius-control: 8px; }
    main.page-content { padding-left: 12px; padding-right: 12px; }
  }

  @media (max-width: 360px) {
    body { font-size: 14px; }
  }

/* ============================================================
   Utility: Esconder colunas nao-essenciais em tabelas mobile
   Uso: <th class="d-none d-md-table-cell">Coluna Secundaria</th>
============================================================ */

/* Desktop: mostrar todas as colunas */
.show-md-table-cell {
  display: none;
}

@media (min-width: 769px) {
  .show-md-table-cell {
    display: table-cell;
  }
}

/* Mobile: esconder colunas marcadas */
@media (max-width: 768px) {
  .d-none.d-md-table-cell {
    display: none;
  }
}

/* Alternativa: classes especificas para viewports */
@media (max-width: 640px) {
  .hide-sm {
    display: none;
  }
}

@media (max-width: 520px) {
  .hide-xs {
    display: none;
  }
}

/* Sticky header para tabelas longas */
@media (min-width: 520px) {
  .sticky-head th {
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--surface-strong);
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.08);
  }
}

/* ============================================================
   Landing visual sync for app pages
============================================================ */

body.has-menu .menu-lateral {
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(31, 107, 82, 0.14), transparent 62%),
    rgba(253, 252, 248, 0.92);
  border-right: 1px solid rgba(24, 37, 40, 0.14);
  box-shadow: 14px 0 40px rgba(17, 39, 31, 0.12);
}

body.has-menu .menu-lateral:hover,
body.has-menu .menu-lateral:focus-within {
  box-shadow: 20px 0 58px rgba(17, 39, 31, 0.18);
}

body.has-menu .menu-profile {
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(31, 107, 82, 0.2);
  box-shadow: 0 10px 24px rgba(17, 39, 31, 0.08);
}

body.has-menu .menu-profile .menu-notif-btn {
  border: 1px solid rgba(31, 107, 82, 0.2);
  background: rgba(255, 255, 255, 0.96);
}

body.has-menu .menu-lista {
  background: rgba(248, 250, 244, 0.7);
  border: 1px solid rgba(24, 37, 40, 0.12);
  box-shadow: 0 12px 28px rgba(17, 39, 31, 0.1);
}

body.has-menu .menu-item a {
  color: rgba(24, 37, 40, 0.86);
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid transparent;
}

body.has-menu .menu-item a:hover {
  color: #173c31;
  background: rgba(31, 107, 82, 0.12);
  border-color: rgba(31, 107, 82, 0.24);
}

body.has-menu .menu-item a.active {
  color: #14372d;
  background: linear-gradient(135deg, rgba(31, 107, 82, 0.22), rgba(31, 107, 82, 0.08));
  border-color: rgba(31, 107, 82, 0.38);
  box-shadow: 0 10px 22px rgba(23, 79, 61, 0.2);
}

body.has-menu .menu-tenant-switcher {
  background: rgba(31, 107, 82, 0.1);
  border: 1px solid rgba(31, 107, 82, 0.18);
}

body.has-menu .menu-tenant-switcher-label {
  color: rgba(24, 37, 40, 0.74);
}

body.has-menu .menu-tenant-switcher-select {
  border: 1px solid rgba(31, 107, 82, 0.2);
  background: rgba(255, 255, 255, 0.9);
  color: rgba(24, 37, 40, 0.92);
}

body.has-menu .menu-tenant-switcher-select:focus {
  border-color: rgba(31, 107, 82, 0.55);
  box-shadow: 0 0 0 3px rgba(31, 107, 82, 0.16);
}

.table thead th,
.table > :not(caption) > thead > tr > th {
  background: rgba(31, 107, 82, 0.08);
  color: #1a3e33;
  border-bottom-color: rgba(31, 107, 82, 0.2);
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(255, 255, 255, 0.55);
}

:root[data-theme="dark"] .menu-lateral,
:root[data-theme="dark"] body.has-menu .menu-lateral {
  background:
    radial-gradient(96% 60% at 0% 0%, rgba(110, 219, 58, 0.18), transparent 62%),
    linear-gradient(180deg, rgba(8, 15, 13, 0.96), rgba(12, 20, 17, 0.94));
  border-right: 1px solid rgba(148, 163, 184, 0.14);
  box-shadow: 16px 0 40px rgba(0, 0, 0, 0.34);
}

:root[data-theme="dark"] .menu-mobile-bar,
:root[data-theme="dark"] .menu-profile,
:root[data-theme="dark"] .menu-profile-popover,
:root[data-theme="dark"] .menu-modal,
:root[data-theme="dark"] .menu-drawer,
:root[data-theme="dark"] .global-search-panel {
  background: rgba(9, 16, 14, 0.92);
  border-color: rgba(148, 163, 184, 0.14);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.34);
}

:root[data-theme="dark"] .menu-lista,
:root[data-theme="dark"] body.has-menu .menu-lista {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(148, 163, 184, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .menu-section-heading {
  color: rgba(203, 213, 225, 0.60);
}

:root[data-theme="dark"] .menu-section-heading::after {
  background: linear-gradient(90deg, rgba(110, 219, 58, 0.28), rgba(110, 219, 58, 0));
}

:root[data-theme="dark"] .menu-section-heading--master {
  color: rgba(201, 255, 90, 0.82);
}

:root[data-theme="dark"] .menu-profile-name,
:root[data-theme="dark"] .menu-modal-title,
:root[data-theme="dark"] .menu-drawer-title,
:root[data-theme="dark"] .global-search-title,
:root[data-theme="dark"] .menu-notif-title,
:root[data-theme="dark"] .menu-notif-msg {
  color: var(--text-default);
}

:root[data-theme="dark"] .menu-profile-role,
:root[data-theme="dark"] .menu-fiscal-quick-subtitle,
:root[data-theme="dark"] .menu-fiscal-quick-search label,
:root[data-theme="dark"] .menu-fiscal-quick-empty,
:root[data-theme="dark"] .menu-fiscal-quick-doc,
:root[data-theme="dark"] .menu-fiscal-quick-meta,
:root[data-theme="dark"] .menu-drawer-subtitle,
:root[data-theme="dark"] .menu-notif-meta,
:root[data-theme="dark"] .global-search-hint,
:root[data-theme="dark"] .global-search-section,
:root[data-theme="dark"] .global-search-empty {
  color: var(--text-muted);
}

:root[data-theme="dark"] .menu-item a,
:root[data-theme="dark"] body.has-menu .menu-item a,
:root[data-theme="dark"] .menu-mobile-btn,
:root[data-theme="dark"] .menu-mobile-brand,
:root[data-theme="dark"] .menu-profile .menu-notif-btn,
:root[data-theme="dark"] .menu-tenant-switcher,
:root[data-theme="dark"] .menu-tenant-switcher-select,
:root[data-theme="dark"] .menu-popover-item,
:root[data-theme="dark"] .menu-fiscal-quick-option,
:root[data-theme="dark"] .menu-fiscal-quick-search-row input,
:root[data-theme="dark"] .menu-fiscal-quick-results,
:root[data-theme="dark"] .menu-fiscal-quick-item,
:root[data-theme="dark"] .menu-icon-btn,
:root[data-theme="dark"] .menu-notif-read-btn,
:root[data-theme="dark"] .menu-notif-loadmore,
:root[data-theme="dark"] .global-search-input,
:root[data-theme="dark"] .global-search-item {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(148, 163, 184, 0.14);
  color: var(--text-default);
}

:root[data-theme="dark"] .menu-item a::before,
:root[data-theme="dark"] body.has-menu .menu-item a::before {
  background: rgba(110, 219, 58, 0.12);
}

:root[data-theme="dark"] .menu-item a:hover,
:root[data-theme="dark"] .menu-popover-item:hover,
:root[data-theme="dark"] .menu-fiscal-quick-option:hover,
:root[data-theme="dark"] .menu-fiscal-quick-option:focus-visible,
:root[data-theme="dark"] .menu-fiscal-quick-item:hover,
:root[data-theme="dark"] .menu-fiscal-quick-item:focus-visible,
:root[data-theme="dark"] .menu-mobile-btn:hover,
:root[data-theme="dark"] .menu-notif-read-btn:hover,
:root[data-theme="dark"] .menu-notif-loadmore:hover,
:root[data-theme="dark"] .global-search-item:hover {
  background: rgba(47, 174, 53, 0.12);
  border-color: rgba(110, 219, 58, 0.24);
  color: var(--text-default);
}

:root[data-theme="dark"] .menu-item a.active,
:root[data-theme="dark"] body.has-menu .menu-item a.active,
:root[data-theme="dark"] .menu-popover-item--theme[aria-pressed="true"] {
  background: linear-gradient(135deg, rgba(47, 174, 53, 0.18), rgba(110, 219, 58, 0.12));
  border-color: rgba(110, 219, 58, 0.28);
  color: var(--text-default);
  box-shadow: 0 12px 22px rgba(0, 0, 0, 0.2);
}

:root[data-theme="dark"] .menu-popover-sep,
:root[data-theme="dark"] .menu-modal-header,
:root[data-theme="dark"] .menu-notif-item,
:root[data-theme="dark"] .menu-notif-loadmore-wrap {
  border-color: rgba(148, 163, 184, 0.12);
  background-color: transparent;
}

:root[data-theme="dark"] .menu-notif-item:hover {
  background: rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .menu-popover-item i,
:root[data-theme="dark"] .menu-icon-btn i,
:root[data-theme="dark"] .menu-mobile-btn i {
  color: var(--brand-accent);
}

:root[data-theme="dark"] .menu-fiscal-quick-tag {
  border-color: rgba(148, 163, 184, 0.16);
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-default);
}

:root[data-theme="dark"] .global-search-overlay,
:root[data-theme="dark"] .menu-overlay,
:root[data-theme="dark"] .menu-nav-overlay,
:root[data-theme="dark"] .menu-modal-overlay {
  background: rgba(2, 8, 6, 0.66);
}

:root[data-theme="dark"] .inicio-tenant-logo-box img {
  background: rgba(9, 16, 14, 0.94);
}

:root[data-theme="dark"] .page-header,
:root[data-theme="dark"] .pipeline-header,
:root[data-theme="dark"] .fin-header,
:root[data-theme="dark"] .master-header,
:root[data-theme="dark"] .vendas-hero {
  border-color: rgba(148, 163, 184, 0.14);
  box-shadow: var(--shadow-soft);
}

:root[data-theme="dark"] .page-header,
:root[data-theme="dark"] .pipeline-header,
:root[data-theme="dark"] .fin-header,
:root[data-theme="dark"] .master-header {
  background:
    radial-gradient(820px 260px at 16% 0%, rgba(110, 219, 58, 0.16), transparent 60%),
    radial-gradient(700px 240px at 86% 10%, rgba(201, 255, 90, 0.1), transparent 56%),
    var(--surface-strong);
}

:root[data-theme="dark"] body.pcp-page .pipeline-header {
  background:
    radial-gradient(820px 260px at 18% 0%, rgba(110, 219, 58, 0.18), transparent 62%),
    radial-gradient(720px 240px at 86% 10%, rgba(201, 255, 90, 0.12), transparent 60%),
    linear-gradient(180deg, rgba(11, 20, 17, 0.94), rgba(11, 20, 17, 0.82));
  border-color: rgba(148, 163, 184, 0.16);
  box-shadow: 0 22px 50px rgba(0, 0, 0, 0.28);
}

:root[data-theme="dark"] body.pcp-page .pipeline-actions {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(148, 163, 184, 0.14);
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.18);
}

:root[data-theme="dark"] .chamados-msg {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(148, 163, 184, 0.12);
}

:root[data-theme="dark"] .chamados-msg--master {
  background: rgba(47, 174, 53, 0.12);
  border-color: rgba(110, 219, 58, 0.24);
}

:root[data-theme="dark"] .chamados-msg-who,
:root[data-theme="dark"] .chamados-msg-body {
  color: var(--text-default);
}

:root[data-theme="dark"] .chamados-msg-when {
  color: var(--text-muted);
}

:root[data-theme="dark"] .vendas-page {
  --vendas-ink: #edf5ef;
  --vendas-muted: rgba(214, 228, 220, 0.72);
  --vendas-line: rgba(148, 163, 184, 0.16);
  --vendas-glass: rgba(11, 20, 17, 0.9);
  --vendas-green: #2fae35;
  --vendas-green-deep: #c9ff5a;
  --vendas-gold: #f3c96b;
  --vendas-mist: #08110f;
}

:root[data-theme="dark"] .vendas-hero {
  background:
    radial-gradient(110% 160% at 0% 0%, rgba(110, 219, 58, 0.18), transparent 55%),
    radial-gradient(100% 100% at 100% 0%, rgba(243, 201, 107, 0.16), transparent 46%),
    linear-gradient(145deg, rgba(11, 20, 17, 0.98), rgba(8, 17, 15, 0.96));
  border-color: rgba(148, 163, 184, 0.14);
  box-shadow:
    0 24px 60px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

:root[data-theme="dark"] .vendas-hero::after {
  background: radial-gradient(circle, rgba(110, 219, 58, 0.16), transparent 70%);
}

@media (max-width: 768px) {
  :root[data-theme="dark"] .menu-mobile-bar {
    background:
      linear-gradient(180deg, rgba(8, 15, 13, 0.96), rgba(10, 18, 15, 0.92)),
      rgba(8, 15, 13, 0.92);
    border-bottom-color: rgba(148, 163, 184, 0.14);
  }

  :root[data-theme="dark"] .menu-lateral {
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.36);
  }
}