:root {
  --cx-bg: #050a12;
  --cx-surface: #0b1420;
  --cx-surface-2: #101c2a;
  --cx-surface-3: #152334;
  --cx-line: #263a50;
  --cx-line-strong: #3d5873;
  --cx-text: #f7fbff;
  --cx-muted: #a7b6c8;
  --cx-subtle: #788ba2;
  --cx-teal: #19d3c5;
  --cx-green: #28d783;
  --cx-red: #ff616c;
  --cx-amber: #ffc857;
  --cx-shadow: 0 18px 45px rgba(0, 0, 0, .30);
}

html:has(body.tb-customer-v2) {
  background: var(--cx-bg) !important;
}

body.tb-customer-v2 {
  min-height: 100vh;
  background:
    radial-gradient(circle at 8% 0%, rgba(25, 211, 197, .08), transparent 25rem),
    radial-gradient(circle at 92% 8%, rgba(57, 120, 255, .09), transparent 26rem),
    var(--cx-bg) !important;
  color: var(--cx-text) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

.tb-customer-v2 :is(.container, .tbShell, .tbMain, .tbContent, .main, .page, .shell) {
  color: var(--cx-text) !important;
}

.tb-customer-v2 :is(.tbMain, .tbContent, .main, .page) {
  background: transparent !important;
}

.tb-customer-v2 .tbShell,
.tb-customer-v2 .tbCards {
  background: transparent !important;
  color: var(--cx-text) !important;
}

.tb-customer-v2 :is(.card, .tbSaldoCard, .quickBtn, .balanceCard, .stat, .method, .payBox, .instructions, .historyItem, .toolbar, .orderCard, .ticket, .resumenItem) {
  border: 1px solid var(--cx-line) !important;
  border-radius: 10px !important;
  background: var(--cx-surface) !important;
  color: var(--cx-text) !important;
  box-shadow: none !important;
}

.tb-customer-v2 :is(h1, h2, h3, h4, .title, .tbTopTitle, .productName, .methodTitle, .resumenValue) {
  color: var(--cx-text) !important;
  letter-spacing: 0 !important;
}

.tb-customer-v2 :is(.small, .sub, .tbTopSub, .tbSaldoLabel, .methodSub, .resumenLabel, p) {
  color: var(--cx-muted) !important;
}

.tb-customer-v2 :is(input, select, textarea) {
  border: 1px solid var(--cx-line-strong) !important;
  border-radius: 8px !important;
  background: #08121d !important;
  color: var(--cx-text) !important;
  box-shadow: none !important;
}

.tb-customer-v2 :is(input, select, textarea):focus {
  border-color: var(--cx-teal) !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(25, 211, 197, .13) !important;
}

.tb-customer-v2 :is(button, .btn, .btnTop, .btnLight, .btnBlue, .btnGreen, .btnGray, .appNavBtn) {
  border-radius: 8px !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}

.tb-customer-v2 :is(.btnBlue, .btnGreen, .btnPurple, .appNavBtn.primary) {
  border: 1px solid var(--cx-teal) !important;
  background: var(--cx-teal) !important;
  color: #041917 !important;
  font-weight: 850 !important;
}

.tb-customer-v2 :is(.btnLight, .btnGray, .btnTop, .appNavBtn) {
  border: 1px solid var(--cx-line) !important;
  background: var(--cx-surface-2) !important;
  color: var(--cx-text) !important;
}

.tb-customer-v2 :is(button, .quickBtn, .method) {
  transition: border-color .16s ease, background-color .16s ease, transform .16s ease !important;
}

.tb-customer-v2 :is(button, .quickBtn, .method):hover {
  border-color: var(--cx-teal) !important;
}

/* Panel cliente */
.tb-customer-v2 .clienteAppHero {
  border: 1px solid var(--cx-line) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(115deg, rgba(14, 119, 120, .96), rgba(28, 83, 170, .92)),
    var(--cx-surface) !important;
  box-shadow: var(--cx-shadow) !important;
}

.tb-customer-v2 .clienteAppHero :is(h1, p, .clienteHeroKicker) {
  color: #fff !important;
}

.tb-customer-v2 .clienteHeroChips span {
  border: 1px solid rgba(255, 255, 255, .22) !important;
  background: rgba(5, 15, 27, .24) !important;
  color: #fff !important;
}

.tb-customer-v2 .tbSectionTitle {
  color: var(--cx-teal) !important;
}

.tb-customer-v2 .tbCards #tbSaldoCard {
  padding: 20px !important;
  border-color: var(--cx-line) !important;
  background: var(--cx-surface) !important;
  color: var(--cx-text) !important;
}

.tb-customer-v2 .tbCards #tbSaldoCard h3 {
  color: var(--cx-text) !important;
}

.tb-customer-v2 .tbCards #tbSaldoCard > .small {
  color: var(--cx-muted) !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile {
  border-top: 1px solid var(--cx-line) !important;
  min-height: 148px !important;
  padding: 18px !important;
  background: linear-gradient(145deg, #0d1825, #0a121d) !important;
  color: var(--cx-text) !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile:hover {
  background: var(--cx-surface-2) !important;
  transform: translateY(-2px) !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile :is(b, .small) {
  color: var(--cx-text) !important;
  -webkit-text-fill-color: currentColor !important;
  opacity: 1 !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile .small {
  color: var(--cx-muted) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile > span:last-child {
  color: var(--cx-text) !important;
  opacity: 1 !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile.lockedPremium {
  border-color: rgba(255, 97, 108, .42) !important;
  background: linear-gradient(145deg, rgba(58, 22, 32, .72), #0a121d) !important;
}

.tb-customer-v2 .tbCards .quickBtn.tbClientTile:nth-child(4) {
  border-color: rgba(255, 97, 108, .38) !important;
  background: linear-gradient(145deg, rgba(58, 22, 32, .72), #0a121d) !important;
}

/* Saldo */
.tb-customer-v2 .top,
.tb-customer-v2 .hero {
  border: 1px solid var(--cx-line) !important;
  border-radius: 10px !important;
  background: linear-gradient(110deg, #0d696d, #2459b3) !important;
  color: #fff !important;
  box-shadow: var(--cx-shadow) !important;
}

.tb-customer-v2 .top :is(.title, .sub),
.tb-customer-v2 .hero :is(h1, p) {
  color: #fff !important;
}

.tb-customer-v2 .balanceCard {
  background: linear-gradient(145deg, #0d1d29, #0a141f) !important;
}

.tb-customer-v2 .appNav .appNavBtn {
  color: var(--cx-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 .appNav .appNavBtn.primary {
  color: #041917 !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 :is(.balanceValue, .stat b, .payValue) {
  color: var(--cx-green) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 .stat span,
.tb-customer-v2 .card label,
.tb-customer-v2 .payBox label,
.tb-customer-v2 .payLabel,
.tb-customer-v2 .instructions,
.tb-customer-v2 .instructions li,
.tb-customer-v2 .payBox .small {
  color: var(--cx-muted) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 .card h3,
.tb-customer-v2 .instructions b,
.tb-customer-v2 .methodTitle {
  color: var(--cx-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 .amountBox {
  border-color: var(--cx-line-strong) !important;
  background: #08121d !important;
}

.tb-customer-v2 .amountBox input,
.tb-customer-v2 .payBox input,
.tb-customer-v2 .payBox select,
.tb-customer-v2 #paymentId {
  color: var(--cx-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 #monto {
  color: var(--cx-text) !important;
  -webkit-text-fill-color: var(--cx-text) !important;
}

.tb-customer-v2 .stats .stat b :is(#totalSolicitado, #totalPendiente) {
  color: var(--cx-green) !important;
  -webkit-text-fill-color: var(--cx-green) !important;
}

.tb-customer-v2 .copyRow input[readonly] {
  background: #eef5ff !important;
  color: #07111f !important;
  -webkit-text-fill-color: #07111f !important;
}

.tb-customer-v2 .currency {
  border-color: var(--cx-line) !important;
  background: var(--cx-surface-2) !important;
  color: var(--cx-teal) !important;
}

.tb-customer-v2 .method.active {
  border-color: var(--cx-teal) !important;
  background: rgba(25, 211, 197, .10) !important;
}

.tb-customer-v2 .methodSub,
.tb-customer-v2 .method .methodSub {
  color: var(--cx-muted) !important;
  -webkit-text-fill-color: currentColor !important;
}

.tb-customer-v2 .payHero {
  background: linear-gradient(115deg, #0e4f65, #1d4fa9) !important;
}

/* Historial y soporte */
.tb-customer-v2 .toolbar {
  padding: 12px !important;
}

.tb-customer-v2 .ordersGrid,
.tb-customer-v2 #listaTickets {
  gap: 10px !important;
}

.tb-customer-v2 .resumenItem {
  padding: 14px !important;
}

.tb-customer-v2 .toast {
  border: 1px solid var(--cx-line) !important;
  background: var(--cx-surface-2) !important;
  color: var(--cx-text) !important;
}

@media (max-width: 720px) {
  body.tb-customer-v2 {
    font-size: 15px !important;
  }

  .tb-customer-v2 :is(.main, .page, .tbContent) {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .tb-customer-v2 .clienteAppHero {
    padding: 18px !important;
  }

  .tb-customer-v2 .clienteAppHero h1 {
    font-size: 30px !important;
  }

  .tb-customer-v2 .quickBtn.tbClientTile {
    min-height: 112px !important;
  }
}