/* Uniformização do bloco de introdução e blocos superiores */
.bg-green-50.rounded-xl.p-8.border-2.border-green-100.mb-12,
div[class*="bg-green-50"][class*="rounded-xl"][class*="p-8"],
div[class*="bg-green-50"][class*="rounded-lg"][class*="p-6"] {
    background: rgb(216 237 211 / 35%) !important;
    border-color: #4ab43c !important;
}

/* Timeline: Degradê apenas no passo ativo */
/* Passos inativos/concluídos */
div[class*="w-10"][class*="h-10"][class*="rounded-full"] {
    background: #e5e7eb !important; /* Cinza claro para inativos */
    color: #6b7280 !important;
    border: none !important;
}

/* Passo ativo (usando a classe bg-green-600 que o Tailwind costuma aplicar ao ativo) */
div[class*="w-10"][class*="h-10"][class*="rounded-full"][class*="bg-green-600"],
div[class*="w-10"][class*="h-10"][class*="rounded-full"]:has(+ div[class*="text-green-700"]),
div[class*="w-10"][class*="h-10"][class*="rounded-full"]:first-child {
    /*background: linear-gradient(135deg, #4ab43c 0%, #2e7d32 100%) !important;*/
    background: #a2bf9e !important;
    color: #ffffff !important;
}

/* Ajuste para os ícones de visitantes (Estilo Premium sem fundo) */
/* Esconde o container do ícone original (o quadrado azul/vermelho) */
div[class*="w-12"][class*="h-12"][class*="bg-blue-600"],
div[class*="w-12"][class*="h-12"][class*="bg-red-600"],
div[class*="w-12"][class*="h-12"]:has(> span:contains("👤")),
div[class*="w-12"][class*="h-12"]:has(> span:contains("👧")) {
    background: transparent !important;
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
}

/* Seletor genérico para os containers de ícones de visitantes */
div[class*="bg-gradient-to-br"][class*="from-blue-50"] div[class*="w-12"][class*="h-12"],
div[class*="bg-gradient-to-br"][class*="from-red-50"] div[class*="w-12"][class*="h-12"] {
    background: transparent !important;
    font-size: 0 !important;
}

/* Insere o novo ícone com linhas brancas nos containers específicos */
div[class*="bg-gradient-to-br"][class*="from-blue-50"] div[class*="w-12"][class*="h-12"]::before {
    content: "";
    display: block;
    width: 48px;
    height: 48px;
    background-image: url("https://cdn-icons-png.flaticon.com/512/4598/4598970.png") !important;
    background-size: contain;
    background-repeat: no-repeat;
    filter: brightness(0) invert(1) !important;
}

div[class*="bg-gradient-to-br"][class*="from-red-50"] div[class*="w-12"][class*="h-12"]::before {
    content: "";
    display: block;
    width: 48px;
    height: 48px;
    background-image: url("https://cdn-icons-png.flaticon.com/512/3088/3088392.png") !important;
    background-size: contain;
    background-repeat: no-repeat;
    filter: brightness(0) invert(1) !important;
}

/* Remove o ajuste anterior que colocava o ícone no h5 */
div[class*="bg-blue-50"] h5::before,
div[class*="bg-red-50"] h5::before {
    display: none !important;
}

/* Garante que o span original (emoji) esteja escondido */
div[class*="bg-blue-600"] span,
div[class*="bg-red-600"] span {
    display: none !important;
}

/* Redesign dos Cards (Adultos, Crianças, Visitantes) */
/* Card de Adultos */
div[class*="bg-gradient-to-br"][class*="from-green-50"] {
    background: linear-gradient(135deg, #4ab43c 0%, #2e7d32 100%) !important;
    border-color: #4ab43c !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Card de Crianças (amarelo originalmente) */
div[class*="bg-gradient-to-br"][class*="from-yellow-50"] {
    background: linear-gradient(135deg, #4ab43c 0%, #1b5e20 100%) !important;
    border-color: #4ab43c !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Cards de Visitantes (azul e vermelho originalmente) */
div[class*="bg-blue-50"], 
div[class*="bg-red-50"],
div[class*="from-blue-50"],
div[class*="from-red-50"],
div[class*="bg-gradient-to-br"][class*="from-blue-50"],
div[class*="bg-gradient-to-br"][class*="from-red-50"] {
    background: linear-gradient(135deg, #4ab43c 0%, #2e7d32 100%) !important;
    border-color: #4ab43c !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Ajuste de texto nos cards de visitantes */
div[class*="bg-blue-50"] h5,
div[class*="bg-blue-50"] p,
div[class*="bg-blue-50"] span,
div[class*="bg-red-50"] h5,
div[class*="bg-red-50"] p,
div[class*="bg-red-50"] span {
    color: #ffffff !important;
}

/* Ajuste dos botões nos cards de visitantes */
div[class*="bg-blue-50"] button,
div[class*="bg-red-50"] button {
    background-color: rgba(255, 255, 255, 0.2) !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

/* Ajuste de texto nos cards para branco (Premium) */
div[class*="bg-gradient-to-br"] h4,
div[class*="bg-gradient-to-br"] p,
div[class*="bg-gradient-to-br"] span {
    color: #ffffff !important;
}

/* Forçar ícones a ficarem brancos */
div[class*="bg-gradient-to-br"] img {
    filter: brightness(0) invert(1) !important;
}

/* Ajuste dos botões nos cards */
div[class*="bg-gradient-to-br"] button {
    background: linear-gradient(135deg, #da0812 0%, #9e0000 100%) !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

div[class*="bg-gradient-to-br"] button:hover {
    background-color: rgba(255, 255, 255, 0.4) !important;
}

/* Valorização do Verde em outros elementos */
.bg-green-600 {
    background-color: #4ab43c !important;
}

.text-green-700 {
    color: #4ab43c !important;
}

.border-green-600 {
    border-color: #4ab43c !important;
}

/*PERSONALIZADO*/
.bg-gradient-to-new{background-color: rgba(216, 237, 211, 0.35);}

/*HEADER*/
/*TIME LINE*/
header .rounded-full.font-bold.bg-green-600.text-white {background: linear-gradient(135deg, #da0812 0%, #9e0000 100%) !important;}

/*LATERAL*/
.p-6.border-t.border-green-600 a svg { background: linear-gradient(135deg, #da0812 0%, #9e0000 100%) !important; color: #fff; border-radius: 100%;}
.p-6.border-t.border-green-600 a:nth-child(1) svg { padding: 0px 8px; height: 41px; width: 41px; }
.p-6.border-t.border-green-600 a:nth-child(2) svg { padding: 7px; height: 41px; width: 41px; }
.p-6.border-t.border-green-600 a:nth-child(3) svg { padding: 5px; height: 41px; width: 41px; }
.p-6.border-t.border-green-600 a:nth-child(4) svg { padding: 7px; height: 41px; width: 41px; }

/*1ª TELA*/
.bg-gradient-to-br { display: flex; flex-direction: column; align-items: center; }

/*2ª TELA*/
button.p-6.rounded-lg.border-2.transition-all.text-left.border-green-600.bg-green-50 img { filter: invert(1); }

@media(max-width: 767px){
aside{width: 100%;}
.flex.h-screen.bg-gray-50 { display: table;width: 100%;}
main .p-8 { padding: 15px; }

}