.elementor-26 .elementor-element.elementor-element-725b36e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-1cae96d */<!-- INÍCIO: Quiz Bíblia da Confeitaria (Otimizado para Elementor/WordPress) -->

<!-- 1. ESTILOS CSS -->
<!-- Cole este bloco de estilos preferencialmente no CSS Personalizado do Elementor (Avançado > CSS Personalizado) ou em um widget HTML ANTES do conteúdo do quiz -->
<style>
    /* Estilos globais (mantidos) */
    /* Adaptações para melhor integração podem ser necessárias dependendo do tema */
    .quiz-confeitaria-container body {
        /* Removido para não conflitar com o body da página principal */
    }
    .quiz-confeitaria-container {
        font-family: 'Segoe UI', sans-serif;
        background: #0a0a0a;
        color: #d8d8d8;
        padding: 1px 0; /* Evita colapso de margem */
    }

    .quiz-confeitaria-container .topbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        background: #111;
        padding: 14px 24px;
        border-bottom: 1px solid #FF1493;
        box-shadow: 0 2px 10px rgba(255, 20, 147, 0.1);
        position: sticky;
        top: 0; /* Pode precisar ajustar se houver barra de admin do WP */
        z-index: 1000;
    }

    .quiz-confeitaria-container .info-esquerda {
        display: flex;
        flex-direction: column;
        font-size: 14px;
        color: #FF1493;
        gap: 4px;
    }

    .quiz-confeitaria-container .info-direita {
        display: flex;
        align-items: center;
    }

    .quiz-confeitaria-container .logo-topbar {
        height: 38px;
        max-width: 100px;
        width: 70px;
        object-fit: contain;
    }

    .quiz-confeitaria-container .bloco {
        max-width: 720px;
        margin: 48px auto;
        padding: 36px 24px;
        background: #111111;
        border-radius: 18px;
        border: 1px solid rgba(255, 20, 147, 0.05);
        box-shadow: 0 0 24px rgba(255, 20, 147, 0.03);
        text-align: left;
        display: none; /* Inicialmente oculto */
        opacity: 0;
        transform: translateY(40px);
        transition: all 0.6s ease;
        line-height: 1.8;
    }

    .quiz-confeitaria-container .bloco.ativo {
        display: block;
        opacity: 1;
        transform: translateY(0);
    }

    .quiz-confeitaria-container .titulo-bloco {
        font-size: 1.8em;
        font-weight: 700;
        text-align: center;
        color: #FF1493;
        margin-bottom: 12px;
        line-height: 1.3;
    }

    .quiz-confeitaria-container .titulo-bloco::after {
        content: '';
        display: block;
        width: 80px;
        height: 3px;
        background: linear-gradient(90deg, #FF1493, #FF69B4);
        margin: 12px auto 20px;
        border-radius: 6px;
        animation: pulse-glow 2s infinite;
    }

    @keyframes pulse-glow {
        0%, 100% {
            opacity: 0.7;
            box-shadow: 0 0 6px #FF1493;
        }
        50% {
            opacity: 1;
            box-shadow: 0 0 12px #FF1493;
        }
    }

    .quiz-confeitaria-container .bloco p {
        text-align: left;
        font-size: 1.1em;
        margin: 16px 0;
    }

    .quiz-confeitaria-container input[type="text"] {
        padding: 14px 16px;
        font-size: 1em;
        width: 100%;
        max-width: 360px;
        border-radius: 10px;
        border: 1px solid #FF1493;
        background-color: #0c0c0c;
        color: #FF1493;
        margin: 24px auto;
        display: block;
        text-align: center;
        box-shadow: 0 0 10px rgba(255, 20, 147, 0.08);
        box-sizing: border-box; /* Garante padding dentro da largura */
    }

    .quiz-confeitaria-container .botao {
        padding: 16px 32px;
        border-radius: 12px;
        background-color: #FF1493;
        color: #000;
        font-weight: 700;
        font-size: 1.1em;
        border: none;
        cursor: pointer;
        transition: all 0.25s ease-in-out;
        box-shadow: 0 0 20px rgba(255, 20, 147, 0.15);
        margin: 20px auto 0;
        display: block;
        text-transform: uppercase;
    }

    .quiz-confeitaria-container .botao:hover {
        background-color: #FF69B4;
        transform: scale(1.05);
        box-shadow: 0 0 26px rgba(255, 20, 147, 0.35);
    }

    .quiz-confeitaria-container #notificacao-ganho {
        position: fixed;
        top: 100px; /* Pode precisar ajustar */
        right: 20px;
        background: #0d0d0d;
        border: 2px solid #FF1493;
        padding: 16px 24px;
        border-radius: 12px;
        color: #FF1493;
        font-family: 'Segoe UI', sans-serif;
        font-size: 14px;
        font-weight: bold;
        opacity: 0;
        transform: translateY(-20px);
        z-index: 10000;
        transition: all 0.4s ease;
        box-shadow: 0 0 20px rgba(255, 20, 147, 0.3);
        text-align: center;
        line-height: 1.4;
    }

    .quiz-confeitaria-container #notificacao-ganho span {
        display: block;
        margin-top: 6px;
        font-size: 18px;
        font-weight: bold;
        color: #ffffff;
    }

    .quiz-confeitaria-container #notificacao-ganho.mostrar {
        opacity: 1;
        transform: translateY(0);
    }

    .quiz-confeitaria-container .lista-pontos {
        list-style: none;
        padding: 0;
        margin: 24px 0;
    }

    .quiz-confeitaria-container .lista-pontos li {
        margin-bottom: 14px;
        font-size: 1.05em;
        padding: 12px 18px;
        border-left: 4px solid #FF1493;
        background: rgba(255, 20, 147, 0.035);
        border-radius: 8px;
        display: flex;
        gap: 12px;
        align-items: center;
    }

    .quiz-confeitaria-container #loading-missao {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.85);
        display: none;
        justify-content: center;
        align-items: center;
        z-index: 9999;
    }

    .quiz-confeitaria-container .spinner {
        width: 50px;
        height: 50px;
        border: 5px solid rgba(255, 20, 147, 0.3);
        border-radius: 50%;
        border-top-color: #FF1493;
        animation: spin 1s ease-in-out infinite;
    }

    @keyframes spin {
        to { transform: rotate(360deg); }
    }

    .quiz-confeitaria-container .logo-base64 {
        display: block;
        margin: 0 auto;
        max-width: 100px;
    }
</style>/* End custom CSS */