/* 
 * Tema Abelha e Trevo da Sorte
 * Cores inspiradas na natureza: verde das folhas do trevo e amarelo dourado da abelha
 * Criado para o sistema de rifas
 */

:root {
  /* Paleta Principal - Verde e Branco */
  --bee-clover-primary: #2d5016; /* Verde escuro das folhas do trevo */
  --bee-clover-primary-light: #4a7c59; /* Verde médio */
  --bee-clover-primary-lighter: #6b9b7a; /* Verde claro */
  --bee-clover-primary-lightest: #8db39a; /* Verde muito claro */

  /* Cores de Apoio - Amarelo Dourado da Abelha */
  --bee-clover-accent: #f4d03f; /* Amarelo dourado da abelha */
  --bee-clover-accent-dark: #d4b02a; /* Amarelo dourado escuro */
  --bee-clover-accent-light: #f7e066; /* Amarelo dourado claro */

  /* Cores Neutras */
  --bee-clover-white: #ffffff;
  --bee-clover-off-white: #f8f9fa;
  --bee-clover-light-gray: #e9ecef;
  --bee-clover-gray: #6c757d;
  --bee-clover-dark-gray: #495057;
  --bee-clover-black: #212529;

  /* Cores de Status */
  --bee-clover-success: #28a745; /* Verde sucesso */
  --bee-clover-warning: #ffc107; /* Amarelo aviso */
  --bee-clover-danger: #dc3545; /* Vermelho perigo */
  --bee-clover-info: #17a2b8; /* Azul informação */

  /* Gradientes */
  --bee-clover-gradient-primary: linear-gradient(
    135deg,
    var(--bee-clover-primary) 0%,
    var(--bee-clover-primary-light) 100%
  );
  --bee-clover-gradient-accent: linear-gradient(
    135deg,
    var(--bee-clover-accent) 0%,
    var(--bee-clover-accent-dark) 100%
  );
  --bee-clover-gradient-nature: linear-gradient(
    135deg,
    var(--bee-clover-primary-lightest) 0%,
    var(--bee-clover-accent-light) 100%
  );

  /* Sombras */
  --bee-clover-shadow-sm: 0 2px 4px rgba(45, 80, 22, 0.1);
  --bee-clover-shadow: 0 4px 8px rgba(45, 80, 22, 0.15);
  --bee-clover-shadow-lg: 0 8px 16px rgba(45, 80, 22, 0.2);

  /* Bordas */
  --bee-clover-border-radius: 12px;
  --bee-clover-border-radius-sm: 8px;
  --bee-clover-border-radius-lg: 16px;

  /* Transições */
  --bee-clover-transition: all 0.3s ease;
  --bee-clover-transition-fast: all 0.15s ease;
}

/* Atualização das variáveis do sistema existente */
:root {
  /* Substituindo as variáveis do sistema com o novo tema */
  --sonhodigital-primaria: var(--bee-clover-primary);
  --sonhodigital-primariaColor: var(--bee-clover-white);
  --sonhodigital-primariaHover: var(--bee-clover-primary-light);
  --sonhodigital-primariaLink: var(--bee-clover-accent);
  --sonhodigital-primariaDarken: var(--bee-clover-primary);
  --sonhodigital-primariaDarkenColor: var(--bee-clover-white);

  --sonhodigital-bg: var(--bee-clover-off-white);
  --sonhodigital-bgColor: var(--bee-clover-black);
  --sonhodigital-bgLink: var(--bee-clover-primary);

  --sonhodigital-cardBg: var(--bee-clover-white);
  --sonhodigital-cardColor: var(--bee-clover-black);
  --sonhodigital-cardLink: var(--bee-clover-primary);

  --sonhodigital-modalBg: var(--bee-clover-white);
  --sonhodigital-modalColor: var(--bee-clover-black);

  --sonhodigital-formBg: var(--bee-clover-white);
  --sonhodigital-formBgHover: var(--bee-clover-light-gray);
  --sonhodigital-formBorder: var(--bee-clover-light-gray);
  --sonhodigital-formColor: var(--bee-clover-black);

  --sonhodigital-rgba: 45, 80, 22;
  --sonhodigital-rgbaInvert: 255, 255, 255;

  /* Variáveis de cores personalizadas */
  --cor-primaria: var(--bee-clover-primary);
  --cor-primaria-light: var(--bee-clover-primary-lightest);
  --cor-primaria-lighten: var(--bee-clover-primary-lighter);
  --cor-primaria-link: var(--bee-clover-accent);
  --cor-secundaria: var(--bee-clover-accent);
  --cor-secundaria-link: var(--bee-clover-white);
}

/* Elementos decorativos de abelha e trevo */
.bee-clover-decoration {
  position: relative;
}

.bee-clover-decoration::before {
  content: "🍀";
  position: absolute;
  top: -5px;
  right: -5px;
  font-size: 1.2em;
  opacity: 0.7;
  z-index: 1;
}

.bee-clover-decoration::after {
  content: "🐝";
  position: absolute;
  bottom: -5px;
  left: -5px;
  font-size: 1em;
  opacity: 0.6;
  z-index: 1;
}

/* Estilos para títulos com tema de abelha e trevo */
.app-title h1 {
  background: var(--bee-clover-gradient-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 700;
  text-shadow: 2px 2px 4px rgba(45, 80, 22, 0.1);
}

.app-title h1::before {
  content: "🍀 ";
  -webkit-text-fill-color: var(--bee-clover-primary);
  margin-right: 8px;
}

.app-title h1::after {
  content: " 🐝";
  -webkit-text-fill-color: var(--bee-clover-accent);
  margin-left: 8px;
}

/* Melhorias nos cards de sorteio */
.SorteioTpl_sorteioTpl__2s2Wu {
  background: var(--bee-clover-gradient-nature);
  border: 2px solid var(--bee-clover-primary-lightest);
  box-shadow: var(--bee-clover-shadow);
  transition: var(--bee-clover-transition);
  position: relative;
  overflow: hidden;
}

.SorteioTpl_sorteioTpl__2s2Wu:hover {
  transform: translateY(-2px);
  box-shadow: var(--bee-clover-shadow-lg);
  border-color: var(--bee-clover-accent);
}

.SorteioTpl_sorteioTpl__2s2Wu::before {
  content: "🍀";
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 1.5em;
  opacity: 0.3;
  z-index: 1;
}

.SorteioTpl_sorteioTpl__2s2Wu::after {
  content: "🐝";
  position: absolute;
  bottom: 10px;
  left: 10px;
  font-size: 1.2em;
  opacity: 0.2;
  z-index: 1;
}

/* Títulos dos sorteios */
.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_title__3RLtu {
  color: var(--bee-clover-primary);
  font-weight: 600;
  text-shadow: 1px 1px 2px rgba(45, 80, 22, 0.1);
}

.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_title__3RLtu a {
  color: inherit;
  text-decoration: none;
  transition: var(--bee-clover-transition-fast);
}

.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_title__3RLtu a:hover {
  color: var(--bee-clover-accent);
}

/* Descrições dos sorteios */
.SorteioTpl_sorteioTpl__2s2Wu .SorteioTpl_descricao__1b7iL {
  color: var(--bee-clover-dark-gray);
  font-weight: 500;
}

/* Badges de status melhorados */
.badge {
  border-radius: var(--bee-clover-border-radius-sm);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: var(--bee-clover-shadow-sm);
}

.badge.bg-success {
  background: var(--bee-clover-gradient-primary) !important;
  color: var(--bee-clover-white);
}

.badge.bg-dark {
  background: var(--bee-clover-gradient-accent) !important;
  color: var(--bee-clover-primary);
}

/* Botões com tema de abelha e trevo */
.btn-cor-primaria {
  background: var(--bee-clover-gradient-primary);
  border: 2px solid var(--bee-clover-primary);
  color: var(--bee-clover-white);
  border-radius: var(--bee-clover-border-radius);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: var(--bee-clover-shadow);
  transition: var(--bee-clover-transition);
  position: relative;
  overflow: hidden;
}

.btn-cor-primaria::before {
  content: "🍀";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.7;
}

.btn-cor-primaria:hover {
  background: var(--bee-clover-gradient-accent);
  border-color: var(--bee-clover-accent);
  color: var(--bee-clover-primary);
  transform: translateY(-2px);
  box-shadow: var(--bee-clover-shadow-lg);
}

.btn-cor-primaria:hover::before {
  content: "🐝";
}

/* Cards de ganhadores */
.ganhadorItem_ganhadorContainer__1Sbxm {
  background: var(--bee-clover-gradient-nature);
  border: 2px solid var(--bee-clover-primary-lightest);
  border-radius: var(--bee-clover-border-radius);
  box-shadow: var(--bee-clover-shadow);
  transition: var(--bee-clover-transition);
}

.ganhadorItem_ganhadorContainer__1Sbxm:hover {
  transform: translateY(-2px);
  box-shadow: var(--bee-clover-shadow-lg);
  border-color: var(--bee-clover-accent);
}

.ganhadorItem_ganhadorContainer__1Sbxm::before {
  content: "🏆";
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 1.5em;
  opacity: 0.6;
}

/* Títulos de ganhadores */
.ganhadorItem_ganhadorNome__2j_J- {
  color: var(--bee-clover-primary);
  font-weight: 700;
  text-shadow: 1px 1px 2px rgba(45, 80, 22, 0.1);
}

.ganhadorItem_ganhadorDescricao__Z4kO2 {
  color: var(--bee-clover-dark-gray);
  font-weight: 500;
}

/* Perguntas frequentes */
.pergunta-item {
  background: var(--bee-clover-gradient-nature) !important;
  border: 2px solid var(--bee-clover-primary-lightest);
  border-radius: var(--bee-clover-border-radius);
  box-shadow: var(--bee-clover-shadow-sm);
  transition: var(--bee-clover-transition);
}

.pergunta-item:hover {
  border-color: var(--bee-clover-accent);
  box-shadow: var(--bee-clover-shadow);
}

.pergunta-item--pergunta {
  color: var(--bee-clover-primary);
  font-weight: 600;
}

.pergunta-item--pergunta i {
  color: var(--bee-clover-accent) !important;
}

/* Header com tema de abelha e trevo */
.app-header {
  background: var(--bee-clover-gradient-primary) !important;
  box-shadow: var(--bee-clover-shadow-lg);
}

/* Footer */
.app-footer {
  background: var(--bee-clover-gradient-primary) !important;
  color: var(--bee-clover-white);
}

/* Melhorias gerais */
body {
  background: var(--bee-clover-off-white);
  font-family: "Montserrat", sans-serif;
}

/* Animações sutis */
@keyframes bee-float {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-3px);
  }
}

@keyframes clover-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.bee-clover-decoration::after {
  animation: bee-float 3s ease-in-out infinite;
}

.bee-clover-decoration::before {
  animation: clover-spin 4s linear infinite;
}

/* Responsividade */
@media (max-width: 768px) {
  .app-title h1::before,
  .app-title h1::after {
    font-size: 0.8em;
  }

  .SorteioTpl_sorteioTpl__2s2Wu::before,
  .SorteioTpl_sorteioTpl__2s2Wu::after {
    font-size: 1em;
  }
}