/* ============================================================
   REINS — MINIMALIST THEME
   Color palette purge & CSS custom properties
   ============================================================ */

/* ─── NEW DESIGN SYSTEM VARIABLES ─── */
:root {
  /* Colors */
  --color-black:   #000;
  --color-white:   #fff;
  --color-gray-100: #fafafa;
  --color-gray-200: #e0e0e0;
  --color-gray-500: #888;
  --color-gray-800: #333;
  --color-accent:  #ff6b35;       /* Primary CTA and critical alerts only */
  --color-success: #2d8a4e;       /* Thin borders only */
  --color-danger:  #c0392b;       /* Thin borders only */
  --color-warning: #d4a017;       /* Thin borders only */
  --border:        1px solid var(--color-gray-200);
  --border-strong: 1px solid var(--color-black);

  /* ─── TYPOGRAPHY SYSTEM ─── */
  /* Primary font: Inter - clean, minimalist sans-serif */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  /* Monospace: JetBrains Mono for data values */
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', monospace;

  /* Type scale - minimalist, light weights */
  --text-xs:    11px;
  --text-sm:    13px;
  --text-base:  15px;
  --text-lg:    17px;
  --text-xl:    22px;
  --text-2xl:   28px;
  --text-3xl:   36px;
  --text-4xl:   44px;

  /* Font weights - light and clean */
  --font-light:   300;
  --font-regular: 400;
  --font-medium: 500;

  /* Line heights */
  --leading-tight: 1.2;
  --leading-normal: 1.5;
  --leading-relaxed: 1.75;

  /* Letter spacing - generous for headings */
  --tracking-tight:  -0.03em;
  --tracking-normal: 0;
  --tracking-wide:   0.05em;

  /* ─── REMAP OLD DARK-MODE VARIABLES TO LIGHT EQUIVALENTS ─── */
  /* Existing code that uses var(--bg-primary) etc. automatically gets light values */
  --bg-primary:    var(--color-white);
  --bg-secondary:  var(--color-gray-100);
  --bg-card:       var(--color-white);
  --bg-card-hover: var(--color-gray-100);

  --accent:        var(--color-accent);
  --accent-dim:    rgba(255, 107, 53, 0.08);
  --accent-glow:   rgba(255, 107, 53, 0.15);
  --accent-strong: rgba(255, 107, 53, 0.25);

  --text-primary:   var(--color-black);
  --text-secondary: var(--color-gray-500);
  --text-dim:       var(--color-gray-500);

  --border-color:  var(--color-gray-200);
  --border-hover:  var(--color-gray-200);
  --glass:         var(--color-gray-100);
  --glass-border:  var(--color-gray-200);

  --red:           var(--color-danger);
  --red-dim:       rgba(192, 57, 43, 0.08);
  --green:         var(--color-success);
  --green-dim:     rgba(45, 138, 78, 0.08);
  --yellow:        var(--color-warning);
  --yellow-dim:    rgba(212, 160, 23, 0.08);
  --blue:          #2255bb;
  --blue-dim:      rgba(34, 85, 187, 0.08);
}

/* ─── THEME TRANSITION: 200ms smooth on background-color and color ─── */
html, body {
  transition: background-color 200ms ease, color 200ms ease;
}

/* ─── GLOBAL TYPOGRAPHY ─── */
html, body {
  font-family: var(--font-sans);
  font-weight: var(--font-regular);
  font-size: 15px;
  line-height: var(--leading-normal);
  color: var(--color-black);
  background: var(--color-white) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings: thin, light weight, generous letter-spacing */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-sans);
  font-weight: var(--font-light);
  color: var(--color-black);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-tight);
}

h1 { font-size: var(--text-4xl); }
h2 { font-size: var(--text-3xl); }
h3 { font-size: var(--text-2xl); }
h4 { font-size: var(--text-xl); }
h5 { font-size: var(--text-lg); }
h6 { font-size: var(--text-base); }

/* Body text: regular weight, clean gray or black */
p {
  font-weight: var(--font-regular);
  color: var(--color-gray-800);
  line-height: var(--leading-relaxed);
}

/* Links */
a {
  color: var(--color-black);
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

/* Monospace for data values (transaction amounts, IDs, API keys) */
code, pre, .mono, .code-block, .kbd {
  font-family: var(--font-mono);
  font-weight: var(--font-regular);
}

/* ─── GLOBAL RESETS ─── */
html, body {
  background: var(--color-white) !important;
  color:      var(--color-black) !important;
}

/* Kill cinematic / parallax background gradients */
body::before,
body::after {
  display: none !important;
}

/* ─── NOISE / GRAIN OVERLAYS — REMOVE ─── */
.noise-overlay,
.glow-float,
.parallax-orb {
  display: none !important;
}

/* ─── NAVIGATION — LIGHT ─── */
nav {
  background:    rgba(255, 255, 255, 0.95) !important;
  border-bottom: 1px solid var(--color-gray-200) !important;
  backdrop-filter:         blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
nav.scrolled {
  background:       rgba(255, 255, 255, 0.98) !important;
  border-bottom-color: var(--color-gray-200) !important;
}
nav a,
nav span,
.nav-links a,
.nav-links button {
  color: var(--color-black) !important;
}
.nav-tag {
  background: var(--color-gray-100) !important;
  border:     1px solid var(--color-gray-200) !important;
  color:      var(--color-gray-500) !important;
}

/* ─── GLASSMORPHISM CARDS — CLEAN WHITE ─── */
.glass-card {
  background:              var(--color-white) !important;
  backdrop-filter:         none !important;
  -webkit-backdrop-filter: none !important;
  border:                  1px solid var(--color-gray-200) !important;
}
.glass-card::before,
.glass-card::after {
  display: none !important;
}

/* ─── SECTION BACKGROUNDS ─── */
section,
.section,
header,
footer {
  background: var(--color-white);
}

/* Alternate section shading (light gray instead of dark) */
.section-alt,
.bg-secondary {
  background: var(--color-gray-100) !important;
}

/* ─── SIDEBAR / DASHBOARD CHROME ─── */
.sidebar,
.sidebar-nav,
.app-shell,
.app-sidebar {
  background:    var(--color-white) !important;
  border-right:  1px solid var(--color-gray-200) !important;
}

.sidebar a,
.sidebar-link,
.sidebar-nav a {
  color: var(--color-gray-800) !important;
}
.sidebar a:hover,
.sidebar-link:hover,
.sidebar a.active,
.sidebar-link.active {
  background: var(--color-gray-100) !important;
  color:      var(--color-black) !important;
}

/* ─── CARDS / PANELS ─── */
.card,
.panel,
.stat-card,
.widget,
.modal-content,
.dropdown-menu,
.popover {
  background:   var(--color-white) !important;
  border:       1px solid var(--color-gray-200) !important;
  box-shadow:   none !important;
  border-radius: 0 !important;
}

/* ─── MODALS ─── */
.modal-backdrop,
.overlay-backdrop {
  background: rgba(0,0,0,0.4) !important;
}

/* ─── INPUTS / FORMS ─── */
input,
textarea,
select {
  background:   var(--color-white) !important;
  border:       1px solid var(--color-gray-200) !important;
  color:        var(--color-black) !important;
}
input::placeholder,
textarea::placeholder {
  color: var(--color-gray-500) !important;
}
input:focus,
textarea:focus,
select:focus {
  border-color: var(--color-black) !important;
  outline: none;
}

/* ─── TABLES ─── */
table {
  border-collapse: collapse;
  width: 100%;
}
th {
  background:   transparent !important;
  color:        var(--color-gray-800) !important;
  border-bottom: 1px solid #000 !important;
  font-weight:  400 !important;
  text-transform: uppercase;
  font-size:    11px !important;
  letter-spacing: 0.5px;
  padding:      12px 16px !important;
  text-align:   left !important;
}
td {
  border-bottom: 1px solid var(--color-gray-200) !important;
  color:         var(--color-gray-800) !important;
  padding:       14px 16px !important;
}
tr:hover td {
  background: #fafafa !important;
}

/* ─── BADGES / STATUS ─── */
.badge-approved,
.badge-success,
.status-approved {
  background:   transparent !important;
  color:        var(--color-success) !important;
  border:       1px solid var(--color-success) !important;
  border-radius: 0 !important;
}
.badge-blocked,
.badge-danger,
.status-blocked {
  background:   transparent !important;
  color:        var(--color-danger) !important;
  border:       1px solid var(--color-danger) !important;
  border-radius: 0 !important;
}
.badge-flagged,
.badge-warning,
.status-flagged {
  background:   transparent !important;
  color:        var(--color-warning) !important;
  border:       1px solid var(--color-warning) !important;
  border-radius: 0 !important;
}

/* ─── MINIMALIST BUTTONS ─── */
/* Primary CTA: solid black fill with white text */
.btn-primary,
button[type="submit"],
.cta-btn,
.waitlist-btn {
  background:   var(--color-black) !important;
  color:        var(--color-white) !important;
  border:       1px solid var(--color-black) !important;
  box-shadow:   none !important;
  border-radius: 0 !important;
  transition:  background 0.1s, color 0.1s !important;
  padding:     12px 24px !important;
  font-family: var(--font-sans) !important;
  font-size:   15px !important;
  font-weight: 500 !important;
}

/* Primary button hover: invert (black bg → white bg, black border) */
.btn-primary:hover,
button[type="submit"]:hover,
.cta-btn:hover,
.waitlist-btn:hover {
  background:   var(--color-white) !important;
  color:        var(--color-black) !important;
  border:       1px solid var(--color-black) !important;
  box-shadow:   none !important;
  transform:    none !important;
}

/* Secondary buttons: outlined style (1px black border, no fill) */
.btn-secondary,
.btn-ghost,
.btn-add-rule,
.auth-btn,
.skip-btn,
.copy-btn,
.generate-btn,
.copy-curl-btn,
.scenario-btn,
.seed-btn,
.refresh-btn,
.copy-api-btn,
.sticky-btn,
.org-btn,
.hamburger-btn,
.tx-page-btn,
.go-dashboard-btn {
  background:   transparent !important;
  color:        var(--color-black) !important;
  border:       1px solid var(--color-black) !important;
  box-shadow:   none !important;
  border-radius: 0 !important;
  transition:  background 0.1s, color 0.1s !important;
  padding:     12px 24px !important;
  font-family: var(--font-sans) !important;
  font-size:   15px !important;
  font-weight: 500 !important;
}

/* Secondary button hover: invert */
.btn-secondary:hover,
.btn-ghost:hover,
.btn-add-rule:hover,
.auth-btn:hover,
.skip-btn:hover,
.copy-btn:hover,
.generate-btn:hover,
.copy-curl-btn:hover,
.scenario-btn:hover,
.seed-btn:hover,
.refresh-btn:hover,
.copy-api-btn:hover,
.sticky-btn:hover,
.org-btn:hover,
.hamburger-btn:hover,
.tx-page-btn:hover,
.go-dashboard-btn:hover {
  background:   var(--color-black) !important;
  color:        var(--color-white) !important;
  border:       1px solid var(--color-black) !important;
  box-shadow:   none !important;
  transform:    none !important;
}

/* Remove colored button styles */
.btn-stop,
#logoutBtn,
#logoutBtnMobile {
  background:   transparent !important;
  color:        var(--color-black) !important;
  border:       1px solid var(--color-black) !important;
}

/* ─── GRADIENT DIVIDERS — REPLACE WITH FLAT LINE ─── */
.section-divider {
  background: var(--color-gray-200) !important;
  opacity:    1 !important;
}

/* ─── DEMO BANNER ─── */
.demo-banner {
  background: var(--color-accent) !important;
  color:      var(--color-white) !important;
}

/* ─── TOUR TOOLTIP ─── */
.tour-tooltip {
  background:   var(--color-white) !important;
  border:       1px solid var(--color-black) !important;
  box-shadow:   none !important;
  border-radius: 0 !important;
}
.tour-tooltip h4 {
  color: var(--color-black) !important;
}
.tour-tooltip p {
  color: var(--color-gray-800) !important;
}
.tour-btn-next {
  background: var(--color-accent) !important;
  color:      var(--color-white) !important;
}
.tour-highlight {
  box-shadow: 0 0 0 9999px rgba(0,0,0,0.5) !important;
}

/* ─── TOAST NOTIFICATIONS ─── */
.toast,
.notification {
  background:   var(--color-white) !important;
  border:       1px solid var(--color-gray-200) !important;
  color:        var(--color-black) !important;
  box-shadow:   none !important;
  border-radius: 0 !important;
}

/* ─── CODE / MONO ─── */
code, pre, .mono, .code-block {
  background: var(--color-gray-100) !important;
  color:      var(--color-gray-800) !important;
  border:     1px solid var(--color-gray-200) !important;
}

/* ─── HOVER LIFT — NO GLOW ─── */
.hover-lift:hover {
  transform:  translateY(-2px) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
}

/* ─── STICKY CTA BAR ─── */
.sticky-cta,
.cta-bar {
  background:   var(--color-white) !important;
  border-top:   1px solid var(--color-gray-200) !important;
  border-bottom: none !important;
  box-shadow:   none !important;
}

/* ─── SCROLLBAR (minimalist) ─── */
/* WebKit (Chrome, Safari, Edge) */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: var(--color-gray-100);
}
::-webkit-scrollbar-thumb {
  background: var(--color-gray-500);
  /* Square thumb - no border-radius */
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-gray-800);
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--color-gray-500) var(--color-gray-100);
}

/* ─── TEXT SELECTION (inverted monochrome) ─── */
::selection {
  background: var(--color-black);
  color: var(--color-white);
}
::-moz-selection {
  background: var(--color-black);
  color: var(--color-white);
}

/* ─── DECORATIVE ORBS / HERO GLOWS — REMOVE ─── */
.hero-orb,
.hero-orb-1,
.hero-orb-2,
.hero-glow,
.orb,
.bg-orb {
  display: none !important;
}

/* ─── COMPARISON TABLE — HIGHLIGHTED COLUMN ─── */
/* Replace accent-tinted column backgrounds with clean white */
.table-col.highlighted,
.col-reins,
[data-highlight="true"],
.highlight-col {
  background: var(--color-white) !important;
  border-left:  1px solid var(--color-black) !important;
  border-right: 1px solid var(--color-black) !important;
}

/* vs-page highlighted card gradient override */
.compare-table td.highlight,
.compare-table th.highlight,
.vs-col.reins {
  background: var(--color-gray-100) !important;
}

/* ─── PRICING / SECTION ACCENT TINTS — NEUTRALIZE ─── */
/* Remove very-low-opacity accent gradients from section backgrounds */
.pricing-teaser,
.comparison-articles {
  background: transparent !important;
}

/* Any section/div using an inline accent gradient */
[style*="rgba(255,107,53,0.03)"],
[style*="rgba(255, 107, 53, 0.03)"],
[style*="rgba(255,107,53,0.025)"],
[style*="rgba(255, 107, 53, 0.025)"] {
  background: transparent !important;
}

/* ─── NAV DASHBOARD LINK ─── */
.nav-dashboard {
  background: var(--color-gray-100) !important;
  border: 1px solid var(--color-gray-200) !important;
  color: var(--color-accent) !important;
}
.nav-dashboard:hover {
  background: var(--color-gray-200) !important;
}

/* ─── HERO SECTION ─── */
.hero,
#hero {
  background: var(--color-white) !important;
}

/* ─── FOOTER ─── */
footer {
  background: #fff !important;
  border-top: 1px solid #000 !important;
  color: #999 !important;
  padding: 64px 48px 80px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 24px !important;
  font-size: 12px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
footer a {
  color: #000 !important;
  text-decoration: none !important;
  margin: 0 6px !important;
}
footer a:hover {
  text-decoration: underline !important;
  color: #000 !important;
}
.footer-credit {
  font-size: 11px;
  color: #bbb;
  font-weight: 300;
}
@media (max-width: 768px) {
  footer {
    padding: 40px 24px 60px !important;
    flex-direction: column !important;
    gap: 16px !important;
    text-align: center !important;
    align-items: center !important;
  }
}

/* ══════════════════════════════════════════════════════════════
   DARK MODE — OPT-IN FOR DASHBOARD
   Dark grays (#1a1a1a, #2a2a2a) not pure black
   ══════════════════════════════════════════════════════════════ */

[data-theme="dark"] {
  /* Override base colors */
  --color-black:   #e0e0e0;
  --color-white:   #1a1a1a;
  --color-gray-100: #2a2a2a;
  --color-gray-200: #3a3a3a;
  --color-gray-500: #999;
  --color-gray-800: #ccc;

  /* Typography in dark mode */
  --bg-primary:    #1a1a1a;
  --bg-secondary:  #2a2a2a;
  --bg-card:       #1a1a1a;
  --bg-card-hover: #2a2a2a;

  --text-primary:   #e0e0e0;
  --text-secondary: #999;
  --text-dim:       #999;

  --border-color:  #3a3a3a;
  --border-hover:  #4a4a4a;
  --glass:         #2a2a2a;
  --glass-border:  #3a3a3a;

  /* Accent colors stay the same (orange accent works on dark) */
  --accent-dim:    rgba(255, 107, 53, 0.15);
  --accent-glow:   rgba(255, 107, 53, 0.25);
  --accent-strong: rgba(255, 107, 53, 0.35);

  --red-dim:       rgba(192, 57, 43, 0.15);
  --green-dim:     rgba(45, 138, 78, 0.15);
  --yellow-dim:    rgba(212, 160, 23, 0.15);
  --blue-dim:      rgba(34, 85, 187, 0.15);
}

/* Dark mode: page background */
[data-theme="dark"] html,
[data-theme="dark"] body {
  background: #1a1a1a !important;
  color: #e0e0e0 !important;
}

/* Dark mode: nav */
[data-theme="dark"] nav {
  background:    rgba(26, 26, 26, 0.98) !important;
  border-bottom: 1px solid #3a3a3a !important;
}

[data-theme="dark"] nav.scrolled {
  background:       rgba(26, 26, 26, 0.99) !important;
  border-bottom-color: #3a3a3a !important;
}

[data-theme="dark"] nav a,
[data-theme="dark"] nav span,
[data-theme="dark"] .nav-links a,
[data-theme="dark"] .nav-links button {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .nav-tag {
  background: #2a2a2a !important;
  border:     1px solid #3a3a3a !important;
  color:      #999 !important;
}

/* Dark mode: sidebar */
[data-theme="dark"] .sidebar,
[data-theme="dark"] .sidebar-nav,
[data-theme="dark"] .app-shell,
[data-theme="dark"] .app-sidebar {
  background:    #1a1a1a !important;
  border-right:  1px solid #3a3a3a !important;
}

[data-theme="dark"] .sidebar a,
[data-theme="dark"] .sidebar-link,
[data-theme="dark"] .sidebar-nav a {
  color: #ccc !important;
}

[data-theme="dark"] .sidebar a:hover,
[data-theme="dark"] .sidebar-link:hover,
[data-theme="dark"] .sidebar a.active,
[data-theme="dark"] .sidebar-link.active {
  background: #2a2a2a !important;
  color:      #e0e0e0 !important;
}

/* Dark mode: cards */
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .widget,
[data-theme="dark"] .modal-content,
[data-theme="dark"] .dropdown-menu,
[data-theme="dark"] .popover,
[data-theme="dark"] .glass-card {
  background:   #1a1a1a !important;
  border:       1px solid #3a3a3a !important;
}

/* Dark mode: inputs */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background:   #2a2a2a !important;
  border:       1px solid #3a3a3a !important;
  color:        #e0e0e0 !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #777 !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
  border-color: #e0e0e0 !important;
}

/* Dark mode: tables */
[data-theme="dark"] th {
  color:        #ccc !important;
  border-bottom: 1px solid #3a3a3a !important;
}

[data-theme="dark"] td {
  border-bottom: 1px solid #3a3a3a !important;
  color:         #ccc !important;
}

[data-theme="dark"] tr:hover td {
  background: #2a2a2a !important;
}

/* Dark mode: code */
[data-theme="dark"] code,
[data-theme="dark"] pre,
[data-theme="dark"] .mono,
[data-theme="dark"] .code-block {
  background: #2a2a2a !important;
  color:      #ccc !important;
  border:     1px solid #3a3a3a !important;
}

/* Dark mode: section alt */
[data-theme="dark"] .section-alt,
[data-theme="dark"] .bg-secondary {
  background: #2a2a2a !important;
}

/* Dark mode: scrollbar */
[data-theme="dark"] ::-webkit-scrollbar-track {
  background: #2a2a2a;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #555;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #777;
}

/* Dark mode: selection */
[data-theme="dark"] ::selection {
  background: #e0e0e0;
  color: #1a1a1a;
}

/* Dark mode: toast */
[data-theme="dark"] .toast,
[data-theme="dark"] .notification {
  background:   #2a2a2a !important;
  border:       1px solid #3a3a3a !important;
  color:        #e0e0e0 !important;
}

/* Dark mode toggle button */
.theme-toggle {
  background: transparent;
  border: 1px solid #3a3a3a;
  color: #e0e0e0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 18px;
  transition: background 0.1s, color 0.1s;
}

.theme-toggle:hover {
  background: #2a2a2a;
}

[data-theme="light"] .theme-toggle {
  color: #333;
  border-color: #ddd;
}

[data-theme="light"] .theme-toggle:hover {
  background: #f0f0f0;
}

/* ══════════════════════════════════════════════════════════════
   TASK #797097 — ULTRA-MINIMALIST: Cards, Badges & Status
   ══════════════════════════════════════════════════════════════ */

/* ─── ZERO BORDER-RADIUS ON ALL INTERACTIVE / UI ELEMENTS ─── */
button,
input, select, textarea,
.badge, .tag, .pill, .chip,
.modal, .modal-content,
.dropdown, .dropdown-menu, .org-dropdown, .org-dropdown-item,
.org-btn,
.toast, .notification,
.stat-tooltip, .chart-bar-tooltip, .trend-bar-tooltip,
.tx-popover-card, .tx-popover .tx-popover-card,
.tour-tooltip, .tour-btn, .tour-highlight,
.seed-btn,
.btn-primary, .btn-ghost, .btn-add-rule,
.tx-filter, .tx-page-btn, .period-btn,
.rule-type-badge, .action-badge, .status-badge, .policy-badge,
.tx-status, .alert-type-badge, .anomaly-badge, .anomaly-item,
.alert-icon,
.agent-avatar,
.filter-pill,
.scroll-to-top,
.skel, .skeleton,
.hamburger-btn, .refresh-btn,
.nav-tab, .nav-drawer-tab, .nav-drawer-tab,
.utilization-bar, .utilization-fill,
.policy-bar, .policy-bar-fill,
.chart-bar,
.trend-bar, .forecast-bar,
.kbd-hint kbd,
.rule-btn, .rule-edit-btn,
.pricing-badge,
.tx-status-dot,
.rules-stats,
.skel-avatar-sq,
.rules-toggle-slider,
.form-group input, .form-group select {
  border-radius: 0 !important;
}

/* ─── REMOVE BOX-SHADOWS ─── */
.toast, .notification,
.stat-tooltip,
.chart-bar-tooltip, .trend-bar-tooltip,
.tx-popover-card,
.org-dropdown,
.modal,
.filter-pill,
.pricing-badge,
.tour-tooltip {
  box-shadow: none !important;
}

/* ─── STATIC BADGES: NO PULSE OR GLOW ANIMATIONS ─── */
.test-result-badge,
.test-result-badge.blocked,
.test-result-badge.flagged,
.test-result-badge.warned,
.alert-badge .count,
.alert-badge .count.pulse {
  animation: none !important;
}

/* ─── RULE/ACTION/STATUS BADGES: OUTLINE STYLE ─── */
/* Replace colored fills with thin 1px border + very subtle bg */
.rule-type-badge.per_transaction_cap,
.rule-type-badge.daily_cap,
.rule-type-badge.weekly_cap,
.rule-type-badge.monthly_cap,
.rule-type-badge.vendor_block,
.rule-type-badge.agent_spend_cap,
.rule-type-badge.vendor_spend_cap,
.rule-type-badge.transaction_max {
  border-radius: 0 !important;
}

.action-badge.block {
  background: rgba(192, 57, 43, 0.06) !important;
  border: 1px solid var(--color-danger) !important;
  color: var(--color-danger) !important;
}
.action-badge.flag {
  background: rgba(212, 160, 23, 0.06) !important;
  border: 1px solid var(--color-warning) !important;
  color: var(--color-warning) !important;
}
.action-badge.warn {
  background: rgba(212, 160, 23, 0.06) !important;
  border: 1px solid var(--color-warning) !important;
  color: var(--color-warning) !important;
}

.status-badge.active {
  background: rgba(45, 138, 78, 0.06) !important;
  border: 1px solid var(--color-success) !important;
  color: var(--color-success) !important;
}
.status-badge.paused {
  background: rgba(136, 136, 136, 0.06) !important;
  border: 1px solid var(--color-gray-500) !important;
  color: var(--color-gray-500) !important;
}

/* ─── TREND BARS: FLAT SOLID COLOR ─── */
.trend-bar {
  background: var(--color-accent) !important;
  opacity: 0.7;
}
.trend-bar:hover {
  opacity: 1 !important;
}
.forecast-bar {
  background: var(--color-success) !important;
  opacity: 0.4 !important;
}

/* ─── PRICING BADGE: MONOCHROME SQUARE ─── */
.pricing-badge {
  background: #000 !important;
  color: #fff !important;
  border: 1px solid #000 !important;
  padding: 4px 12px !important;
}

/* ─── TRUSTED-BY SECTION: CLEAN WHITE ─── */
.trusted-by {
  background: var(--color-white) !important;
  border-top: 1px solid var(--color-gray-200) !important;
  border-bottom: 1px solid var(--color-gray-200) !important;
}

/* ─── TOOLTIP ARROW: KEEP POINTER SHAPE ─── */
/* stat-tooltip arrow ::after/::before are transparent-border tricks, leave as-is */

/* ─── LANDING PAGE: MONOCHROME TRUST BADGES / LOGOS ─── */
.logo-icon {
  color: var(--color-gray-800) !important;
}
.trusted-by-logo {
  color: var(--color-black) !important;
  opacity: 0.55 !important;
}
.trusted-by-logo:hover {
  opacity: 1 !important;
}

/* ─── LANDING PAGE: TRUST BADGE — THIN BLACK BORDER ─── */
.trust-badge {
  border: 1px solid var(--color-black) !important;
  border-radius: 0 !important;
  color: var(--color-black) !important;
}

/* ─── LANDING PAGE: FLOW BADGE — ALREADY SQUARE, NO CHANGES NEEDED ─── */

/* ─── LANDING PRICING CTA — SQUARE ─── */
.pricing-cta {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ─── MODAL BACKDROP — SIMPLER OVERLAY ─── */
.modal-overlay[style*="backdrop-filter"] {
  backdrop-filter: none;
}

/* ─── REMOVE GRADIENT FROM SECTION DIVIDER ─── */
.section-divider {
  background: var(--color-gray-200) !important;
  opacity: 1 !important;
}

/* ─── DEMO BANNER LINK — SQUARE ─── */
.demo-banner a {
  border-radius: 0 !important;
}

/* ─── SCROLL TO TOP — SQUARE ─── */
.scroll-to-top {
  border-radius: 0 !important;
}

/* ══════════════════════════════════════════════════════════════
   ADDITIONAL ULTRA-MINIMALIST OVERRIDES
   ══════════════════════════════════════════════════════════════ */

/* ─── CARDS — NO BORDER-RADIUS ─── */
.card {
  border-radius: 0 !important;
}

/* ─── TREND BARS — SQUARE ─── */
.trend-bar {
  border-radius: 0 !important;
  background: var(--color-accent) !important;
}
.trend-bar-tooltip {
  border-radius: 0 !important;
}
.period-btn {
  border-radius: 0 !important;
}

/* ─── FORECAST BARS — SQUARE ─── */
.forecast-bar {
  border-radius: 0 !important;
  background: var(--color-success) !important;
  opacity: 0.5 !important;
}

/* ─── ANOMALY BADGES — SQUARE ─── */
.anomaly-badge {
  border-radius: 0 !important;
}
.anomaly-item {
  border-radius: 0 !important;
}

/* ─── CHART BARS — SQUARE ─── */
.chart-bar {
  border-radius: 0 !important;
}
.chart-bar-tooltip {
  border-radius: 0 !important;
}

/* ─── AGENT AVATAR — SQUARE ─── */
.agent-avatar {
  border-radius: 0 !important;
}

/* ─── UTILIZATION BAR — SQUARE ─── */
.utilization-bar,
.utilization-fill {
  border-radius: 0 !important;
}

/* ─── TX FILTERS — SQUARE ─── */
.tx-filter {
  border-radius: 0 !important;
}

/* ─── STATIC TOOLTIP — NO SHADOW ─── */
.stat-tooltip {
  box-shadow: none !important;
}

/* ─── REMOVE GRADIENTS FROM BARS ─── */
.trend-bar,
.chart-bar,
.forecast-bar {
  background: var(--color-accent) !important;
  background-color: var(--color-accent) !important;
}

/* ─── LIVE DOT — STATIC (NO PULSE) ─── */
.live-dot {
  animation: none !important;
  box-shadow: none !important;
}

/* ─── TX STRIPE REMOVAL ─── */
.tx-table tbody tr:nth-child(even) {
  background: transparent !important;
}

/* ─── REMOVE ALL GRADIENTS FROM BARS ─── */
.trend-bar,
.chart-bar,
.forecast-bar,
.chart-bar-group {
  background: var(--color-accent) !important;
  background-color: var(--color-accent) !important;
  background-image: none !important;
}

/* ─── SECTION DIVIDER — SOLID LINE ─── */
.section-divider {
  background: var(--color-gray-200) !important;
  background-image: none !important;
}

/* ─── NAV TABS — SIMPLE UNDERLINE ─── */
.nav-tab {
  border-radius: 0 !important;
}
.nav-tab.active {
  border-bottom: 2px solid var(--color-black) !important;
  background: transparent !important;
}

/* ─── REMAINING OVERRIDES FOR SQUARE EDGES ─── */
.stat-card {
  border-radius: 0 !important;
}
.card,
.card-header,
.card-title {
  border-radius: 0 !important;
}
.analytics-card {
  border-radius: 0 !important;
}
.modal-content {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.modal-overlay {
  backdrop-filter: none !important;
}

/* ─── TAB BUTTONS ─── */
.tab-btn,
.tab-button {
  border-radius: 0 !important;
}

/* ─── INPUTS AND SELECTS ─── */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
textarea,
select {
  border-radius: 0 !important;
}

/* ─── FILTER BUTTONS ─── */
.filter-btn,
.filter-pill {
  border-radius: 0 !important;
}

/* ─── DROPDOWN MENUS ─── */
.dropdown,
.dropdown-menu,
.dropdown-content {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ─── BADGES AND PILLS ─── */
.badge,
.tag,
.pill,
.chip {
  border-radius: 0 !important;
}

/* ─── POPOVER ─── */
.popover,
.tx-popover-card {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ─── KEYBOARD SHORTCUT KBD ─── */
kbd,
.kbd-hint kbd {
  border-radius: 0 !important;
}

/* ─── TOAST NOTIFICATIONS ─── */
.toast {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ─── MODAL ─── */
.modal {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ─── TOUR ELEMENTS ─── */
.tour-tooltip {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.tour-highlight {
  border-radius: 0 !important;
  box-shadow: 0 0 0 9999px rgba(0,0,0,0.5) !important;
}

/* ─── ORG DROPDOWN ─── */
.org-dropdown {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ─── DEMO BANNER ─── */
.demo-banner a {
  border-radius: 0 !important;
}

/* ─── ALERT BADGE COUNT ─── */
.alert-badge .count {
  border-radius: 0 !important;
}

/* ─── ONBOARDING STEP DOTS — SQUARE ─── */
.step-dot {
  border-radius: 0 !important;
}

/* ─── BREADCRUMB NAVIGATION ─── */
.breadcrumb {
  background: var(--color-white);
  border-bottom: 1px solid var(--color-gray-200);
  padding: 0 20px;
  height: 36px;
  display: flex;
  align-items: center;
  font-size: 12px;
  font-family: 'Inter', sans-serif;
  color: var(--color-gray-500);
}
.breadcrumb a {
  text-decoration: none;
}
.breadcrumb-home {
  color: var(--color-black);
  font-weight: 500;
  cursor: pointer;
}
.breadcrumb-home:hover {
  text-decoration: underline;
}
.breadcrumb-sep {
  margin: 0 6px;
  color: var(--color-gray-200);
  user-select: none;
}
.breadcrumb-current {
  color: var(--color-black);
  font-weight: 500;
  cursor: pointer;
}
.breadcrumb-current:hover {
  text-decoration: underline;
}
.breadcrumb-crumb {
  color: var(--color-gray-500);
  cursor: pointer;
}
.breadcrumb-crumb:hover {
  color: var(--color-black);
  text-decoration: underline;
}
.breadcrumb-sub {
  color: var(--color-gray-500);
}