.elementor-166 .elementor-element.elementor-element-d65698c{--display:flex;--padding-top:60px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(min-width:768px){.elementor-166 .elementor-element.elementor-element-d65698c{--content-width:992px;}}/* Start custom CSS for shortcode, class: .elementor-element-6cc0e3c */:root {
            --color-primary-dark: #688024; /* Azul/Verde escuro para títulos e elementos principais */
            --color-primary-light: #688024; /* Azul/Verde claro para bordas e destaques */
            --color-accent: #FF9800; /* Laranja para botões de ação */
            --color-text-dark: #333333;
            --color-text-medium: #424242;
            --color-background-light: #f7f7f7;
            --color-card-background: #ffffff;
            --color-card-border: #e0e0e0;
            --color-fieldset-border: #d0d0d0;
            --color-light-background: #e0f2f1; /* Um tom bem claro do primário */
        }

        /* General styling for the body and main container */
        body {
            font-family: 'Inter', sans-serif; /* Usando Inter para um visual limpo e moderno */
            margin: 0;
            padding: 20px;
            display: flex;
            justify-content: center;
        }

        .oraculo-pet-system {
            max-width: 600px;
            width: 100%;
            background-color: var(--color-card-background);
            padding: 30px;
            border-radius: 12px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
            box-sizing: border-box;
        }

        /* Styling for individual form cards */
        .oraculo-card {
            background-color: var(--color-card-background);
            border: 1px solid var(--color-card-border);
            border-radius: 8px;
            padding: 25px;
            margin-bottom: 20px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
        }

        .oraculo-card h3 {
            /* Alterações para o título "DADOS DOS PETS" */
            font-size: 1.1em; /* Tamanho da fonte diminuído */
            background-color: var(--color-primary-dark); /* Fundo com a cor primária escura */
            color: white; /* Cor do texto branca */
            border-bottom: none; /* Remove a borda inferior */
            padding: 10px 30px; /* Ajuste de padding para formato de pílula */
            border-radius: 50px; /* Borda arredondada para formato de pílula */
            display: table; /* Permite que o elemento se ajuste ao conteúdo e seja centralizado */
            margin: 0 auto 20px auto; /* Centraliza horizontalmente e adiciona margem inferior */
        }

        /* Styling for form groups */
        .oraculo-group {
            margin-bottom: 20px;
        }

        .oraculo-group p {
            margin-bottom: 20px; /* Aumentado o espaçamento aqui */
            font-size: 1.1em;
            color: var(--color-text-medium);
            text-align: center; /* Centraliza o texto da pergunta */
        }

        /* Styling for radio button groups */
        .oraculo-radio-group {
            display: flex;
            justify-content: center; /* CENTRALIZA AS OPÇÕES SIM/NÃO */
            gap: 25px; /* Espaçamento entre as opções de rádio */
            flex-wrap: wrap; /* Permite quebrar linha em telas menores */
        }

        .oraculo-radio-group label {
            display: flex;
            align-items: center;
            cursor: pointer;
            font-size: 1em;
            color: var(--color-text-dark);
            padding: 8px 0; /* Preenchimento vertical para melhores alvos de toque */
        }

        .oraculo-radio-group input[type="radio"] {
            margin-right: 8px;
            /* Estilização personalizada do botão de rádio */
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            width: 18px;
            height: 18px;
            border: 2px solid var(--color-primary-light); /* Borda azul/verde claro */
            border-radius: 50%;
            outline: none;
            transition: all 0.2s ease-in-out;
            position: relative;
            top: 1px;
        }

        .oraculo-radio-group input[type="radio"]:checked {
            background-color: var(--color-primary-dark); /* Preenchimento azul/verde escuro quando selecionado */
            border-color: var(--color-primary-dark);
            box-shadow: 0 0 0 3px rgba(0, 121, 107, 0.3); /* Sombra sutil */
        }

        /* Styling for text and number inputs, and select dropdowns */
        input[type="text"],
        input[type="number"],
        select {
            width: calc(100% - 22px); /* Largura total menos preenchimento e borda */
            padding: 12px 10px;
            margin-top: 15px; /* Alterado de 5px para 15px */
            border: 1px solid var(--color-card-border);
            border-radius: 6px;
            font-size: 1em;
            color: var(--color-text-dark);
            box-sizing: border-box; /* Inclui preenchimento e borda na largura e altura total do elemento */
            transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
        }

        input[type="text"]:focus,
        input[type="number"]:focus,
        select:focus {
            border-color: var(--color-primary-dark); /* Borda azul/verde escuro no foco */
            box-shadow: 0 0 0 3px rgba(0, 121, 107, 0.2); /* Sombra sutil no foco */
            outline: none;
        }

        /* Styling for fieldsets within the pets container */
        #pets_container fieldset {
            border: 1px solid var(--color-fieldset-border);
            padding: 15px;
            margin-bottom: 15px;
            border-radius: 8px;
            background-color: var(--color-card-background);
        }

        #pets_container legend {
            font-weight: bold;
            color: var(--color-primary-dark); /* Azul/Verde escuro para a legenda */
            padding: 0 10px;
            font-size: 1.1em;
        }

        /* Flex container for side-by-side inputs */
        .input-row {
            display: flex;
            flex-wrap: wrap; /* Allow wrapping on smaller screens */
            gap: 15px; /* Space between columns */
            margin-bottom: 10px; /* Space between rows */
            align-items: center; /* CENTRALIZA VERTICALMENTE OS INPUT-GROUPS */
        }

        .input-row .input-group {
            flex: 1; /* Each group takes equal space */
            min-width: calc(50% - 10px); /* Approximately 50% width minus half of the gap */
            box-sizing: border-box;
        }

        /* Adjust label and input/select width within the new flex structure */
        #pets_container label {
            display: block;
            margin-bottom: 5px; /* Reduced margin as inputs are now in rows */
            color: var(--color-text-medium);
        }

        #pets_container .input-group input[type="text"],
        #pets_container .input-group input[type="number"],
        #pets_container .input-group select {
            width: 100%; /* Make inputs fill their flex container */
            margin-top: 0; /* Remove top margin as it's handled by input-row gap */
            margin-top: 10px;
        }

        /* Specific styling for sex radio buttons within pet details */
        #pets_container .input-group .oraculo-radio-group-inline {
          display: flex;
          align-items: center;
          gap: 15px;
          margin-top: 5px;
          padding-top: 10px;
          padding-bottom: 15px;
        }
        #pets_container .input-group .oraculo-radio-group-inline label {
            margin-bottom: 0; /* Remove bottom margin for inline labels */
            display: inline-flex; /* Use inline-flex to align radio and text */
            align-items: center; /* Ensures radio button and text within this label are centered */
        }
        #pets_container .input-group .oraculo-radio-group-inline input[type="radio"] {
            margin-right: 8px; /* Mantém o espaçamento do rádio */
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            width: 18px;
            height: 18px;
            border: 2px solid var(--color-primary-light); /* Borda azul/verde claro */
            border-radius: 50%;
            outline: none;
            transition: all 0.2s ease-in-out;
            position: relative;
            top: 1px;
        }

        #pets_container .input-group .oraculo-radio-group-inline input[type="radio"]:checked {
            background-color: var(--color-primary-dark); /* Preenchimento azul/verde escuro quando selecionado */
            border-color: var(--color-primary-dark);
            box-shadow: 0 0 0 3px rgba(0, 121, 107, 0.3); /* Sombra sutil */
        }


        /* Submit button styling */
        button[type="submit"] {
            display: block;
            width: 100%;
            padding: 15px 20px;
            background-color: var(--color-primary-dark); /* Cor de fundo alterada para a cor primária escura */
            color: white; /* Cor do texto alterada para branco */
            border: none;
            border-radius: 8px;
            font-size: 1.2em;
            font-weight: bold;
            cursor: pointer;
            transition: background-color 0.3s ease, transform 0.2s ease;
            box-shadow: none; /* Sombra removida */
            margin-top: 20px;
        }

        button[type="submit"]:hover {
            background-color: #53661C; /* Tom mais escuro no hover */
            transform: translateY(-2px); /* Efeito de leve levantamento */
        }

        button[type="submit"]:active {
            background-color: #53661C; /* Tom ainda mais escuro no clique */
            transform: translateY(0);
        }

        /* Styling for the result card */
        .oraculo-pet-system > div:last-child > div { /* Seleciona a div que contém o cartão de resultado */
            border: 0px!important;
            padding: 30px;
            border-radius: 12px;
            text-align: center;
           
        }

        .oraculo-pet-system > div:last-child > div h3 {
            color: var(--color-primary-dark);
            font-size: 2.5em;
            margin-top: 0;
            margin-bottom: 15px;
            font-weight: 600;
        }

        .oraculo-pet-system > div:last-child > div p {
            font-size: 1.5em;
            color: var(--color-text-medium);
            font-weight: bold;
            margin-bottom: 25px;
        }

        /* Adjust button inside result card */
        .oraculo-pet-system > div:last-child > div button[type="submit"] {
            background-color: var(--color-primary-dark); /* Botão de resultado com a cor primária escura */
            box-shadow: 0 4px 15px rgba(0, 121, 107, 0.4);
        }

        .oraculo-pet-system > div:last-child > div button[type="submit"]:hover {
            background-color: #53661C; /* Tom mais escuro no hover */
        }
        
        /* Styling for the result card */
.oraculo-result-card {
    border: 0px !important;
    padding: 30px;
    border-radius: 12px;
    text-align: center;
}

.oraculo-result-card h3 {
    color: var(--color-primary-dark);
    font-size: 2.5em;
    margin-top: 0;
    margin-bottom: 15px;
    font-weight: 600;
}

.oraculo-result-card p {
    font-size: 1.5em;
    color: var(--color-text-medium);
    font-weight: bold;
    margin-bottom: 25px;
}

.oraculo-result-card .benefits-title {
    font-size: 1.2em;
    color: var(--color-primary-dark);
    margin-bottom: 15px;
    text-align: center; /* Centraliza o título "Benefícios" */
}

.oraculo-result-card .benefits-list {
    list-style: none; /* Remove os marcadores padrão da lista */
    padding: 0;
    margin: 0 auto 25px auto; /* Centraliza a lista e adiciona margem inferior */
    max-width: 400px; /* Limita a largura da lista para não ficar muito esticada */
    text-align: left; /* Alinha o texto dos benefícios à esquerda */
}

.oraculo-result-card .benefits-list li {
    display: flex; /* Usa flexbox para alinhar o ícone e o texto */
    align-items: flex-start; /* Alinha o ícone e o texto no topo se o texto for longo */
    margin-bottom: 10px; /* Espaçamento entre os itens da lista */
    color: var(--color-text-dark);
    font-size: 1.1em;
    line-height: 1.4;
}

.oraculo-result-card .benefits-list li:last-child {
    margin-bottom: 0; /* Remove a margem do último item */
}

.oraculo-result-card .benefits-list .check-icon {
    width: 24px; /* Tamanho do ícone */
    height: 24px;
    min-width: 24px; /* Garante que o ícone não encolha */
    min-height: 24px;
    margin-right: 10px; /* Espaçamento entre o ícone e o texto */
    color: var(--color-primary-dark); /* Cor do ícone (o verde que você já usa) */
}


/* Adjust button inside result card */
.oraculo-result-card button[type="submit"] {
    background-color: var(--color-primary-dark); /* Botão de resultado com a cor primária escura */
    box-shadow: 0 4px 15px rgba(0, 121, 107, 0.4);
}

.oraculo-result-card button[type="submit"]:hover {
    background-color: #53661C; /* Tom mais escuro no hover */
}
/* Responsive adjustments for the result card */
@media (max-width: 768px) {
    .oraculo-result-card {
        padding: 20px;
    }

    .oraculo-result-card h3 {
        font-size: 2em;
    }

    .oraculo-result-card p {
        font-size: 1.2em;
    }

    .oraculo-result-card .benefits-list {
        max-width: 100%; /* Ocupa toda a largura em telas menores */
    }

    .oraculo-result-card .benefits-list li {
        font-size: 1em;
    }
}

        /* Responsive adjustments */
        @media (max-width: 768px) {
            .oraculo-pet-system {
                padding: 20px;
            }

            .oraculo-card {
                padding: 20px;
            }

            .oraculo-card h3 {
                font-size: 1.4em;
            }

            .oraculo-radio-group {
                flex-direction: column; /* Empilha os botões de rádio verticalmente em telas pequenas */
                gap: 10px;
            }

            .input-row {
                flex-direction: column; /* Stack inputs vertically on small screens */
                gap: 10px;
            }

            .input-row .input-group {
                min-width: 100%; /* Full width on small screens */
            }

            input[type="text"],
            input[type="number"],
            select {
                width: 100%; /* Largura total em telas menores */
            }
        }/* End custom CSS */