:root { --vx-fin-purple:#A52EFF; --vx-fin-violet:#8B24D6; --vx-fin-lilac:#D49AFF; --vx-fin-ink:#07030D; --vx-fin-deep:#160525; --vx-fin-panel:#100918; }
.vx-finance-view { padding-bottom:40px; }
.vx-fin-head-actions { position:relative; z-index:1; display:flex; align-items:center; gap:9px; flex:0 0 auto; }
.vx-charge-primary,.vx-charge-secondary { position:relative; z-index:1; display:inline-flex; align-items:center; gap:8px; min-height:46px; padding:0 20px; border-radius:9px; font:750 13px/1 'Inter',sans-serif; cursor:pointer; transition:transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.vx-charge-primary { color:white; border:1px solid rgba(212,154,255,.55); background:linear-gradient(115deg,#B94BFF,#7C1FD1 55%,#5D168A); box-shadow:0 4px 14px rgba(139,36,214,.32), 0 14px 34px rgba(93,22,138,.28), inset 0 1px rgba(255,255,255,.26); }
.vx-charge-primary:hover { transform:translateY(-2px); box-shadow:0 6px 18px rgba(139,36,214,.42), 0 18px 42px rgba(93,22,138,.38), inset 0 1px rgba(255,255,255,.3); filter:brightness(1.04); }
.vx-charge-primary:active { transform:translateY(0); }
.vx-charge-primary:disabled { opacity:.55; cursor:wait; transform:none; }
.vx-charge-secondary { color:#C9BFD4; border:1px solid #2c2136; background:linear-gradient(160deg,#150c1f,#0a0611); }
.vx-charge-secondary:hover { color:#E9DFF2; border-color:#4a3a58; transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,0,0,.35); }
/* Barra única: abas à esquerda, ações à direita — mesmo padrão de "aba deslizante"
   já aprovado no Dashboard (vidro fosco + pill animado), aplicado aqui também. */
.vx-fin-toolbar { position:relative; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:nowrap; margin-bottom:20px; }
.vx-fin-tabs {
  position:relative; display:flex; gap:2px; padding:4px; flex-shrink:0;
  border:1px solid #2b1c38; border-radius:100px;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.015)), #0C0712;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.4);
}
.vx-fin-tab-indicator {
  position:absolute; top:4px; bottom:4px; left:4px; width:0; border-radius:100px;
  background:linear-gradient(135deg,#B94BFF,#7C1FD1); z-index:0; pointer-events:none;
  box-shadow:0 4px 16px rgba(168,85,247,.5), inset 0 1px 0 rgba(255,255,255,.22);
  transition:left .32s cubic-bezier(.4,0,.2,1), width .32s cubic-bezier(.4,0,.2,1);
}
.vx-fin-tabs button { position:relative; z-index:1; min-height:40px; padding:0 18px; border:0; border-radius:100px; color:#8f8399; background:transparent; font:700 12px/1 'Inter',sans-serif; cursor:pointer; transition:color .2s ease; white-space:nowrap; }
.vx-fin-tabs button:hover:not(.active) { color:#cfc3da; }
.vx-fin-tabs button.active { color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.3); }
.vx-fin-tabs button span { display:inline-grid; place-items:center; min-width:19px; height:19px; margin-left:5px; border-radius:5px; background:rgba(255,255,255,.14); font-size:10px; }
.vx-fin-pane { display:none; }
.vx-fin-pane.active { display:block; animation:vxFinIn .25s ease both; }
@keyframes vxFinIn { from{opacity:0;transform:translateY(5px)} to{opacity:1;transform:none} }
.vx-fin-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.vx-fin-metrics article { min-height:124px; padding:20px; border:1px solid #281a34; background:linear-gradient(150deg,rgba(22,5,37,.92),rgba(9,5,13,.96)); }
.vx-fin-metrics span,.vx-fin-metrics small { display:block; color:#8f8399; font-size:11px; }
.vx-fin-metrics strong { display:block; margin:14px 0 7px; color:#F7F3FA; font:760 clamp(23px,2.5vw,31px)/1 'Inter',sans-serif; letter-spacing:-.035em; }
.vx-fin-metrics article:first-child { border-color:rgba(165,46,255,.42); box-shadow:inset 0 1px rgba(212,154,255,.09),0 12px 38px rgba(93,22,138,.08); }
.vx-fin-metrics article:first-child strong { color:#D49AFF; }
.vx-fin-split { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr); gap:16px; }
.vx-fin-panel { min-width:0; padding:18px; border:1px solid #281a34; background:#0B0710; }
.vx-panel-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:14px; }
.vx-panel-head span,.vx-panel-head strong { display:block; }
.vx-panel-head span { color:#7f7389; font:650 10px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.13em; }
.vx-panel-head strong { margin-top:6px; color:#F7F3FA; font-size:17px; }
.vx-panel-head button { border:0; color:#D49AFF; background:none; font-weight:700; cursor:pointer; }
.vx-list-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding:18px 20px; margin-bottom:12px; border:1px solid #281a34; background:#0B0710; }
.vx-list-toolbar strong,.vx-list-toolbar span { display:block; }
.vx-list-toolbar strong { color:#F7F3FA; font-size:17px; }
.vx-list-toolbar span { margin-top:5px; color:#8f8399; font-size:12px; }
.vx-list-toolbar select { min-width:180px; height:42px; padding:0 12px; border:1px solid #342442; border-radius:6px; color:#E8E0ED; background:#0A0610; }
.vx-charge-list { display:grid; gap:8px; }
.vx-charge-card { border:1px solid #271a32; background:linear-gradient(110deg,#0D0813,#09060d); transition:border-color .18s ease,transform .18s ease; }
.vx-charge-card:hover { border-color:rgba(165,46,255,.38); transform:translateY(-1px); }
.vx-charge-card.pago { border-left:3px solid #9f5cff; }
.vx-charge-card.vencido { border-left:3px solid #fb7185; }
.vx-charge-card.cancelado { opacity:.64; }
.vx-charge-main { display:grid; grid-template-columns:42px minmax(170px,1fr) minmax(120px,.42fr) auto; align-items:center; gap:13px; padding:14px 15px; }
.vx-charge-avatar { display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(165,46,255,.32); border-radius:7px; color:#D49AFF; background:rgba(93,22,138,.18); font-weight:800; }
.vx-charge-person strong,.vx-charge-person span,.vx-charge-amount strong,.vx-charge-amount span { display:block; }
.vx-charge-person strong { color:#F7F3FA; font-size:13px; }
.vx-charge-person span,.vx-charge-amount span { margin-top:5px; color:#817688; font-size:10.5px; }
.vx-charge-amount strong { color:#E8DDF0; font-size:15px; }
.vx-status { padding:7px 9px; border-radius:5px; font:750 9px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }
.vx-status.pendente { color:#D49AFF; background:rgba(139,36,214,.15); border:1px solid rgba(165,46,255,.28); }
.vx-status.pago { color:#d9b8ff; background:rgba(116,50,171,.19); border:1px solid rgba(212,154,255,.32); }
.vx-status.vencido { color:#ff9aac; background:rgba(190,45,73,.14); border:1px solid rgba(251,113,133,.28); }
.vx-status.cancelado { color:#93889a; background:#17111b; border:1px solid #302536; }
.vx-charge-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:6px; padding:9px 14px; border-top:1px solid #211628; background:rgba(255,255,255,.01); }
.vx-fin-table .vx-charge-actions { flex-wrap:nowrap; }

.vx-action-menu { position:relative; }
.vx-action-dropdown {
  display:none; position:fixed; z-index:200;
  min-width:190px; padding:6px; border-radius:10px;
  background:#150a20; border:1px solid #2a1c38; box-shadow:0 16px 40px rgba(0,0,0,.5);
}
.vx-action-dropdown.open { display:flex; flex-direction:column; gap:2px; }
.vx-action-dropdown button {
  text-align:left; padding:9px 10px; border-radius:7px; border:none; background:none;
  color:#E8DDF0; font:600 12px/1.2 'Inter',sans-serif; cursor:pointer;
}
.vx-action-dropdown button:hover { background:#241531; }
.vx-action-dropdown button.is-danger { color:#ff91a4; }
.vx-action-dropdown button.is-danger:hover { background:rgba(255,90,95,.12); }

.vx-action { min-height:34px; padding:0 11px; border:1px solid #34273e; border-radius:5px; color:#BDB2C5; background:#0C0811; font:700 10.5px/1 'Inter',sans-serif; cursor:pointer; }
.vx-action.primary { color:white; border-color:rgba(165,46,255,.42); background:linear-gradient(100deg,#8B24D6,#5D168A); }
.vx-action.icon { width:35px; padding:0; font-size:16px; }
.vx-action.danger { color:#ff91a4; }
.vx-fin-empty { display:grid; place-items:center; min-height:210px; padding:28px; text-align:center; border:1px dashed #2c2034; }
.vx-fin-empty span { color:#A52EFF; font-size:30px; }.vx-fin-empty strong { margin-top:12px; color:#EDE5F2; }.vx-fin-empty p { max-width:270px; margin:7px 0 0; color:#817688; font-size:12px; }
.vx-fin-split .vx-charge-main { grid-template-columns:42px minmax(0,1fr) auto; }
.vx-fin-split .vx-charge-amount { grid-column:2; }
.vx-fin-split .vx-status { grid-column:3; grid-row:1/3; align-self:center; max-width:112px; white-space:normal; line-height:1.25; text-align:center; }
.vx-mobile-new-charge { display:none; }

.vx-fin-split { grid-template-columns:1fr; }
.vx-fin-table { overflow:hidden; border:1px solid #281a34; background:#09060D; }
.vx-fin-table-head,.vx-fin-table .vx-charge-card { display:grid; grid-template-columns:minmax(220px,1.35fr) 100px 100px 105px 135px minmax(250px,1fr); align-items:center; column-gap:14px; }
.vx-fin-table-head { min-height:42px; padding:0 14px; border-bottom:1px solid #281a34; color:#716578; background:#0D0813; font:700 9px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.08em; }
.vx-fin-table .vx-charge-card { border:0; border-bottom:1px solid #211628; background:#09060D; transform:none; }
.vx-fin-table .vx-charge-card:last-child { border-bottom:0; }
.vx-fin-table .vx-charge-card:hover { background:#0D0813; transform:none; }
.vx-fin-table .vx-charge-card.pago,.vx-fin-table .vx-charge-card.vencido { border-left:0; }
.vx-fin-table .vx-charge-main { display:contents; }
.vx-charge-client { display:flex; align-items:center; min-width:0; gap:11px; padding:12px 0 12px 14px; }
.vx-fin-table .vx-charge-date { color:#A99DB2; font-size:11px; }
.vx-fin-table .vx-charge-amount { grid-column:auto; }
.vx-fin-table .vx-charge-amount strong { font-size:13px; }
.vx-fin-table .vx-status { grid-column:auto; grid-row:auto; align-self:center; max-width:125px; white-space:normal; line-height:1.2; text-align:center; }
.vx-fin-table .vx-charge-actions { justify-content:flex-start; padding:8px 14px 8px 0; border:0; background:transparent; }
.vx-fin-table .vx-action { min-height:32px; padding:0 9px; font-size:9px; }
.vx-fin-table .vx-action.icon { width:32px; }

.vx-report-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:15px; }.vx-report-summary article { min-height:105px; padding:18px; border:1px solid #281a34; background:linear-gradient(145deg,#100918,#09060D); }.vx-report-summary span,.vx-report-summary small,.vx-report-summary strong { display:block; }.vx-report-summary span { color:#8f8399; font-size:10px; }.vx-report-summary strong { margin:12px 0 6px; color:#F7F3FA; font-size:25px; }.vx-report-summary article:nth-child(2) strong { color:#D49AFF; }.vx-report-summary small { color:#716578; font-size:10px; }
.vx-report-panel { border:1px solid #281a34; background:#09060D; }.vx-report-panel>header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px 19px; border-bottom:1px solid #281a34; }.vx-report-panel>header span,.vx-report-panel>header strong { display:block; }.vx-report-panel>header span { color:#716578; font:700 9px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.12em; }.vx-report-panel>header strong { margin-top:6px; color:#F7F3FA; font-size:16px; }.vx-report-panel>header>small { color:#716578; font-size:9px; }
.vx-report-head,.vx-report-row { display:grid; grid-template-columns:minmax(220px,1.35fr) 115px 120px 105px 125px 105px; align-items:center; gap:14px; }.vx-report-head { min-height:42px; padding:0 16px; border-bottom:1px solid #281a34; color:#716578; background:#0D0813; font:700 9px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.07em; }.vx-report-row { min-height:66px; padding:0 16px; border-bottom:1px solid #211628; color:#A99DB2; font-size:11px; transition:background .16s ease; }.vx-report-row:last-child { border-bottom:0; }.vx-report-row:hover { background:#0D0813; }.vx-report-person { display:flex; align-items:center; min-width:0; gap:11px; }.vx-report-person>span { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; border:1px solid rgba(165,46,255,.32); border-radius:7px; color:#D49AFF; background:rgba(93,22,138,.16); font-weight:800; }.vx-report-person strong,.vx-report-person small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.vx-report-person strong { color:#F7F3FA; font-size:12px; }.vx-report-person small { max-width:260px; margin-top:4px; color:#716578; font-size:9px; }.vx-report-action button { min-height:34px; padding:0 11px; border:1px solid rgba(165,46,255,.38); border-radius:5px; color:#EBDDF5; background:rgba(93,22,138,.18); font-size:9px; font-weight:750; cursor:pointer; }

.vx-charge-overlay,.vx-doc-overlay { position:fixed; inset:0; z-index:100200; display:none; place-items:center; padding:18px; background:rgba(3,1,6,.78); backdrop-filter:blur(12px); }
.vx-charge-overlay.open,.vx-doc-overlay.open { display:grid; }
.vx-charge-modal { width:min(760px,100%); max-height:min(860px,calc(100dvh - 36px)); overflow:auto; border:1px solid rgba(165,46,255,.4); border-radius:9px; background:radial-gradient(circle at 85% 0,rgba(93,22,138,.22),transparent 28%),#0A060F; box-shadow:0 30px 100px rgba(0,0,0,.72); }
.vx-charge-modal-head { display:flex; align-items:center; justify-content:space-between; padding:24px 26px 17px; }
.vx-charge-modal-head span { color:#D49AFF; font:700 10px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.16em; }
.vx-charge-modal-head h2 { margin:7px 0 0; color:#F7F3FA; font:750 26px/1 'Inter',sans-serif; }
.vx-charge-modal-head p { max-width:470px; margin:8px 0 0; color:#8f8399; font-size:12px; line-height:1.45; }
.vx-charge-modal-head button,.vx-doc-shell>header button { width:42px; height:42px; border:1px solid #352641; border-radius:6px; color:#A99DB2; background:#100A16; font-size:25px; cursor:pointer; }
.vx-charge-progress { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:0 26px 18px; }.vx-charge-progress i { height:2px; background:#2b2032; }.vx-charge-progress i.active { background:#A52EFF; box-shadow:0 0 12px rgba(165,46,255,.7); }
.vx-charge-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:4px 26px 24px; }
.vx-field-wide { grid-column:1/-1; }.vx-field label { display:flex; justify-content:space-between; margin-bottom:8px; color:#AFA3B8; font:700 10px/1 'JetBrains Mono',monospace; text-transform:uppercase; letter-spacing:.1em; }.vx-field label small { color:#675d6d; text-transform:none; letter-spacing:0; }
.vx-field input,.vx-field select,.vx-field textarea { width:100%; min-height:48px; padding:0 13px; border:1px solid #30233b; border-radius:6px; outline:none; color:#F7F3FA; background:#07040B; font:500 13px/1.4 'Inter',sans-serif; }.vx-field textarea { padding-top:12px; resize:vertical; }.vx-field input:focus,.vx-field select:focus,.vx-field textarea:focus { border-color:#A52EFF; box-shadow:0 0 0 3px rgba(165,46,255,.1); }
.vx-charge-modal-foot { display:flex; justify-content:flex-end; gap:9px; padding:17px 26px 24px; border-top:1px solid #211629; }
.vx-pix-settings-modal { width:min(680px,100%); }
.vx-charge-preview { display: none; } /* só aparece em telas >=901px, ver media query abaixo — garante zero mudança no mobile */

/* ---------- Modal "Nova cobrança" — versão premium exclusiva de desktop ----------
   Só ativa em telas >=901px (mesmo padrão de corte usado no Dashboard PC). Em
   telas menores o modal continua exatamente como estava, sem nenhuma mudança. */
@media (min-width: 901px) {
  .vx-charge-modal-premium { width: min(920px, 100%); }
  .vx-charge-modal-premium .vx-charge-modal-head { padding: 26px 30px 16px; }
  .vx-charge-modal-premium .vx-charge-modal-head h2 { font-size: 27px; }
  .vx-charge-modal-premium .vx-charge-progress { padding: 0 30px 18px; }
  .vx-charge-body-split { display: grid; grid-template-columns: 1.35fr 1fr; align-items: stretch; }
  .vx-charge-modal-premium .vx-charge-form { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px 14px; padding: 4px 30px 26px 30px; border-right: 1px solid #211628; }
  .vx-charge-preview { display: flex; flex-direction: column; padding: 26px 26px 24px; background: radial-gradient(circle at 26% 0%, rgba(139,36,214,.16), transparent 52%), #07040c; }
  .vx-charge-preview-label { font: 700 10px/1 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .14em; color: #8f8399; margin-bottom: 14px; }
  .vx-charge-preview-card { border: 1px solid rgba(165,46,255,.32); border-radius: 12px; padding: 22px; background: linear-gradient(160deg, rgba(22,5,37,.94), rgba(9,5,13,.98)); box-shadow: 0 22px 55px rgba(93,22,138,.2), inset 0 1px rgba(255,255,255,.04); }
  .vx-cpv-top { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
  .vx-cpv-avatar { flex-shrink: 0; width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; background: rgba(93,22,138,.28); border: 1px solid rgba(165,46,255,.4); color: #D49AFF; font-weight: 800; font-size: 15px; }
  .vx-cpv-who { min-width: 0; }
  .vx-cpv-name { color: #F7F3FA; font-weight: 750; font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .vx-cpv-servico { color: #8f8399; font-size: 11.5px; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .vx-cpv-valor { font-size: 34px; font-weight: 800; color: #fff; margin: 4px 0 18px; letter-spacing: -0.02em; }
  .vx-cpv-meta { display: flex; align-items: center; justify-content: space-between; padding-top: 16px; border-top: 1px solid #211628; font-size: 11px; color: #8f8399; }
  .vx-cpv-meta strong { color: #E8DDF0; font-weight: 700; font-size: 12px; }
  .vx-cpv-status { margin-top: 16px; display: inline-block; padding: 5px 11px; border-radius: 100px; font: 750 10px/1 'JetBrains Mono', monospace; text-transform: uppercase; letter-spacing: .07em; color: #D49AFF; background: rgba(139,36,214,.16); border: 1px solid rgba(165,46,255,.3); width: fit-content; }
  .vx-charge-preview-hint { margin: 16px 2px 0; color: #716578; font-size: 11px; line-height: 1.5; }
  .vx-charge-modal-premium .vx-charge-modal-foot { padding: 18px 30px 26px; }
}


@media (min-width:769px) {
  .vx-charge-modal { max-height:none; overflow:hidden; }
  .vx-charge-modal-head { padding:20px 24px 14px; }
  .vx-charge-progress { padding:0 24px 14px; }
  .vx-charge-form { gap:12px 14px; padding:2px 24px 18px; }
  .vx-field label { margin-bottom:6px; }
  .vx-field input,.vx-field select,.vx-field textarea { min-height:44px; }
  .vx-charge-modal-foot { padding:14px 24px 18px; }
}

.vx-doc-shell { width:min(820px,100%); max-height:calc(100dvh - 30px); overflow:auto; border:1px solid rgba(165,46,255,.35); border-radius:9px; background:#09060d; box-shadow:0 30px 100px rgba(0,0,0,.75); }.vx-doc-shell>header,.vx-doc-shell>footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 18px; border-bottom:1px solid #281d30; }.vx-doc-shell>footer { justify-content:flex-end; border-top:1px solid #281d30; border-bottom:0; }.vx-doc-shell>header span,.vx-doc-shell>header strong { display:block; }.vx-doc-shell>header span { color:#D49AFF; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }.vx-doc-shell>header strong { margin-top:4px; color:#F7F3FA; }.vx-doc-body { padding:20px; }
.vx-document { width:100%; max-width:780px; margin:auto; border:1px solid #2A2033; border-radius:10px; overflow:hidden; color:#F7F3FA; background:#0B0710; font-family:'Inter',Arial,sans-serif; }.vx-document-top { display:flex; align-items:center; justify-content:space-between; padding:22px 25px; background:linear-gradient(100deg,#5D168A,#8B24D6); }.vx-document-top span,.vx-document-top strong { display:block; }.vx-document-top span { font-size:20px; font-weight:850; letter-spacing:.12em; }.vx-document-top strong { margin-top:5px; font-size:9px; letter-spacing:.18em; }.vx-document-top b { font:700 11px/1 'JetBrains Mono',monospace; }.vx-document-banner { display:flex; align-items:center; gap:12px; margin:18px 22px 0; padding:15px; border:1px solid #30233a; border-radius:7px; }.vx-document-banner>span { display:grid; place-items:center; width:35px; height:35px; border:1px solid #A52EFF; border-radius:6px; color:#D49AFF; }.vx-document-banner strong,.vx-document-banner small { display:block; }.vx-document-banner small { margin-top:4px; color:#8f8399; }.vx-document-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:14px; padding:14px 22px; }.vx-document section { padding:16px; border:1px solid #2A2033; border-radius:7px; }.vx-document h3 { margin:0 0 13px; color:#D49AFF; font-size:11px; text-transform:uppercase; letter-spacing:.1em; }.vx-document dl { display:grid; grid-template-columns:110px 1fr; gap:9px; margin:0; font-size:11px; }.vx-document dt { color:#8f8399; }.vx-document dd { margin:0; text-align:right; font-weight:650; }.vx-document-value strong { display:block; color:#fff; font-size:31px; }.vx-document-value small { display:block; margin-top:8px; color:#8f8399; }.vx-document-service { margin:0 22px 14px; }.vx-document-service div { display:flex; justify-content:space-between; gap:16px; font-size:12px; }.vx-document-pay { display:grid; grid-template-columns:1fr 190px; gap:14px; padding:0 22px 20px; }.vx-document-pay section>span,.vx-document-pay section>strong,.vx-document-pay section>small { display:block; }.vx-document-pay section>span { margin-top:10px; color:#8f8399; font-size:10px; }.vx-document-pay section>strong { margin-top:3px; font-size:12px; }.vx-document-pay section>small { margin-top:3px; color:#B5AABB; word-break:break-all; }.vx-document-pay a { display:block; margin-top:14px; padding:11px; border-radius:5px; color:white; background:#8B24D6; text-align:center; text-decoration:none; font-size:11px; font-weight:750; }.vx-document-qr { display:grid; place-items:center; background:#fff; }.vx-document-qr small { color:#55485f!important; }.vx-document-proof { margin:0 22px 20px; }.vx-document-proof span,.vx-document-proof strong,.vx-document-proof small { display:block; }.vx-document-proof span { color:#8f8399; font-size:10px; }.vx-document-proof strong { margin:5px 0 12px; color:#D49AFF; font-size:20px; }.vx-document-proof small { color:#AAA0B1; }.vx-document>footer { display:flex; justify-content:center; padding:14px; border-top:1px solid #271c2f; color:#74697c; font-size:9px; }

#chargePublicView { box-sizing:border-box; min-height:100dvh; padding:22px 18px; background:radial-gradient(circle at 15% 0,rgba(93,22,138,.28),transparent 30%),radial-gradient(circle at 92% 100%,rgba(139,36,214,.16),transparent 28%),#07030D; color:#F7F3FA; font-family:'Inter',Arial,sans-serif; }
.vx-pay-page { width:min(920px,100%); margin:auto; }
.vx-pay-brand { display:flex; align-items:center; gap:10px; min-height:48px; margin-bottom:14px; }.vx-pay-logo { display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(212,154,255,.42); border-radius:12px; color:#fff; background:linear-gradient(145deg,#A52EFF,#5D168A); box-shadow:0 8px 26px rgba(139,36,214,.28); font-weight:900; }.vx-pay-brand>div:nth-child(2) strong,.vx-pay-brand>div:nth-child(2) span { display:block; }.vx-pay-brand>div:nth-child(2) strong { font-size:14px; letter-spacing:.16em; }.vx-pay-brand>div:nth-child(2) span { margin-top:3px; color:#8f8399; font-size:10px; }.vx-pay-secure { display:flex; align-items:center; gap:7px; margin-left:auto; padding:9px 12px; border:1px solid #2B2034; border-radius:999px; color:#AFA3B8; font-size:10px; }.vx-pay-secure i { width:7px; height:7px; border-radius:50%; background:#45d483; box-shadow:0 0 10px rgba(69,212,131,.7); }
.vx-pay-card { overflow:hidden; border:1px solid rgba(165,46,255,.32); border-radius:18px; background:linear-gradient(145deg,rgba(22,5,37,.98),rgba(8,4,12,.99) 52%); box-shadow:0 30px 90px rgba(0,0,0,.55); }.vx-pay-status { display:flex; align-items:center; gap:12px; padding:18px 22px; border-bottom:1px solid #261A2F; background:linear-gradient(90deg,rgba(93,22,138,.23),transparent); }.vx-pay-status>span { display:grid; place-items:center; width:36px; height:36px; border:1px solid rgba(212,154,255,.4); border-radius:10px; color:#D49AFF; background:rgba(139,36,214,.15); font-size:20px; }.vx-pay-status small,.vx-pay-status strong { display:block; }.vx-pay-status small { color:#9C929F; font-size:10px; text-transform:uppercase; letter-spacing:.11em; }.vx-pay-status strong { margin-top:4px; font-size:18px; }
.vx-pay-summary { display:grid; grid-template-columns:1fr auto; align-items:end; gap:20px; padding:17px 22px; border-bottom:1px solid #261A2F; }.vx-pay-summary span,.vx-pay-summary strong,.vx-pay-summary small { display:block; }.vx-pay-summary span { color:#817688; font-size:10px; }.vx-pay-summary strong { margin-top:5px; font-size:16px; }.vx-pay-summary small { margin-top:4px; color:#9C929F; font-size:11px; }.vx-pay-summary>div:last-child { text-align:right; }.vx-pay-summary>div:last-child strong { color:#D49AFF; font-size:28px; letter-spacing:-.04em; }
.vx-pay-content { display:grid; grid-template-columns:310px 1fr; min-height:310px; }.vx-pay-qr { display:flex; align-items:center; flex-direction:column; justify-content:center; padding:22px; border-right:1px solid #261A2F; text-align:center; }.vx-pay-qr-frame { display:grid; place-items:center; width:214px; height:214px; padding:12px; border-radius:14px; background:#fff; box-shadow:0 0 0 5px rgba(165,46,255,.09),0 14px 35px rgba(0,0,0,.28); }.vx-pay-qr strong { margin-top:15px; font-size:13px; }.vx-pay-qr>span { max-width:250px; margin-top:5px; color:#817688; font-size:10px; line-height:1.45; }
.vx-pay-copy { display:flex; flex-direction:column; justify-content:center; padding:28px; }.vx-pay-step { margin-bottom:20px; color:#D49AFF; font-size:11px; font-weight:750; }.vx-pay-copy label { margin-bottom:7px; color:#8f8399; font-size:10px; }.vx-pay-copy textarea { width:100%; height:82px; padding:12px; resize:none; border:1px solid #342540; border-radius:10px; outline:none; color:#BEB3C5; background:#08050C; font:500 10px/1.45 'JetBrains Mono',monospace; word-break:break-all; }.vx-pay-copy textarea:focus { border-color:#A52EFF; box-shadow:0 0 0 3px rgba(165,46,255,.1); }.vx-pay-copy button { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:54px; margin-top:12px; border:1px solid rgba(212,154,255,.52); border-radius:11px; color:#fff; background:linear-gradient(100deg,#A52EFF,#6F1BB0); box-shadow:0 12px 30px rgba(139,36,214,.28),inset 0 1px rgba(255,255,255,.2); font-size:13px; font-weight:800; cursor:pointer; transition:.18s ease; }.vx-pay-copy button:hover { transform:translateY(-1px); box-shadow:0 16px 36px rgba(139,36,214,.38); }.vx-pay-copy button.copied { border-color:#5be298; background:linear-gradient(100deg,#147548,#1ca264); box-shadow:0 12px 30px rgba(28,162,100,.22); }.vx-pay-copy p { min-height:28px; margin:9px 3px 0; color:#817688; font-size:10px; line-height:1.4; }
.vx-pay-card>footer { display:grid; grid-template-columns:auto 1fr auto auto; gap:10px; padding:13px 22px; border-top:1px solid #261A2F; color:#716578; font-size:9px; }.vx-pay-card>footer strong { color:#AFA3B8; font-family:'JetBrains Mono',monospace; }.vx-pay-trust { display:flex; justify-content:center; gap:22px; padding:14px; color:#716578; font-size:9px; }.vx-pay-trust span:first-child { color:#9C929F; }.vx-pay-success { display:grid; place-items:center; min-height:300px; padding:30px; text-align:center; }.vx-pay-success>span { display:grid; place-items:center; width:62px; height:62px; border:1px solid rgba(91,226,152,.45); border-radius:50%; color:#66e7a0; background:rgba(28,162,100,.13); font-size:30px; }.vx-pay-success h2 { margin:17px 0 0; }.vx-pay-success p { margin:7px 0 16px; color:#9C929F; }.vx-pay-success small { color:#817688; font-family:'JetBrains Mono',monospace; }
.vx-public-loading,.vx-public-not-found { display:grid; place-items:center; min-height:80dvh; color:#D49AFF; text-align:center; }.vx-public-not-found h1 { color:#F7F3FA; }.vx-public-not-found p { color:#9C929F; }
.vx-print-page { margin:0; padding:24px; background:#07030D; }.vx-print-page .vx-document { max-width:780px; }
@media print { @page { size:A4; margin:10mm; } .vx-print-page { padding:0; background:#07030D!important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }.vx-document { break-inside:avoid; } }

@media (max-width:768px) {
  .vx-finance-view { padding-bottom:104px!important; }
  .vx-fin-head-actions { display:none; }
  .vx-fin-toolbar { margin:14px 0; }
  .vx-fin-tabs { width:100%; overflow-x:auto; scrollbar-width:none; }.vx-fin-tabs::-webkit-scrollbar { display:none; }.vx-fin-tabs button { flex:1 0 auto; padding:0 14px; }
  .vx-fin-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.vx-fin-metrics article { min-height:112px; padding:15px; }.vx-fin-metrics strong { font-size:21px; }
  .vx-fin-split { grid-template-columns:1fr; }.vx-fin-panel { padding:13px; }.vx-received-panel { display:none; }
  .vx-list-toolbar { align-items:stretch; flex-direction:column; padding:15px; }.vx-list-toolbar select { width:100%; }
  .vx-charge-main { grid-template-columns:40px 1fr auto; gap:10px; padding:13px; }.vx-charge-avatar { width:40px;height:40px; }.vx-charge-amount { grid-column:2; }.vx-charge-amount strong { font-size:18px; }.vx-status { grid-column:3;grid-row:1/3;align-self:center;max-width:112px;white-space:normal;text-align:center;line-height:1.25; }.vx-charge-actions { display:grid; grid-template-columns:1fr 1fr auto; padding:9px; }.vx-action { min-height:42px; padding:0 8px; }.vx-action.icon { width:42px; }
  .vx-fin-table { border:0; background:transparent; }.vx-fin-table-head { display:none; }.vx-fin-table .vx-charge-card { display:block; margin-bottom:8px; border:1px solid #281a34; }.vx-fin-table .vx-charge-main { display:grid; grid-template-columns:1fr auto; gap:10px; padding:13px; }.vx-charge-client { grid-column:1/-1; padding:0; }.vx-fin-table .vx-charge-date { display:flex; justify-content:space-between; }.vx-fin-table .vx-charge-date::before { content:attr(data-label); color:#716578; }.vx-fin-table .vx-charge-amount { grid-column:1; }.vx-fin-table .vx-status { grid-column:2; grid-row:2/4; }.vx-fin-table .vx-charge-actions { display:grid; grid-template-columns:1fr 1fr; padding:9px; border-top:1px solid #211628; }.vx-fin-table .vx-action,.vx-fin-table .vx-action.icon { width:auto; min-height:40px; }
  .vx-report-summary { grid-template-columns:1fr 1fr; gap:8px; }.vx-report-summary article { min-height:95px; padding:14px; }.vx-report-summary article:first-child { grid-column:1/-1; }.vx-report-head { display:none; }.vx-report-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; min-height:0; margin-bottom:8px; padding:14px; border:1px solid #281a34; }.vx-report-person { grid-column:1/-1; padding-bottom:10px; border-bottom:1px solid #211628; }.vx-report-row>div[data-label] { display:flex; justify-content:space-between; }.vx-report-row>div[data-label]::before { content:attr(data-label); color:#716578; }.vx-report-action { grid-column:1/-1; }.vx-report-action button { width:100%; min-height:42px; }.vx-report-panel { border:0; background:transparent; }.vx-report-panel>header { margin-bottom:8px; border:1px solid #281a34; background:#09060D; }
  .vx-mobile-new-charge { position:fixed; right:18px; bottom:90px; z-index:9985; display:flex; align-items:center; gap:7px; min-height:52px; padding:0 18px; border:1px solid rgba(212,154,255,.48); border-radius:8px; color:white; background:linear-gradient(100deg,#A52EFF,#6F1BB0); box-shadow:0 16px 38px rgba(93,22,138,.48); font-weight:800; }
  .vx-charge-overlay,.vx-doc-overlay { padding:0; align-items:end; }.vx-charge-modal,.vx-doc-shell { width:100%; max-height:calc(100dvh - env(safe-area-inset-top)); border-radius:12px 12px 0 0; border-bottom:0; }.vx-charge-modal-head { padding:21px 18px 15px; }.vx-charge-form { grid-template-columns:1fr; padding:2px 18px 20px; }.vx-field-wide { grid-column:auto; }.vx-charge-modal-foot { position:sticky; bottom:0; padding:13px 18px max(15px,env(safe-area-inset-bottom)); background:#0A060F; }.vx-charge-modal-foot button { flex:1; }.vx-doc-body { padding:10px; }.vx-doc-shell>footer { position:sticky; bottom:0; background:#09060d; }.vx-doc-shell>footer button { flex:1; }
  .vx-document-top { padding:18px; }.vx-document-top span { font-size:17px; }.vx-document-top b { max-width:120px; text-align:right; word-break:break-all; }.vx-document-banner { margin:12px 12px 0; }.vx-document-grid { grid-template-columns:1fr; padding:12px; }.vx-document-service { margin:0 12px 12px; }.vx-document-pay { grid-template-columns:1fr; padding:0 12px 14px; }.vx-document-qr { min-height:176px; }.vx-document-proof { margin:0 12px 14px; }
  #chargePublicView { padding:14px 10px 24px; }.vx-pay-brand { margin:0 5px 11px; }.vx-pay-secure { padding:8px 10px; font-size:9px; }.vx-pay-card { border-radius:15px; }.vx-pay-status { padding:15px; }.vx-pay-summary { padding:15px; }.vx-pay-summary>div:last-child strong { font-size:24px; }.vx-pay-content { grid-template-columns:1fr; }.vx-pay-qr { padding:20px 15px; border-right:0; border-bottom:1px solid #261A2F; }.vx-pay-qr-frame { width:206px; height:206px; }.vx-pay-copy { padding:20px 15px; }.vx-pay-step { margin-bottom:14px; }.vx-pay-copy textarea { height:72px; }.vx-pay-copy button { min-height:56px; }.vx-pay-card>footer { grid-template-columns:auto 1fr; padding:13px 15px; }.vx-pay-card>footer strong { text-align:right; }.vx-pay-trust { align-items:center; flex-direction:column; gap:5px; }
}
@media (max-width:420px) { .vx-fin-metrics { grid-template-columns:1fr 1fr; }.vx-fin-metrics article { padding:13px; }.vx-fin-metrics strong { font-size:18px; }.vx-charge-person span { max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.vx-status { max-width:88px; font-size:8px; }.vx-charge-actions { grid-template-columns:1fr 1fr; }.vx-action.icon { width:auto; }.vx-document dl { grid-template-columns:82px 1fr; } }