/* Container Principal: Removido o quadro branco rígido */
.cgk-countdown-box {
    background: transparent; /* Remove o fundo branco */
    border: none; /* Remove a borda rígida */
    padding: 0; /* Remove padding desnecessário agora */
    text-align: center;
    max-width: 600px; /* Um pouco mais largo para dar respiro */
    margin: 40px auto; /* Mais espaço vertical */
    position: relative;
    z-index: 10; /* Garante que fique sobre a aquarela */
}

/* Título: Usa a cor marrom escura e tamanho similar ao menu */
.cgk-title {
    font-size: 1.6rem;
    color: #4b3621; /* Marrom escuro do menu ativo */
    margin-bottom: 8px;
    font-family: inherit; /* Mantém a fonte do tema */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Subtítulo: Usa o ocre/marrom claro */
.cgk-subtitle {
    font-size: 1rem;
    color: #8c6c4c; /* Marrom claro/ocre */
    margin-bottom: 30px;
    font-style: italic;
}

/* Flexbox do Timer */
.cgk-timer {
    display: flex;
    justify-content: center;
    gap: 15px; /* Espaço maior entre os blocos */
}

/* Blocos de Tempo: Agora transparentes com borda dourada suave */
.cgk-time-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Fundo semi-transparente do tema para leitura sobre a aquarela */
    background: rgba(255, 255, 255, 0.6); 
    border: 1px solid #c5a059; /* Borda dourada suave inspirada no logo GK */
    border-radius: 10px;
    padding: 15px 10px;
    min-width: 90px; /* Um pouco maior */
    box-shadow: 0 4px 8px rgba(75, 54, 33, 0.1); /* Sombra marrom suave */
    transition: transform 0.3s ease;
}

/* Efeito ao passar o mouse (hover) nos blocos */
.cgk-time-block:hover {
    transform: translateY(-3px);
    background: rgba(255, 255, 255, 0.8);
}

/* Números (Dias, Horas, etc.): Usa o marrom escuro forte */
.cgk-time-block span {
    font-size: 2.2rem;
    font-weight: 700;
    color: #4b3621; /* Marrom escuro */
    line-height: 1;
}

/* Rótulos (Dias, Horas, etc.): Usa o ocre */
.cgk-time-block label {
    font-size: 0.8rem;
    text-transform: uppercase;
    color: #8c6c4c; /* Ocre/Marrom claro */
    margin-top: 8px;
    font-weight: 600;
    letter-spacing: 1px;
}

/* Responsividade para celulares */
@media (max-width: 480px) {
    .cgk-time-block {
        min-width: 70px;
        padding: 10px 5px;
    }
    .cgk-time-block span {
        font-size: 1.6rem;
    }
    .cgk-title {
        font-size: 1.3rem;
    }
}