/*
    Customização de cores - Jony Dgrau - VERSÃO 4
    Objetivo:
    - Padronizar o site inteiro em roxo, preto e branco
    - Transformar botões verdes/azuis/vermelhos em roxo
    - Ajustar Chance em Dobro, Roletas Instantâneas, Caixas Instantâneas e Títulos Premiados
    - Manter contraste dos textos para leitura

    Instalação:
    Enviar para: public/css/custom-colors.css
    Este arquivo sobrescreve as cores antigas sem alterar os CSS originais do sistema.
*/

:root {
    --jd-purple: #7420C8;
    --jd-purple-dark: #551492;
    --jd-purple-light: #8B35E3;
    --jd-purple-soft: #EEE3FA;
    --jd-black: #050505;
    --jd-black-soft: #111111;
    --jd-white: #FFFFFF;
    --jd-ice: #F1F1F1;
    --jd-text-dark: #101010;
    --jd-text-muted: #6B6B6B;
    --jd-border: rgba(0, 0, 0, .12);
    --jd-shadow: 0 4px 8px rgba(0, 0, 0, .10);
    --jd-purple-gradient: linear-gradient(90deg, var(--jd-purple), var(--jd-purple-dark));
    --jd-purple-gradient-soft: linear-gradient(135deg, var(--jd-purple-light), var(--jd-purple-dark));
}

/* TOPO DO SITE: fundo branco e ícones pretos */
nav,
.back-range {
    background: var(--jd-white) !important;
}

nav .container-nav .header-nav i {
    color: var(--jd-black) !important;
}

nav .container-nav .popup-nav {
    background: linear-gradient(180deg, var(--jd-purple), var(--jd-purple-dark)) !important;
}

nav .container-nav .popup-nav .container-popup-nav .header-popup #closePopupButton,
nav .container-nav .popup-nav .container-popup-nav .target-user h4,
nav .container-nav .popup-nav .container-popup-nav .target-user a i,
nav .container-nav .popup-nav .container-popup-nav .options-nav ul a,
nav .container-nav .popup-nav .container-popup-nav .options-nav ul li i {
    color: var(--jd-white) !important;
}

nav .container-nav .popup-nav .container-popup-nav .options-nav ul li .new,
nav .container-nav .popup-nav .container-popup-nav .options-nav button {
    background: var(--jd-purple-light) !important;
    color: var(--jd-white) !important;
}

/* BOTÕES E ELEMENTOS GLOBAIS: verde/azul/vermelho -> roxo */
.info-single .background-gradient span,
.promotions .promotion-content div,
.container-winner-single,
.select-single .content-select .popular,
.select-single .content-select .popular button,
.select-single .add-to-cart .btn-add-to-cart,
.normal-single .controls-normal .btn-normal .result-pagos,
.normal-single .controls-normal .btn-normal .result-reservados,
.normal-single .modal-normal .modal-normal-content .add-to-cart-normal .btn-add-rn,
.share-buttons a,
.socials-icons a,
.order-details button,
.payment-modal button,
.btn-primary,
button[type="submit"],
input[type="submit"] {
    background: var(--jd-purple-gradient) !important;
    color: var(--jd-white) !important;
    border-color: var(--jd-purple-dark) !important;
}

.select-single .add-to-cart .btn-add-to-cart:hover,
.normal-single .modal-normal .modal-normal-content .add-to-cart-normal .btn-add-rn:hover,
.btn-primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    background: linear-gradient(90deg, var(--jd-purple-dark), var(--jd-purple)) !important;
    color: var(--jd-white) !important;
}

.progress-bar .progress_inner {
    background: repeating-linear-gradient(
        45deg,
        var(--jd-purple-dark),
        var(--jd-purple-dark) 10px,
        var(--jd-purple-light) 10px,
        var(--jd-purple-light) 20px
    ) !important;
}

/* PROMOÇÕES: botões roxos e textos brancos */
.promotions .promotion-content {
    background: var(--jd-white) !important;
    border: none !important;
    box-shadow: var(--jd-shadow) !important;
}

.promotions .promotion-content div,
.promotions .promotion-content div span {
    color: var(--jd-white) !important;
}

/* PREÇO/DATA */
.date-price .date-single span {
    background: var(--jd-black) !important;
    color: var(--jd-white) !important;
    box-shadow: var(--jd-shadow) !important;
}

.date-price .price-single div {
    background: var(--jd-white) !important;
    color: var(--jd-purple) !important;
    border: 1px solid var(--jd-border) !important;
    box-shadow: var(--jd-shadow) !important;
}

.date-price .price-single div .price-value {
    color: var(--jd-purple) !important;
}

/* FRASE "Quanto mais títulos..." */
.select-single > p {
    background: var(--jd-black) !important;
    color: var(--jd-white) !important;
    border: none !important;
    box-shadow: var(--jd-shadow) !important;
}

/* QUADRADOS DE SELEÇÃO: antes pretos, agora brancos */
.select-single .content-select .select {
    background: var(--jd-white) !important;
    color: var(--jd-black) !important;
    border: 1px solid rgba(0, 0, 0, .08) !important;
    box-shadow: var(--jd-shadow) !important;
}

.select-single .content-select .select span,
.select-single .content-select .select h3 {
    color: var(--jd-purple) !important;
}

.select-single .content-select .select p {
    color: var(--jd-black) !important;
}

/* QUADRADO MAIS POPULAR */
.select-single .content-select .popular {
    background: var(--jd-purple-gradient-soft) !important;
    border: 2px solid var(--jd-purple-dark) !important;
}

.select-single .content-select .popular span,
.select-single .content-select .popular h3,
.select-single .content-select .popular p {
    color: var(--jd-white) !important;
}

.select-single .content-select .popular button {
    background: rgba(255, 255, 255, .13) !important;
    color: var(--jd-white) !important;
}

/* CAMPO DE QUANTIDADE */
.select-single .add-to-cart .quantity-input {
    background: var(--jd-black) !important;
    border: 1px solid rgba(255, 255, 255, .10) !important;
    box-shadow: var(--jd-shadow) !important;
}

.select-single .add-to-cart .quantity-input input[type="number"] {
    background: var(--jd-black-soft) !important;
    color: var(--jd-white) !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
}

.select-single .add-to-cart .quantity-input .bi-dash-circle,
.select-single .add-to-cart .quantity-input .bi-plus-circle-fill {
    color: var(--jd-white) !important;
}

/* BOTÃO PARTICIPAR */
.select-single .add-to-cart .btn-add-to-cart,
.select-single .add-to-cart .btn-add-to-cart .bi-arrow-right-square-fill,
.select-single .add-to-cart .btn-add-to-cart span h3,
.select-single .add-to-cart .btn-add-to-cart span .participate,
.select-single .add-to-cart .btn-add-to-cart span .participate p {
    color: var(--jd-white) !important;
}

/* DESCRIÇÃO/REGULAMENTO */
.description-single {
    background: var(--jd-black) !important;
    border: none !important;
    box-shadow: var(--jd-shadow) !important;
}

.description-single .btn-Description,
.description-single .btn-Description i,
.description-single .description {
    color: var(--jd-white) !important;
}

/* HEADLINES: Ranking, Títulos Premiados, Roletas, Caixas e demais títulos pretos */
.ranking .title-ranking h4,
.ranking .title-ranking h4 i,
.ranking .title-ranking p,
.normal-single .normal-title h4,
.normal-single .normal-title p,
.awards-roulette-single .title-award-roulette .title-award-section h4,
.awards-roulette-single .title-award-roulette .title-award-section .title-award-roulette-text h4,
.awards-roulette-single .title-award-roulette .title-award-section .title-award-roulette-text p,
.awards-box-single .title-award-box .title-award-section h4,
.awards-box-single .title-award-box .title-award-section .title-award-box-text h4,
.awards-box-single .title-award-box .title-award-section .title-award-box-text p,
.promotions .promotion-single h3,
.normal-single .normal-title h4 {
    color: var(--jd-black) !important;
}

.promotions .promotion-single p {
    color: var(--jd-purple) !important;
}

/* RANKING: cards brancos, título preto, detalhes roxos */
.ranking .container-ranking div {
    background: var(--jd-white) !important;
    border: 1px solid rgba(0, 0, 0, .06) !important;
    box-shadow: var(--jd-shadow) !important;
}

.ranking .container-ranking div span,
.ranking .container-ranking div h3 {
    color: var(--jd-purple) !important;
}

.ranking .container-ranking div p {
    color: var(--jd-text-muted) !important;
}

.ranking .title-ranking h4 span {
    background: var(--jd-purple-gradient) !important;
    color: var(--jd-white) !important;
}

/* CHANCE EM DOBRO */
.container-double-chance {
    background: var(--jd-purple-gradient-soft) !important;
    border-radius: 7px !important;
    box-shadow: var(--jd-shadow) !important;
}

.container-double-chance .title-double-chance,
.container-double-chance .valid-double-chance {
    color: var(--jd-white) !important;
}

.progress-bar-double-chance {
    background: rgba(255, 255, 255, .22) !important;
    border: 1px solid rgba(255, 255, 255, .25) !important;
}

.progress-bar-inner {
    background: repeating-linear-gradient(
        45deg,
        #ffffff,
        #ffffff 10px,
        #e9d8ff 10px,
        #e9d8ff 20px
    ) !important;
}

.progress-bar-double-chance p.timer {
    color: var(--jd-white) !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .70) !important;
}

/* ROLETAS INSTANTÂNEAS E CAIXAS INSTANTÂNEAS */
.spins-single .spins-container .spins-content,
.boxes-single .boxes-container .boxes-content {
    background: var(--jd-purple-gradient-soft) !important;
    color: var(--jd-white) !important;
    box-shadow: var(--jd-shadow) !important;
}

.spins-single .spins-container .spins-content:nth-child(odd),
.spins-single .spins-container .spins-content:nth-child(even),
.boxes-single .boxes-container .boxes-content:nth-child(odd),
.boxes-single .boxes-container .boxes-content:nth-child(even) {
    background: var(--jd-purple-gradient-soft) !important;
}

.spins-single .spins-container .spins-content h4,
.spins-single .spins-container .spins-content h5,
.spins-single .spins-container .spins-content p,
.boxes-single .boxes-container .boxes-content h4,
.boxes-single .boxes-container .boxes-content h5,
.boxes-single .boxes-container .boxes-content p {
    color: var(--jd-white) !important;
}

/* TÍTULOS PREMIADOS / PRÊMIOS: total, disponíveis, sorteados e ver mais */
.awards-roulette-single .title-award-roulette .total-awards-roulette,
.awards-box-single .title-award-box .total-awards-box,
.awards-roulette-single .awards-won-available button:first-child,
.awards-roulette-single .awards-won-available button:last-child,
.awards-box-single .awards-won-available button:first-child,
.awards-box-single .awards-won-available button:last-child,
.awards-roulette-single .load-more-awards-roulette,
.awards-box-single .load-more-awards-box {
    background: var(--jd-purple-gradient) !important;
    color: var(--jd-white) !important;
    border: none !important;
    box-shadow: var(--jd-shadow) !important;
}

.awards-roulette-single .title-award-roulette .total-awards-roulette p,
.awards-roulette-single .title-award-roulette .total-awards-roulette h5,
.awards-box-single .title-award-box .total-awards-box p,
.awards-box-single .title-award-box .total-awards-box h5,
.awards-roulette-single .awards-won-available button,
.awards-box-single .awards-won-available button,
.awards-roulette-single .load-more-awards-roulette,
.awards-box-single .load-more-awards-box {
    color: var(--jd-white) !important;
}

.awards-roulette-single .awards-grid .grid-awards-available .awards-available-content,
.awards-box-single .awards-grid-box .grid-awards-available-box .awards-available-content {
    background: var(--jd-white) !important;
    color: var(--jd-black) !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    box-shadow: var(--jd-shadow) !important;
}

.awards-roulette-single .awards-grid .grid-awards-available .awards-available-content p,
.awards-box-single .awards-grid-box .grid-awards-available-box .awards-available-content p {
    color: var(--jd-black) !important;
}

.awards-roulette-single .awards-grid .grid-awards-won .awards-won-content,
.awards-box-single .awards-grid-box .grid-awards-won-box .awards-won-content {
    background: var(--jd-purple-gradient) !important;
    color: var(--jd-white) !important;
    box-shadow: var(--jd-shadow) !important;
}

.awards-roulette-single .awards-grid .grid-awards-won .awards-won-content p,
.awards-roulette-single .awards-grid .grid-awards-won .awards-won-content span,
.awards-box-single .awards-grid-box .grid-awards-won-box .awards-won-content p,
.awards-box-single .awards-grid-box .grid-awards-won-box .awards-won-content span {
    color: var(--jd-white) !important;
}

/* RIFA NORMAL: controles e botão participar */
.normal-single .controls-normal .btn-normal .result-livres,
.normal-single .select-normal .numbers-normal .btn-select,
.normal-single .modal-normal .modal-normal-content .list-numbers span {
    background: var(--jd-purple-gradient) !important;
    color: var(--jd-white) !important;
}

.normal-single .select-normal .numbers-normal .btn-select:hover {
    background: linear-gradient(90deg, var(--jd-purple-dark), var(--jd-purple)) !important;
}

.normal-single .select-normal .numbers-normal .btn-select p,
.normal-single .modal-normal .modal-normal-content .add-to-cart-normal .btn-add-rn .icon-rn,
.normal-single .modal-normal .modal-normal-content .add-to-cart-normal .btn-add-rn .participate-raffle-normal h3,
.normal-single .modal-normal .modal-normal-content .add-to-cart-normal .btn-add-rn .participate-raffle-normal p {
    color: var(--jd-white) !important;
}

/* Links e destaques gerais */
a,
.text-primary {
    color: var(--jd-purple) !important;
}

/* Evita que links dentro de botões fiquem roxos e sumam no fundo */
button a,
.btn a,
.select-single .add-to-cart .btn-add-to-cart a,
.normal-single .modal-normal .modal-normal-content .add-to-cart-normal .btn-add-rn a,
.awards-roulette-single .load-more-awards-roulette a,
.awards-box-single .load-more-awards-box a {
    color: var(--jd-white) !important;
}

/* Responsivo */
@media only screen and (max-width: 789px) {
    .promotions .promotion-content div {
        font-size: .64em;
    }

    .select-single .content-select .select p {
        color: var(--jd-black) !important;
    }

    .select-single .content-select .popular p,
    .spins-single .spins-container .spins-content p,
    .boxes-single .boxes-container .boxes-content p {
        color: var(--jd-white) !important;
    }
}


/* ===== CORREÇÕES V4 - FORÇA AS CORES NOS BLOCOS QUE TINHAM STYLE INLINE ===== */

/* Roletas e Caixas: classes individuais para garantir que TODAS fiquem roxas */
.spins-single .spins-container .select-spin-1,
.spins-single .spins-container .select-spin-2,
.spins-single .spins-container .select-spin-3,
.spins-single .spins-container .select-spin-4,
.spins-single .spins-container .select-spin-5,
.spins-single .spins-container .select-spin-6,
.boxes-single .boxes-container .select-box-1,
.boxes-single .boxes-container .select-box-2,
.boxes-single .boxes-container .select-box-3,
.boxes-single .boxes-container .select-box-4,
.boxes-single .boxes-container .select-box-5,
.boxes-single .boxes-container .select-box-6 {
    background: linear-gradient(90deg, #7420C8, #551492) !important;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .10) !important;
}

.spins-single .spins-container .spins-content *,
.boxes-single .boxes-container .boxes-content * {
    color: #FFFFFF !important;
}

/* Chance em dobro: temporizador legível em branco */
.progress-bar-double-chance p.timer,
.container-double-chance .progress-bar-double-chance p.timer,
.container-double-chance .timer {
    color: #FFFFFF !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .75) !important;
}

.progress-bar-double-chance,
.container-double-chance .progress-bar-double-chance {
    background: rgba(255, 255, 255, .20) !important;
    border: 1px solid rgba(255, 255, 255, .45) !important;
}

.progress-bar-inner,
.container-double-chance .progress-bar-inner {
    background: linear-gradient(90deg, rgba(255,255,255,.28), rgba(255,255,255,.10)) !important;
}

/* Botão Ver Mais de Títulos Premiados e outros botões de carregar mais */
.draw-titles-single .load-more-titles-awards,
.load-more-titles-awards,
.load-more-awards-roulette,
.load-more-awards-box,
.awards-roulette-single .load-more-awards-roulette,
.awards-box-single .load-more-awards-box {
    background: linear-gradient(90deg, #7420C8, #551492) !important;
    background-color: #7420C8 !important;
    color: #FFFFFF !important;
    border: none !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, .10) !important;
}

.draw-titles-single .load-more-titles-awards *,
.load-more-titles-awards *,
.load-more-awards-roulette *,
.load-more-awards-box * {
    color: #FFFFFF !important;
}

/* Títulos premiados: título preto e botão ver mais roxo */
.draw-titles-single .title-draw-titles h4,
.draw-titles-single .title-draw-titles p,
.draw-titles-single h4,
.draw-titles-single p {
    color: #111111 !important;
}

/* Mantém textos dentro de botões e blocos roxos em branco */
.draw-titles-single .load-more-titles-awards,
.draw-titles-single .load-more-titles-awards i,
.awards-roulette-single .load-more-awards-roulette,
.awards-roulette-single .load-more-awards-roulette i,
.awards-box-single .load-more-awards-box,
.awards-box-single .load-more-awards-box i {
    color: #FFFFFF !important;
}
