/* Prefixos para animações de melhor compatibilidade */
@-webkit-keyframes fillAnimation2 {
    0%, 50% {
        fill: #d3d3d3;
    }
    75%, 100% {
        fill: #ff9800;
    }
}

@keyframes fillAnimation2 {
    0%, 50% {
        fill: #d3d3d3;
    }
    75%, 100% {
        fill: #ff9800;
    }
}

@-webkit-keyframes fillAnimation3 {
    0%, 75% {
        fill: #d3d3d3;
    }
    100% {
        fill: #ff9800;
    }
}

@keyframes fillAnimation3 {
    0%, 75% {
        fill: #d3d3d3;
    }
    100% {
        fill: #ff9800;
    }
}

@-webkit-keyframes fillAnimation4 {
    0%, 90% {
        fill: #d3d3d3;
    }
    100% {
        fill: #ff9800;
    }
}

@keyframes fillAnimation4 {
    0%, 90% {
        fill: #d3d3d3;
    }
    100% {
        fill: #ff9800;
    }
}

/* Classes aplicadas para sinais Wi-Fi animados */
.wifi-signal-2 {
    /* Inclua os prefixos -webkit para maior compatibilidade */
    -webkit-animation: fillAnimation2 1s infinite ease-in-out;
    animation: fillAnimation2 1s infinite ease-in-out;
}

.wifi-signal-3 {
    -webkit-animation: fillAnimation3 1s infinite ease-in-out;
    animation: fillAnimation3 1s infinite ease-in-out;
}

.wifi-signal-4 {
    -webkit-animation: fillAnimation4 1s infinite ease-in-out;
    animation: fillAnimation4 1s infinite ease-in-out;
}

/* Exemplo de estilo de texto no logo */
.logo,
.logo-slogan {
    fill: var(--bs-light, #ffffff);; /* ou use uma variável CSS, se preferir */
}

/* Simulando as classes do Bootstrap para peso da fonte */
.fw-bold {
    font-weight: 700;
}

.fw-semibold {
    font-weight: 600;
}