/*
 * Design system: estúdio do criador e monetização.
 * Painel, vídeos (studio / gerenciar), comentários, analytics, ganhos,
 * carteira, anúncios, Go Pro, modais de pagamento, afiliados, compras.
 *
 * Escopo: .ds-studio (adicionado na raiz de cada template da área) para não
 * vazar para as páginas de configurações que reaproveitam as mesmas classes.
 */

/* ======================================================================
   Painel de conteúdo (ao lado da .settings-sidebar)
   ====================================================================== */











/* Divisor de seção */






/* ======================================================================
   KPI tiles
   ====================================================================== */





























/* ======================================================================
   Gráficos
   ====================================================================== */





















/* ======================================================================
   "Mais vistos" / vídeo em análise: linhas compactas
   ====================================================================== */























/* ======================================================================
   Video studio: lista em linhas
   ====================================================================== */





























































/* ======================================================================
   Comentários (gerenciador do estúdio)
   ====================================================================== */













































/* ======================================================================
   Tabelas (ganhos, anúncios) + DataTables
   ====================================================================== */













































/* Linha de anúncio: categoria e ações */
















/* ======================================================================
   Anúncios: cabeçalho, saldos, formulários
   ====================================================================== */









































































/* ======================================================================
   Carteira
   ====================================================================== */

























/* Formulários de recarga/transferência dentro do SweetAlert */




















/* ======================================================================
   Modal de forma de pagamento (#pay-go-pro > .payment_method)
   ====================================================================== */

.payment_box .modal-header .modal-title {
  margin: 0;
  padding: 0;
  background: transparent !important;
  color: var(--foreground);
  font-size: var(--text-xl);
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.payment_box .payment_method {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: var(--space-2);
  margin: 0;
  padding: var(--space-2) var(--space-6) var(--space-6);
}

.payment_box .payment_method:empty {
  display: none;
}

.payment_box .payment_method > .btn,
.payment_box .btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: 88px;
  margin: 0;
  padding: var(--space-3) var(--space-2);
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--foreground) !important;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: 500;
  line-height: var(--leading-tight);
  text-align: center;
  white-space: normal;
  transition: border-color var(--duration) var(--ease), background-color var(--duration) var(--ease);
}

.payment_box .payment_method > .btn:hover,
.payment_box .btn:hover {
  border-color: var(--muted-foreground) !important;
  background: var(--accent) !important;
  box-shadow: none !important;
}

.payment_box .payment_method > .btn:focus-visible {
  box-shadow: var(--focus-ring) !important;
}

.payment_box .payment_method > .btn[disabled] {
  opacity: .6;
}

.payment_box .payment_method > .btn svg,
.payment_box .payment_method > .btn img {
  flex: none;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  object-fit: contain;
}



.payment_box .payment_method > .btn span {
  color: inherit !important;
  font-size: inherit;
}

@media (max-width: 480px) {
  .payment_box .payment_method {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: var(--space-2) var(--space-4) var(--space-4);
  }
}

/* Modais de cartão / banco / pagar com carteira */

#2checkout_modal .modal-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}















/* ======================================================================
   Go Pro: cartões de preço
   ====================================================================== */































































/* Já é PRO (fallback dentro de go_pro) */












/* Página "agora você é PRO" */








/* ======================================================================
   Gerenciar vídeos (grade de cards com ações)
   ====================================================================== */









































/* ======================================================================
   Afiliados
   ====================================================================== */