.post-type-filter {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 20px auto;
    flex-wrap: wrap;
}

.post-type-filter li {
    display: inline-block;
}

.post-type-filter a {
    display: block;
    padding: 10px 15px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    background-color: #002147; /* Azul corporativo */
    transition: all 0.3s ease-in-out;
}

.post-type-filter a:hover, 
.post-type-filter a.active {
    background-color: #ff6200; /* Naranja ShakingHub */
    color: #fff;
}



/* codigo para los radiobutosn de search and filter */

/* 🔹 Contenedor principal del formulario */
.searchandfilter {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 20px !important;
    /*background: #f8f9fa !important; /* Fondo claro */
    padding: 20px !important;
    border-radius: 10px !important;
   /* box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1) !important;*/
    /*max-width: 800px !important;*/
    margin: 20px auto !important;
}

/* 🔹 Lista de opciones de post type */
.searchandfilter ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    padding: 0 !important;
    list-style: none !important;
    justify-content: center !important;
    margin: 0 !important;
}

/* 🔹 Ocultar los inputs tipo radio */
.searchandfilter input[type="radio"] {
    display: none !important;
}

/* 🔹 Estilos para los labels que reemplazan los radios */
.searchandfilter label.sf-label-radio {
    display: inline-block !important;
    padding: 12px 20px !important;
    border-radius: 25px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    cursor: pointer !important;
    color: #fff !important;
    background-color: #002147 !important; /* Azul corporativo */
    transition: all 0.3s ease-in-out !important;
    border: 2px solid transparent !important;
}

/* 🔹 Hover y selección */
.searchandfilter label.sf-label-radio:hover,
.searchandfilter input[type="radio"]:checked + label.sf-label-radio {
    background-color: #ff6200 !important; /* Naranja corporativo */
    color: #fff !important;
    border-color: #ff6200 !important;
}

/* 🔹 Botón de envío */
.searchandfilter button[type="submit"] {
    padding: 12px 22px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    color: #fff !important;
    background-color: #ff6200 !important; /* Naranja */
    border: none !important;
    border-radius: 25px !important;
    cursor: pointer !important;
    transition: all 0.3s ease-in-out !important;
    margin-top: 10px !important;
}

.searchandfilter button[type="submit"]:hover {
    background-color: #002147 !important; /* Azul */
}