/**
 * BRZ Brand UI — camada de design (carrega DEPOIS de zimpay-theme.css)
 * Primária #007a03 (verde) | Secundária #1d1b6f (azul-marinho)
 *
 * Regras de uso:
 *  - Verde #007a03 = preenchimento (botão, aba ativa) com texto branco (5,5:1).
 *  - Verde claro (--brand-300) = texto/ícone/link sobre fundo escuro (#007a03 sozinho dá só 3,5:1).
 *  - Marinho #1d1b6f = superfície de destaque (hero, saldo, sidebar ativa, secundário). Nunca texto sobre fundo escuro.
 *  - Marinho claro (--navy-300) = texto/ícone secundário sobre fundo escuro.
 *  Só aditivo: remover este arquivo e o <link> volta ao visual anterior.
 */

:root {
  /* Verde — escala da marca */
  --brand-900: #013d02;
  --brand-800: #015403;
  --brand-700: #006202;
  --brand-600: #007a03; /* BASE */
  --brand-500: #0a9a0e;
  --brand-400: #2fbf34;
  --brand-300: #6ee072; /* texto/ícone sobre escuro */
  --brand-200: #b6f2b8;
  --brand-100: #e3f9e4;

  /* Marinho — escala da marca */
  --navy-950: #0a0924;
  --navy-900: #100f45;
  --navy-800: #16145a;
  --navy-700: #1d1b6f; /* BASE */
  --navy-600: #2a28a0;
  --navy-500: #3d3bc4;
  --navy-300: #aaa9f0; /* texto/ícone sobre escuro */
  --navy-200: #d0d0fa;

  --brand-gradient: linear-gradient(135deg, var(--brand-500) 0%, var(--brand-600) 55%, var(--brand-700) 100%);
  --navy-gradient: linear-gradient(135deg, var(--navy-700) 0%, var(--navy-900) 70%, var(--navy-950) 100%);
  --hero-gradient: linear-gradient(135deg, var(--navy-700) 0%, #0f2a4d 55%, var(--brand-800) 120%);

  --brand-ring: 0 0 0 3px rgba(47, 191, 52, 0.35);
  --brand-glow: 0 6px 18px rgba(0, 122, 3, 0.35);

  /* Compatibilidade com o tema existente */
  --zimpay-accent-text: var(--brand-300);
}

/* ============ Tipografia e foco ============ */
body { -webkit-font-smoothing: antialiased; }

[data-theme-mode="dark"] :focus-visible {
  outline: 2px solid var(--brand-400);
  outline-offset: 2px;
}

[data-theme-mode="dark"] ::selection { background: rgba(47, 191, 52, 0.35); color: #fff; }

/* ============ Links e textos de destaque (contraste sobre escuro) ============ */
[data-theme-mode="dark"] a:not(.nav-link):not(.submenu-link):not(.btn):not(.dropdown-item) {
  color: var(--brand-300);
}
[data-theme-mode="dark"] a:not(.nav-link):not(.submenu-link):not(.btn):not(.dropdown-item):hover {
  color: var(--brand-200);
}
[data-theme-mode="dark"] .text-primary { color: var(--brand-300) !important; }
[data-theme-mode="dark"] .text-secondary { color: var(--navy-300) !important; }
[data-theme-mode="dark"] .bg-primary-transparent,
[data-theme-mode="dark"] .bg-primary-subtle { background: rgba(0, 122, 3, 0.16) !important; color: var(--brand-300) !important; }
[data-theme-mode="dark"] .bg-secondary-transparent,
[data-theme-mode="dark"] .bg-secondary-subtle { background: rgba(61, 59, 196, 0.22) !important; color: var(--navy-300) !important; }

/* ============ Botões ============ */
[data-theme-mode="dark"] .btn { border-radius: 8px; font-weight: 600; letter-spacing: .005em; transition: background-color .15s, box-shadow .15s, transform .05s, border-color .15s; }
[data-theme-mode="dark"] .btn:active { transform: translateY(1px); }

[data-theme-mode="dark"] .btn-primary {
  background: var(--brand-gradient) !important;
  border-color: var(--brand-600) !important;
  color: #fff !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset, var(--brand-glow);
}
[data-theme-mode="dark"] .btn-primary:hover,
[data-theme-mode="dark"] .btn-primary:focus {
  background: linear-gradient(135deg, var(--brand-400) 0%, var(--brand-500) 60%, var(--brand-600) 100%) !important;
  border-color: var(--brand-500) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.16) inset, 0 8px 22px rgba(0, 122, 3, 0.45);
}
[data-theme-mode="dark"] .btn-primary:focus-visible { box-shadow: var(--brand-ring); }
[data-theme-mode="dark"] .btn-primary:disabled,
[data-theme-mode="dark"] .btn-primary.disabled { opacity: .55; box-shadow: none; }

[data-theme-mode="dark"] .btn-outline-primary {
  color: var(--brand-300) !important;
  border-color: rgba(110, 224, 114, 0.45) !important;
  background: transparent !important;
}
[data-theme-mode="dark"] .btn-outline-primary:hover {
  background: rgba(0, 122, 3, 0.18) !important;
  border-color: var(--brand-400) !important;
  color: #fff !important;
}

/* Secundário = marinho da marca */
[data-theme-mode="dark"] .btn-secondary {
  background: var(--navy-700) !important;
  border-color: var(--navy-600) !important;
  color: #fff !important;
}
[data-theme-mode="dark"] .btn-secondary:hover,
[data-theme-mode="dark"] .btn-secondary:focus {
  background: var(--navy-600) !important;
  border-color: var(--navy-500) !important;
}
[data-theme-mode="dark"] .btn-outline-secondary {
  color: var(--navy-300) !important;
  border-color: rgba(170, 169, 240, 0.4) !important;
  background: transparent !important;
}
[data-theme-mode="dark"] .btn-outline-secondary:hover {
  background: rgba(61, 59, 196, 0.25) !important;
  color: #fff !important;
}

/* ============ Formulários ============ */
[data-theme-mode="dark"] .form-control,
[data-theme-mode="dark"] .form-select {
  border-radius: 8px;
  transition: border-color .15s, box-shadow .15s, background-color .15s;
}
[data-theme-mode="dark"] .form-control:focus,
[data-theme-mode="dark"] .form-select:focus {
  border-color: var(--brand-400) !important;
  box-shadow: var(--brand-ring) !important;
}
[data-theme-mode="dark"] .form-check-input:checked {
  background-color: var(--brand-600);
  border-color: var(--brand-500);
}
[data-theme-mode="dark"] .form-check-input:focus { box-shadow: var(--brand-ring); border-color: var(--brand-400); }
[data-theme-mode="dark"] .form-label { color: #e4e4e7; font-weight: 500; }

/* ============ Sidebar ============ */
[data-theme-mode="dark"] .app-sidebar {
  background-image: linear-gradient(180deg, rgba(29, 27, 111, 0.28) 0%, rgba(29, 27, 111, 0) 38%) !important;
}
[data-theme-mode="dark"] .app-sidebar .nav-link { border-radius: 8px; margin: 2px 8px; transition: background-color .15s; }
[data-theme-mode="dark"] .app-sidebar .nav-link.active {
  background: linear-gradient(90deg, rgba(0, 122, 3, 0.24) 0%, rgba(29, 27, 111, 0.30) 100%) !important;
  box-shadow: inset 3px 0 0 var(--brand-400);
}
[data-theme-mode="dark"] .app-sidebar .nav-link.active .nav-text { font-weight: 600; }
[data-theme-mode="dark"] .app-sidebar .icon-wrapper.sidebar-icon,
[data-theme-mode="dark"] .app-sidebar .icon-wrapper.sidebar-icon i { color: var(--brand-300) !important; }
[data-theme-mode="dark"] .app-sidebar .submenu-link:hover { color: var(--brand-300) !important; background: rgba(0, 122, 3, 0.14) !important; }

/* ============ Cards ============ */
[data-theme-mode="dark"] .card,
[data-theme-mode="dark"] .card.custom-card {
  transition: border-color .2s, box-shadow .2s;
}
[data-theme-mode="dark"] .card:hover,
[data-theme-mode="dark"] .card.custom-card:hover { border-color: rgba(110, 224, 114, 0.16) !important; }
[data-theme-mode="dark"] .card-header .card-title,
[data-theme-mode="dark"] .card-title { font-weight: 600; letter-spacing: -.005em; }

/* ============ Card de saldo (hero) ============ */
[data-theme-mode="dark"] .wallet-card {
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(0, 122, 3, 0.30) 0%, transparent 55%),
    var(--navy-gradient) !important;
  border: 1px solid rgba(170, 169, 240, 0.18) !important;
  border-top: none !important;
  box-shadow: 0 10px 28px rgba(10, 9, 36, 0.55) !important;
}
[data-theme-mode="dark"] .wallet-tab-btn.active { color: var(--brand-300) !important; box-shadow: inset 0 -2px 0 var(--brand-400); }
[data-theme-mode="dark"] .wallet-amount-main,
[data-theme-mode="dark"] .wallet-balance-display { font-weight: 700; letter-spacing: -.02em; }
[data-theme-mode="dark"] .wallet-extrato-link { color: var(--navy-300) !important; }

/* ============ Acessos rápidos ============ */
[data-theme-mode="dark"] .shortcut-icon,
[data-theme-mode="dark"] .quick-access-btn,
[data-theme-mode="dark"] .quick-access-icon-wrap {
  transition: transform .15s, border-color .15s, background-color .15s, box-shadow .15s;
}
[data-theme-mode="dark"] .shortcut-icon i,
[data-theme-mode="dark"] .quick-access-icon-wrap i { color: var(--brand-300) !important; }
[data-theme-mode="dark"] a:hover > .shortcut-icon,
[data-theme-mode="dark"] a:hover .quick-access-icon-wrap,
[data-theme-mode="dark"] .quick-access-btn:hover {
  transform: translateY(-2px);
  border-color: rgba(110, 224, 114, 0.4) !important;
  background: linear-gradient(160deg, rgba(0, 122, 3, 0.22), rgba(29, 27, 111, 0.35)) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35) !important;
}

/* ============ Tabelas e listas ============ */
[data-theme-mode="dark"] .table > :not(caption) > * > th,
[data-theme-mode="dark"] .table thead th {
  background: rgba(29, 27, 111, 0.30) !important;
  color: var(--navy-200) !important;
  font-size: .78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  border-bottom: 1px solid rgba(170, 169, 240, 0.18) !important;
}
[data-theme-mode="dark"] .table-hover > tbody > tr:hover > * { background: rgba(0, 122, 3, 0.08) !important; }
[data-theme-mode="dark"] .list-group-item:hover { background: rgba(0, 122, 3, 0.07) !important; }

/* ============ Badges / paginação / abas ============ */
[data-theme-mode="dark"] .badge.bg-primary { background: var(--brand-600) !important; color: #fff; }
[data-theme-mode="dark"] .badge.bg-secondary { background: var(--navy-700) !important; color: #fff; }
[data-theme-mode="dark"] .page-item.active .page-link { background: var(--brand-600) !important; border-color: var(--brand-500) !important; color: #fff !important; }
[data-theme-mode="dark"] .page-link { color: var(--brand-300); }
[data-theme-mode="dark"] .nav-tabs .nav-link.active,
[data-theme-mode="dark"] .nav-pills .nav-link.active {
  color: #fff !important;
  background: var(--brand-600) !important;
  border-color: var(--brand-500) !important;
}
[data-theme-mode="dark"] .progress-bar { background: var(--brand-gradient); }

/* ============ Modais / dropdown ============ */
[data-theme-mode="dark"] .modal-content { border: 1px solid rgba(170, 169, 240, 0.16) !important; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55); }
[data-theme-mode="dark"] .modal-header { border-bottom-color: rgba(170, 169, 240, 0.14) !important; }
[data-theme-mode="dark"] .dropdown-item:hover,
[data-theme-mode="dark"] .dropdown-item:focus { background: rgba(0, 122, 3, 0.14) !important; color: #fff !important; }
[data-theme-mode="dark"] .dropdown-item.active { background: var(--brand-600) !important; }

/* ============ Navegação mobile ============ */
[data-theme-mode="dark"] .mobile-bottom-nav-item.is-active { color: var(--brand-300) !important; }
[data-theme-mode="dark"] .mobile-bottom-nav-item.is-active .mobile-bottom-nav-icon { color: var(--brand-300) !important; }
[data-theme-mode="dark"] .mobile-bottom-nav-fab { background: var(--brand-gradient) !important; box-shadow: var(--brand-glow); }

/* ============ Scrollbar ============ */
[data-theme-mode="dark"] * { scrollbar-width: thin; scrollbar-color: rgba(170, 169, 240, 0.28) transparent; }

/* ============ Movimento reduzido ============ */
@media (prefers-reduced-motion: reduce) {
  [data-theme-mode="dark"] * { transition: none !important; animation: none !important; }
}
