/* ============================================================
   TEMA PÚBLICO - SISTEMA DE RIFAS
   Versão 3 — melhorias visuais
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700;800&display=swap');

* {
  font-family: 'Barlow', Montserrat, sans-serif !important;
}

/* === VARIÁVEIS === */
:root {
  --border-color:                   #1e2a3a;
  --incrivel-primaria:              var(--primary);
  --incrivel-primariaColor:         var(--bg-base);
  --incrivel-primariaLink:          0, 229, 200;
  --incrivel-primariaLinkHover:     #ffffff;
  --incrivel-primariaDarken:        var(--primary-dark);
  --incrivel-primariaDarkenColor:   #ffffff;
  --incrivel-primariaDarkenLink:    #ffffff;
  --incrivel-primariaDarkenLinkHover: var(--primary);
  --incrivel-bg:                    var(--bg-base);
  --incrivel-bgColor:               var(--text-primary);
  --incrivel-bgLink:                var(--primary);
  --incrivel-bgLinkHover:           var(--primary-dark);
  --incrivel-rgba:                  13, 17, 23;
  --incrivel-rgbaInvert:            240, 244, 255;
  --incrivel-formBg:                var(--bg-card);
  --incrivel-formBgHover:           var(--border-color);
  --incrivel-formBgHoverColor:      var(--text-primary);
  --incrivel-formBorder:            var(--border-color);
  --incrivel-formColor:             var(--text-secondary);
  --incrivel-cardBg:                var(--bg-card);
  --incrivel-cardColor:             var(--text-primary);
  --incrivel-cardLink:              var(--primary);
  --incrivel-modalBg:               var(--bg-card);
  --incrivel-modalBorder:           var(--border-color);
  --incrivel-modalColor:            var(--text-primary);
  --incrivel-border:                var(--border-color);
  --bs-body-bg:                     var(--bg-base);
  --bs-body-color:                  var(--text-primary);
}

/* === FUNDO GERAL === */
body {
  background-color: var(--bg-base) !important;
  color: var(--text-primary) !important;
}

/* === HEADER === */
.header-app-header {
  background: var(--bg-base) !important;
  border-bottom: 1px solid var(--border-color) !important;
}
.header-app-header-container {
  background: rgba(10,14,24,0.97) !important;
  backdrop-filter: blur(12px);
}
.black-bar {
  background: var(--bg-base) !important;
}

/* === MENU MOBILE === */
.modal-content.bg-cor-primaria {
  background: var(--bg-base) !important;
}
.nav-vertical ul li a {
  color: rgba(255,255,255,0.85) !important;
  border-bottom: 1px solid var(--border-color) !important;
  padding: 14px 8px !important;
  transition: color 0.2s !important;
}
.nav-vertical ul li a:hover {
  color: var(--primary) !important;
}

/* === CARDS DE CAMPANHAS === */
.SorteioTpl_sorteioTpl__2s2Wu,
.css-szgt2f {
  background-color: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 20px #00000060 !important;
  overflow: hidden !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
.SorteioTpl_sorteioTpl__2s2Wu:hover {
  border-color: var(--primary) !important;
  box-shadow: 0 6px 32px var(--primary)35 !important;
}
.SorteioTpl_title__3RLtu {
  color: var(--text-primary) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
}
.SorteioTpl_descricao__1b7iL,
.css-g6ngok {
  color: var(--text-secondary) !important;
  font-size: 0.85rem !important;
}
.SorteioTpl_info__t1BZr {
  background: linear-gradient(to top, var(--bg-card) 55%, transparent) !important;
}

/* === BADGES === */
.badge.bg-success,
.badge.blink.bg-success {
  background-color: var(--primary) !important;
  color: var(--bg-base) !important;
  font-weight: 700 !important;
  border-radius: 6px !important;
  font-size: 0.75rem !important;
  padding: 4px 10px !important;
}
.badge.bg-danger {
  background-color: #fd5977 !important;
  color: #fff !important;
}
.badge.bg-dark {
  background-color: var(--border-color) !important;
  color: var(--text-secondary) !important;
}

/* === TÍTULO DA PÁGINA === */
.app-title h1 {
  color: var(--text-primary) !important;
  font-weight: 800 !important;
}
.app-title-desc {
  color: var(--text-secondary) !important;
}

/* === CARDS GERAIS === */
.app-card,
.app-main .card,
.bg-card,
.bg-white {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 16px !important;
  color: var(--text-primary) !important;
}

/* === PREÇO "por apenas R$ XX,XX" === */
.badge-light,
[class*="preco"] {
  background: linear-gradient(135deg, var(--primary)20, var(--primary-dark)15) !important;
  color: var(--primary) !important;
  border: 1.5px solid var(--primary)50 !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  padding: 6px 14px !important;
}

/* === BOTÃO VER MEUS BILHETES === */
.btn-outline-dark,
.btn-outline-secondary,
.btn-light,
.btn-secondary {
  background: var(--bg-card) !important;
  color: var(--text-secondary) !important;
  border: 1.5px solid var(--border-color) !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  transition: border-color 0.2s, color 0.2s !important;
}
.btn-outline-dark:hover,
.btn-outline-secondary:hover {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  background: var(--bg-card) !important;
}

/* === BOTÃO PARTICIPAR / QUERO PARTICIPAR === */
.btn-success,
.btn-primary,
.css-1mcv32d {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  color: var(--bg-base) !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 24px var(--primary)45 !important;
  letter-spacing: 0.02em !important;
  transition: all 0.2s ease !important;
}
.btn-success:hover,
.btn-primary:hover {
  background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%) !important;
  box-shadow: 0 6px 32px var(--primary)65 !important;
  color: var(--bg-base) !important;
  transform: translateY(-1px);
}

/* === CARDS DE QUANTIDADE (+10, +20...) === */
.vendasExpressNumsSelect.v2 .item .item-content {
  background-color: var(--bg-card) !important;
  border: 1.5px solid var(--border-color) !important;
  color: var(--text-primary) !important;
  border-radius: 14px !important;
  min-height: 90px !important;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s !important;
}
.vendasExpressNumsSelect.v2 .item .item-content:hover {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 2px var(--primary)30 !important;
  transform: translateY(-2px);
}
.vendasExpressNumsSelect.v2 .item .item-content h3,
.vendasExpressNumsSelect.v2 .item .item-content .h3 {
  color: var(--text-primary) !important;
  font-weight: 800 !important;
  font-size: 1.6em !important;
}
.vendasExpressNumsSelect.v2 .item .item-content p,
.vendasExpressNumsSelect.v2 .item .item-content small,
.vendasExpressNumsSelect.v2 .item .item-content span {
  color: var(--text-secondary) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

/* === CARD "MAIS POPULAR" === */
.vendasExpressNumsSelect.v2 .item.mais-popular .item-content {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  border: 2px solid var(--primary) !important;
  box-shadow: 0 6px 24px var(--primary-glow) !important;
}
.vendasExpressNumsSelect.v2 .item.mais-popular .item-content h3,
.vendasExpressNumsSelect.v2 .item.mais-popular .item-content .h3 {
  color: var(--button-color) !important;
  font-weight: 800 !important;
}
.vendasExpressNumsSelect.v2 .item.mais-popular .item-content p,
.vendasExpressNumsSelect.v2 .item.mais-popular .item-content small,
.vendasExpressNumsSelect.v2 .item.mais-popular .item-content span {
  color: var(--button-color) !important;
  opacity: 0.75;
}
.vendasExpressNumsSelect .item.mais-popular:before {
  background: var(--primary) !important;
  color: var(--button-color) !important;
  font-weight: 700 !important;
  border-radius: 0 0 6px 6px !important;
}

/* === INPUT DE QUANTIDADE (+ e -) === */
.css-gvbuk1 {
  background-color: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border: 1.5px solid var(--border-color) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  transition: border-color 0.2s !important;
}
.css-gvbuk1:hover {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
}
input[type="number"],
.css-uv8p8d {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
}

/* === BADGE DISPONÍVEL === */
.css-dtzixn {
  color: var(--primary) !important;
  border-color: var(--primary) !important;
  font-weight: 700 !important;
}

/* === GANHADORES === */
.ganhadorItem_ganhadorContainer__1Sbxm {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 16px !important;
  padding: 14px !important;
  transition: border-color 0.2s !important;
}
.ganhadorItem_ganhadorContainer__1Sbxm:hover {
  border-color: var(--primary) !important;
}
.ganhadorItem_ganhadorNome__2j_J- {
  color: var(--text-primary) !important;
  font-weight: 700 !important;
}
.ganhadorItem_ganhadorDescricao__Z4kO2 p {
  color: var(--text-secondary) !important;
}
.ganhadorItem_ganhadorDescricao__Z4kO2 b {
  color: var(--primary) !important;
}

/* === PERGUNTAS FREQUENTES === */
.pergunta-item {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 12px !important;
  color: var(--text-primary) !important;
  transition: border-color 0.2s !important;
}
.pergunta-item:hover {
  border-color: var(--primary)50 !important;
}
.pergunta-item--pergunta {
  color: var(--text-primary) !important;
  font-weight: 600 !important;
}
.pergunta-item--resp p {
  color: var(--text-secondary) !important;
}
.incrivel-primariaLink {
  color: var(--primary) !important;
}

/* === MODAIS === */
.modal-content {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-primary) !important;
  border-radius: 18px !important;
}
.modal-header {
  border-bottom: 1px solid var(--border-color) !important;
}
.modal-footer {
  border-top: 1px solid var(--border-color) !important;
}
.modal-title {
  color: var(--text-primary) !important;
  font-weight: 700 !important;
}

/* === INPUTS === */
input, select, textarea {
  background-color: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
  border-radius: 10px !important;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px var(--primary)25 !important;
  outline: none !important;
}
input::placeholder {
  color: var(--text-secondary) !important;
}

/* === TEXTOS === */
.text-muted, .text-secondary {
  color: var(--text-secondary) !important;
}
h1, h2, h3, h4, h5, h6 {
  color: var(--text-primary) !important;
}
p { color: var(--text-secondary); }
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-dark); }

/* === SCROLLBAR === */
::-webkit-scrollbar { width: 5px; background: var(--bg-base); }
::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--primary); }

/* === BILHETES PREMIADOS - COR CONFIGURÁVEL === */
.bg-gradient-blue2,
.app-titulos-premiados--item.bg-gradient-blue2,
.app-titulos-premiados--item.app-titulos-premiados--selected,
.app-titulos-premiados--item.bg-gradient-blue2.app-titulos-premiados--selected {
  background: var(--ticket-winner, #00d4c8) !important;
  background-color: var(--ticket-winner, #00d4c8) !important;
  background-image: none !important;
  border-color: var(--ticket-winner, #00d4c8) !important;
  color: #0d1117 !important;
}

/* === RESPONSIVO === */
@media (max-width: 600px) {
  .SorteioTpl_title__3RLtu { font-size: 0.95rem !important; }
  .vendasExpressNumsSelect.v2 .item .item-content h3 { font-size: 1.4em !important; }
}