/* Nero — tema escuro "neon roxo" (referência visual: axye.com.br, pedido do
   usuário em 14/10/2026). Carregado DEPOIS de style.css + nero.css e só
   sobrescreve: tirar este <link> volta o visual anterior inteiro.
   Linguagem: fundo preto com linhas neon roxas, Plus Jakarta Sans, cards de
   vidro fosco (preto 55% + blur 40px), botões em pílula, CTA branco em gradiente. */
:root, :root[data-theme] {
  color-scheme: dark;
  /* cor "de tinta" das transparências: branco no escuro, preto no claro */
  --ax-ink-rgb: 255 255 255;
  --ax-btn-fg: #050505;
  --ax-btn-muted: #555;
  --ax-accent-text: #b4d3fe;
  --ax-text-2: #c4c4c4;
  --ax-surface: #0b0b0c;
  --ax-bg-image: url('/assets/nero-bg.svg');
  --ax-focus: rgb(250 250 250 / .6);
  --ax-hover-border: rgb(250 250 250 / .6);
  --ax-bg: #000;
  --ax-fg: #fafafa;
  --ax-muted: #8c8c8c;
  --ax-muted-2: #6b6b6b;
  --ax-border: rgb(51 51 51 / .5);
  --ax-border-solid: #333;
  --ax-glass: rgb(4 5 6 / .62);
  --ax-glass-2: rgb(5 5 5 / .44);
  --ax-glass-strong: rgb(8 8 10 / .82);
  /* desfoque só em poucas superfícies (menu, janelas): em dezenas de cards por
     cima do fundo neon ele travava a renderização, e no preto quase não aparece */
  --ax-blur: blur(24px) saturate(1.5);
  --ax-input: rgb(var(--ax-ink-rgb) / .035);
  --ax-hover: rgb(var(--ax-ink-rgb) / .06);
  --ax-active: rgb(var(--ax-ink-rgb) / .1);
  --ax-purple: #5598f7;
  --ax-purple-2: #3a85ed;
  --ax-purple-soft: rgb(85 152 247 / .16);
  --ax-online: #24d68a;
  --ax-gold: #f5c033;
  --ax-danger: #e5484d;
  --ax-success: #23a26d;
  --ax-card-shadow: 0 8px 30px rgb(0 0 0 / .18), inset 0 1px 0 rgb(var(--ax-ink-rgb) / .08);
  --ax-card-shadow-hover: 0 12px 40px -8px rgb(250 250 250 / .22), inset 0 1px 0 rgb(var(--ax-ink-rgb) / .12);
  --ax-btn-gradient: linear-gradient(135deg, #f5f5f5, #e0e0e0);
  --ax-btn-shadow: 0 4px 14px -2px rgb(250 250 250 / .35), inset 0 1px 0 rgb(var(--ax-ink-rgb) / .18);
  --ax-btn-shadow-hover: 0 6px 20px -2px rgb(250 250 250 / .45), inset 0 1px 0 rgb(var(--ax-ink-rgb) / .22);
  --ax-story-ring: linear-gradient(135deg, #ffc21a, #ff1f6e 50%, #0d6cf2);
  --ax-ease: cubic-bezier(.4, 0, .2, 1);

  /* tokens do style.css/nero.css remapeados pro escuro */
  --bg: var(--ax-bg); --card: var(--ax-glass); --elevated: var(--ax-surface); --surface-2: rgb(var(--ax-ink-rgb) / .04);
  --text: var(--ax-fg); --text-secondary: #a3a3a3; --text-tertiary: var(--ax-muted);
  --gray: var(--ax-muted); --black: var(--ax-fg); --white: #050505;
  --border: var(--ax-border); --border-hairline: rgb(51 51 51 / .4); --border-strong: #404040;
  --green-50: var(--ax-purple-soft); --green-100: rgb(85 152 247 / .22); --green-200: rgb(85 152 247 / .3);
  --green-300: #84b6fc; --green-400: #84b6fc; --green-500: #fafafa; --green-600: #fafafa;
  --green-700: #d5e6ff; --green-800: #fafafa; --green-900: rgb(85 152 247 / .12);
  --green: #fafafa; --green-ink: #b4d3fe; --green-wash: var(--ax-purple-soft); --mint: #84b6fc;
  --danger: var(--ax-danger); --danger-wash: rgb(229 72 77 / .12);
  --amber: var(--ax-gold); --amber-wash: rgb(245 192 51 / .1); --neutral-wash: rgb(var(--ax-ink-rgb) / .05);
  --header-bg: var(--ax-glass); --header-bg-raised: var(--ax-surface); --header-border: var(--ax-border);
  --header-text: #bdbdbd; --header-text-active: var(--ax-fg);
  --header-active-bg: var(--ax-active); --header-active-fg: var(--ax-fg);
  --font-primary: 'Plus Jakarta Sans', 'Apple Color Emoji', 'Segoe UI Emoji', system-ui, sans-serif;
  --font-body: var(--font-primary); --font-display: var(--font-primary);
  --tracking-display: -.025em; --tracking-heading: -.025em;
  --radius-card: 16px; --radius-modal: 20px; --radius-input: 14px; --radius-pill: 9999px;
  --shadow-xs: none; --shadow-sm: var(--ax-card-shadow);
  --shadow-md: 0 12px 40px rgb(0 0 0 / .5); --shadow-lg: 0 24px 70px rgb(0 0 0 / .7);
  --shadow-inset-highlight: inset 0 1px 0 rgb(var(--ax-ink-rgb) / .08);
}

/* tema claro ("branco e preto"), escolhido no botão de tema — salvo no navegador */
:root[data-theme="light"] {
  color-scheme: light;
  --ax-ink-rgb: 0 0 0;
  --ax-bg: #fff; --ax-fg: #0a0a0a; --ax-muted: #666; --ax-muted-2: #8a8a8a;
  --ax-border: rgb(0 0 0 / .1); --ax-border-solid: #e5e5e5;
  --ax-glass: rgb(255 255 255 / .82); --ax-glass-2: rgb(255 255 255 / .6); --ax-glass-strong: rgb(255 255 255 / .95);
  --ax-purple-soft: rgb(58 133 237 / .09);
  --ax-online: #0f9d63; --ax-gold: #b7791f;
  --ax-card-shadow: 0 1px 2px rgb(0 0 0 / .04), 0 8px 24px rgb(0 0 0 / .06);
  --ax-card-shadow-hover: 0 14px 34px -10px rgb(0 0 0 / .2);
  --ax-btn-gradient: linear-gradient(135deg, #161616, #383838);
  --ax-btn-fg: #fff; --ax-btn-muted: #bdbdbd;
  --ax-btn-shadow: 0 4px 14px -4px rgb(0 0 0 / .35), inset 0 1px 0 rgb(255 255 255 / .12);
  --ax-btn-shadow-hover: 0 8px 22px -4px rgb(0 0 0 / .42), inset 0 1px 0 rgb(255 255 255 / .16);
  --ax-accent-text: #2872d9; --ax-text-2: #444; --ax-surface: #fff;
  --ax-bg-image: url('/assets/nero-bg-light.svg');
  --ax-focus: rgb(0 0 0 / .55); --ax-hover-border: rgb(0 0 0 / .28);
  --text-secondary: #555; --border-hairline: rgb(0 0 0 / .07); --border-strong: #d4d4d4;
  --green-300: #3a85ed; --green-400: #3a85ed; --green-500: #0a0a0a; --green-600: #0a0a0a;
  --green-700: #2872d9; --green-800: #0a0a0a; --green: #0a0a0a; --green-ink: #2872d9; --mint: #3a85ed;
  --header-text: #444;
  --shadow-md: 0 12px 40px rgb(0 0 0 / .12); --shadow-lg: 0 24px 70px rgb(0 0 0 / .18);
}
:root[data-theme="light"] .ai-mark { background: #0a0a0a; box-shadow: 0 0 22px rgb(58 133 237 / .2); }
:root[data-theme="light"] .ai-mark img, :root[data-theme="light"] .ax-chip img, :root[data-theme="light"] .ax-nav-logo img { filter: none; }
:root[data-theme="light"] .badge.success, :root[data-theme="light"] .badge-realizado, :root[data-theme="light"] .status-paid,
:root[data-theme="light"] .kpi-delta.up, :root[data-theme="light"] .success-msg { color: #15803d; }
:root[data-theme="light"] .status-failed, :root[data-theme="light"] .error-msg { color: #c62828; }
:root[data-theme="light"] .age-warning { color: #7a5600; }
:root[data-theme="light"] .modal-backdrop, :root[data-theme="light"] .confirm-backdrop, :root[data-theme="light"] .cmdk-backdrop { background: rgb(0 0 0 / .3); }

html { background: var(--ax-bg); }
/* body transparente: com fundo próprio ele cobriria o ::before (z-index -1) */
body {
  background: transparent; color: var(--ax-fg);
  font-family: var(--font-primary); -webkit-font-smoothing: antialiased;
}
body::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: var(--ax-bg) var(--ax-bg-image) center / cover no-repeat;
  transform: translateZ(0); will-change: transform;
}
::selection { background: rgb(85 152 247 / .45); color: var(--ax-fg); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgb(var(--ax-ink-rgb) / .12); border-radius: 9999px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-track { background: transparent; }
h1, h2, h3, .dash-title, .view-header h2, .login-card h1 { font-family: var(--font-primary); font-weight: 700; letter-spacing: -.025em; color: var(--ax-fg); }
.muted, .activity-meta, .kpi-sub, .workspace-note { color: var(--ax-muted); }
:focus-visible { outline: 2px solid var(--ax-focus); outline-offset: 2px; }

/* ---------- vidro: cards, tabelas, painéis ---------- */
.kpi-card, .kpi-financial, .kpi-financial.kpi-revenue, .kpi-digitopay,
.chart-card, .ask-card, .today-card, .table-wrap, .webhook-card, .fees-form,
.inline-form, #manual-payment-form, .login-card, .formiga-card, .wallet-hero, .referral-card {
  background: var(--ax-glass); background-image: none;
  border: 1px solid var(--ax-border); box-shadow: var(--ax-card-shadow);
}
.kpi-card, .chart-card, .ask-card, .today-card, .table-wrap { border-radius: 16px; }
.kpi-card { transition: transform .3s var(--ax-ease), border-color .3s var(--ax-ease), box-shadow .3s var(--ax-ease); }
.kpi-card:hover { transform: translateY(-4px); border-color: var(--ax-hover-border); box-shadow: var(--ax-card-shadow-hover); }
.kpi-label { color: var(--ax-muted); }
.kpi-value { color: var(--ax-fg); font-weight: 700; letter-spacing: -.03em; }
.kpi-delta.up { color: #4ade80; background: rgb(35 162 109 / .14); }
th { background: rgb(var(--ax-ink-rgb) / .03); color: var(--ax-muted); border-bottom-color: var(--ax-border); }
td { border-bottom-color: rgb(51 51 51 / .35); }
tbody tr:hover, .activity-row:hover { background: var(--ax-hover); }
.activity-avatar, .user-avatar { background: rgb(var(--ax-ink-rgb) / .08); color: var(--ax-fg); }

/* ---------- formulários ---------- */
input, select, textarea,
.filters input, .filters select, .search-input, .inline-form input, .inline-form select,
.fees-form input, .modal-form input, .modal-form select, .modal-form textarea, .login-card input {
  background: var(--ax-input); color: var(--ax-fg); border: 1px solid var(--ax-border); border-radius: 14px;
}
input::placeholder, textarea::placeholder { color: #6f6f6f; }
.period-control select, .filters select, .modal-form select, .inline-form select { background-color: var(--ax-input); color: var(--ax-fg); }
select option { background: var(--ax-surface); color: var(--ax-fg); }
input:focus, select:focus, textarea:focus {
  border-color: var(--ax-focus) !important; box-shadow: 0 0 0 3px rgb(var(--ax-ink-rgb) / .08) !important; outline: none;
}
input:disabled, select:disabled { opacity: .55; }
.modal-form label, .inline-form label { color: var(--ax-text-2); }

/* ---------- botões ---------- */
.btn-primary, .login-card button, .inline-form button, .fees-form button, .filters button,
.send-pix-btn, .approve-btn, .confirm-btn-primary, .ax-btn {
  background: var(--ax-btn-gradient); color: var(--ax-btn-fg); border: 0; border-radius: 9999px;
  font-weight: 500; box-shadow: var(--ax-btn-shadow);
  transition: color .2s, background-color .2s, box-shadow .2s, transform .2s, opacity .2s;
}
.btn-primary:hover, .login-card button:hover, .inline-form button:hover, .fees-form button:hover,
.filters button:hover, .send-pix-btn:hover, .approve-btn:hover, .confirm-btn-primary:hover, .ax-btn:hover {
  background: var(--ax-btn-gradient); opacity: .95; box-shadow: var(--ax-btn-shadow-hover);
}
.btn-primary:active, .login-card button:active, .filters button:active, .ax-btn:active { transform: scale(.97); }
.btn-primary:disabled, .login-card button:disabled { opacity: .45; box-shadow: none; }
.btn-ghost, .btn-refresh, .modal-secondary, .login-card .btn-ghost, .login-card .modal-secondary, .ax-btn-ghost {
  background: rgb(var(--ax-ink-rgb) / .04); color: var(--ax-fg); border: 1px solid var(--ax-border);
  border-radius: 9999px; box-shadow: none; font-weight: 500;
}
.btn-ghost:hover, .btn-refresh:hover, .modal-secondary:hover, .ax-btn-ghost:hover { background: var(--ax-hover); border-color: var(--ax-hover-border); }
.reject-btn, .danger-btn { border-radius: 9999px; }

/* ---------- badges ---------- */
.status-badge, .badge { border-radius: 9999px; }
.badge.success, .badge-realizado, .status-paid { background: rgb(35 162 109 / .16); color: #4ade80; }
.status-pending { background: rgb(245 192 51 / .14); color: var(--ax-gold); }
.status-failed { background: rgb(229 72 77 / .14); color: #ff7b7f; }
.status-unknown { background: rgb(var(--ax-ink-rgb) / .07); color: var(--ax-text-2); }

/* ---------- painel: barra lateral de vidro ---------- */
.topbar {
  background: var(--ax-glass); border-right: 1px solid var(--ax-border);
  -webkit-backdrop-filter: var(--ax-blur); backdrop-filter: var(--ax-blur);
}
.brand { color: var(--ax-fg); }
.brand-word { font-weight: 700; letter-spacing: -.03em; }
.ai-mark { background: #fafafa; border-radius: 12px; box-shadow: 0 0 24px rgb(85 152 247 / .35); }
.ai-mark img { filter: invert(1); }
.nav-btn, .nav-more-item { color: rgb(var(--ax-ink-rgb) / .7); border-radius: 9999px; }
.nav-btn:hover, .nav-more-item:hover { background: var(--ax-hover); color: var(--ax-fg); }
.nav-btn.active, .nav-more-item.active {
  background: var(--ax-active); color: var(--ax-fg); font-weight: 600;
  box-shadow: inset 0 1px 0 rgb(var(--ax-ink-rgb) / .1), 0 0 0 1px var(--ax-border);
}
.nav-more::before { color: var(--ax-muted-2); }
.cmdk-search { color: var(--ax-muted); border-radius: 9999px; }
.cmdk-search:hover { background: var(--ax-hover); }
.cmdk-search .cmdk-kbd { color: #666; }
.user-menu-trigger { border-radius: 9999px; }
.user-menu-trigger:hover { background: var(--ax-hover); }
.user-name { color: var(--ax-fg); }
.user-chevron { color: var(--ax-muted); }
.user-menu-dropdown, .nav-more-menu:not(.hidden), .modal-card, .confirm-card, .cmdk-panel, .cmdk-card {
  background: var(--ax-glass-strong); border: 1px solid var(--ax-border); box-shadow: var(--shadow-lg);
  -webkit-backdrop-filter: var(--ax-blur); backdrop-filter: var(--ax-blur); color: var(--ax-fg);
}
.workspace-name { color: var(--ax-fg); }
.workspace-name span { color: var(--ax-muted); border-left-color: var(--ax-border); }
.modal-backdrop, .confirm-backdrop, .cmdk-backdrop { background: rgb(0 0 0 / .6); backdrop-filter: blur(6px); }
.mobile-nav-toggle { color: var(--ax-fg); }
.chart-tooltip, [data-tooltip]::after { background: #0b0b0c; color: var(--ax-fg); border: 1px solid var(--ax-border); }

/* ---------- login / portal (cartão) ---------- */
.login-screen { background: transparent; }
.login-card { border-radius: 20px; }
.login-kicker { color: var(--ax-muted); }
.formiga-tabs { background: rgb(var(--ax-ink-rgb) / .04); border: 1px solid var(--ax-border); border-radius: 9999px; padding: 4px; }
.formiga-tabs .formiga-tab-btn { border-radius: 9999px; color: rgb(var(--ax-ink-rgb) / .7); box-shadow: none; background: transparent; }
.formiga-tabs .formiga-tab-btn.active { background: var(--ax-btn-gradient); color: var(--ax-btn-fg); box-shadow: var(--ax-btn-shadow); }
.age-warning { background: rgb(245 192 51 / .08); border-color: rgb(245 192 51 / .35); color: #f8d77a; }
.error-msg { color: #ff8a8e; }
.success-msg { color: #4ade80; }

/* ---------- botão de tema (sol = ir pro claro, lua = ir pro escuro) ---------- */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0;
  border: 1px solid var(--ax-border); border-radius: 9999px; background: var(--ax-glass); color: var(--ax-fg); cursor: pointer;
  transition: background .2s, border-color .2s, transform .2s;
}
.theme-toggle:hover { background: var(--ax-hover); border-color: var(--ax-hover-border); }
.theme-toggle:active { transform: scale(.94); }
.theme-toggle svg { width: 18px; height: 18px; }
.theme-toggle .theme-moon { display: none; }
:root[data-theme="light"] .theme-toggle .theme-sun { display: none; }
:root[data-theme="light"] .theme-toggle .theme-moon { display: block; }
.ax-nav .theme-toggle { width: auto; height: 38px; padding: 0 12px; border: 0; background: transparent; }
.theme-toggle-float { position: fixed; top: 14px; right: 14px; z-index: 60; }
.workspace-header .theme-toggle { margin-left: 12px; flex-shrink: 0; }

/* ---------- painel: moderação da comunidade ---------- */
.community-tabs { display: inline-flex; gap: 4px; padding: 4px; margin: 14px 0; border: 1px solid var(--ax-border); border-radius: 9999px; background: var(--ax-glass); }
.community-tab { border: 0; background: transparent; color: rgb(var(--ax-ink-rgb) / .7); padding: 8px 16px; border-radius: 9999px; font-size: 13px; font-weight: 500; cursor: pointer; }
.community-tab:hover { color: var(--ax-fg); background: var(--ax-hover); }
.community-tab.active { background: var(--ax-btn-gradient); color: var(--ax-btn-fg); box-shadow: var(--ax-btn-shadow); }
.community-text { white-space: pre-wrap; max-width: 520px; min-width: 220px; line-height: 1.5; }
#community-list td { vertical-align: top; }

/* ---------- painel: notificações ---------- */
.notif-stats { display: grid; grid-template-columns: minmax(0, 320px); margin: 16px 0; }
.notif-of { font-size: 15px; font-weight: 500; color: var(--ax-muted); letter-spacing: 0; }
.notif-off .kpi-label { color: var(--ax-gold); }
.notif-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.notif-form { background: var(--ax-glass); border: 1px solid var(--ax-border); border-radius: 16px; padding: 22px; box-shadow: var(--ax-card-shadow); }
.notif-form textarea { width: 100%; resize: vertical; padding: 12px 14px; font: 400 14px/1.5 var(--font-primary); }
.notif-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.notif-actions .btn-primary { height: 44px; padding: 0 24px; }
.notif-preview-label { margin: 0 0 8px; font-size: 12px; color: var(--ax-muted); }
.notif-phone {
  height: 210px; padding: 22px 12px; border-radius: 28px; border: 1px solid var(--ax-border);
  background: radial-gradient(120% 90% at 20% 0%, rgb(58 133 237 / .45), transparent 60%), radial-gradient(100% 80% at 100% 100%, rgb(219 39 119 / .3), transparent 60%), #06080c;
}
.notif-card { display: flex; gap: 10px; padding: 12px; border-radius: 16px; background: rgb(var(--ax-ink-rgb) / .1); border: 1px solid rgb(var(--ax-ink-rgb) / .08); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
.notif-card img { width: 34px; height: 34px; border-radius: 9px; flex-shrink: 0; }
.notif-card-app { font-size: 11px; color: var(--ax-text-2); margin-bottom: 2px; }
.notif-card strong { display: block; font-size: 13px; overflow-wrap: anywhere; }
.notif-card p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.4; color: var(--ax-text-2); overflow-wrap: anywhere; }
.notif-history-title { margin: 28px 0 12px; font-size: 16px; }
@media (max-width: 1000px) { .notif-grid { grid-template-columns: 1fr; } }

@media (max-width: 760px) {
  .topbar { background: var(--ax-glass-strong); border-right: 0; border-bottom: 1px solid var(--ax-border); }
  .topnav { background: var(--ax-glass-strong); border-color: var(--ax-border); -webkit-backdrop-filter: var(--ax-blur); backdrop-filter: var(--ax-blur); }
}
@media (prefers-reduced-motion: reduce) {
  .kpi-card:hover { transform: none; }
}

/* ---------- painel: pedidos de senha nova ---------- */
.password-requests { margin: 0 0 18px; padding: 16px; border: 1px solid rgb(245 192 51 / .45); border-radius: 16px; background: rgb(245 192 51 / .07); display: flex; flex-direction: column; gap: 10px; }
.password-requests-head { display: flex; flex-direction: column; gap: 4px; }
.password-request-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid var(--ax-border); }
.password-request-row .btn-primary { height: 38px; padding: 0 18px; }