Oxygenados Com

                    document.addEventListener("DOMContentLoaded", ()=>{
	 const bottonsResset = document.querySelectorAll('.buttom-resset-all')
	 const divsDropDown = document.querySelectorAll('.div-dropdown')

     const hideElement = (objetoBoton,objetoDrop, objetivo)=>{
	   let clearButtoms = document.querySelectorAll('.wpgb-select-clear')
	    clearButtoms.forEach((o)=>{
			o.click();
		 })
			bottonsResset.forEach((b)=>{
				b.classList.add('buttomReset_hidden')								  
			})
			divsDropDown.forEach((d)=>{
				d.classList.add('buttomReset_hidden')								  
			})
			
			 let myBottom = document.querySelector(objetoBoton)
			   myBottom.classList.toggle('buttomReset_hidden');

			 let myDrop = document.querySelector(objetoDrop)
			     myDrop.classList.toggle('buttomReset_hidden');
		 
		  
		  let llamaAria = ()=>{
			  let presionado = objetivo.parentElement.getAttribute('aria-pressed');
			  if(presionado=="false") objetivo.parentElement.setAttribute('aria-pressed',"true")
		 }
		 setTimeout(llamaAria, 0)

		}
	 
	 
		document.addEventListener('mouseup', (evento)=>{
			let elemento = evento.target
			if(elemento.classList.contains('radio-buttom__one')){
				hideElement('.buttom-resset__one', '.dropdown-activity',elemento)
			}
			if(elemento.classList.contains('radio-buttom__two')){
				hideElement('.buttom-resset__two', '.dropdown-interest', elemento )
			}
	 })
})

                  

                    <?php
/***
  Este código recupera todas las categorías y las etiquetas, y luego busca todos los posts que pertenecen a cada combinación de categoría y etiqueta.
  Luego, muestra los títulos de los posts con enlaces a ellos, junto con las categorías a las que pertenecen.

Cada categoría se muestra como un encabezado <h2>, y las etiquetas se muestran como elementos de una lista <ul>. 
Los posts se muestran como elementos de lista <li> debajo de cada etiqueta.

**/
$categories = get_terms( array(
    'taxonomy' => 'category',
    'hide_empty' => false,
) );

foreach ( $categories as $category ) {
    echo '<h2>' . $category->name . '</h2>';
    echo '<ul>';

    $tags = get_terms( array(
        'taxonomy' => 'post_tag',
        'hide_empty' => false,
    ) );

    foreach ( $tags as $tag ) {
        $args = array(
            'post_type' => 'post',
            'posts_per_page' => -1,
            'tax_query' => array(
                'relation' => 'AND',
                array(
                    'taxonomy' => 'category',
                    'field' => 'term_id',
                    'terms' => $category->term_id,
                ),
                array(
                    'taxonomy' => 'post_tag',
                    'field' => 'term_id',
                    'terms' => $tag->term_id,
                ),
            ),
        );
        $posts = get_posts( $args );

        if ( $posts ) {
            echo '<li>' . $tag->name . ': ';
            foreach ( $posts as $post ) {
                $post_terms = wp_get_post_terms( $post->ID, 'category' );
                $post_categories = array();
                foreach ( $post_terms as $post_term ) {
                    $post_categories[] = $post_term->name;
                }
                echo '<a href="' . get_permalink( $post->ID ) . '">' . $post->post_title . '</a> (' . implode( ', ', $post_categories ) . ') ';
            }
            echo '</li>';
        }
    }
    echo '</ul>';
}
?>

                  

                    <?php
// Obtener todas las categorías
$categories = get_categories();
// Obtener todas las etiquetas
$tags = get_tags();
// Recorrer cada categoría
foreach ($categories as $category) {

    // Obtener el link a la categoría
    $category_link = get_category_link($category->term_id);
    $categoryId = $category->term_id;
    // Imprimir el nombre de la categoría
    echo '<a href="' . esc_url($category_link) . '">' . $category->name . '</a>';
    foreach ($tags as $tag) {
        $args = array(
            'posts_per_page' => -1,
            'post_type' => 'post',
            'post_status' => 'publish',
            'tag_id' => $tag->term_id,
        );
        $posts = get_posts($args);
        $i = 0;
        $salida = "";
        foreach ($posts as $post) {
            $lacat = get_the_category($post->ID);
            if ($lacat[0]->term_id == $categoryId) {
                $salida .=  '<a href="' . get_permalink($post->ID) . '">' . $post->post_title . '</a><br>';
                $i++;
            }
        }
        ($i < 1) ? $enlaceTag = "" : $enlaceTag = '<ul><a style="text-decoration:underline" href="' . get_tag_link($tag->term_id) . '">' . $tag->name . '</a><br>';
       echo   $enlaceTag . $salida . '</ul>';
    }
}
?>
                  

                    /**** Especificidad ***/
1000 - En línea, es el que se le aplica directamente al elemento en HTML mediante style.
 100 - Selección po ID.
  10 - Selección por Clas, por Atributo y por pseudoelemento.
   1 - Selección por elemento "H - span - Header - p"
   
/**** Herencia ****/
 !important - Se salta todas las especificidades pero sigue teniendo en cuenta la especificidad.
 
 Ejemplo:
 h2.coloreado{ /**+ Especificidad = 11 **/
    color : red !important;  
 }
 .coloreado{ /*** Especificidad = 10 **/
     color: green;
 }
 
 /*** Herencia ***/
 
 Con inherit los elementos heredan propiedades de sus padres o contenedores,
 Con initia se resetea la herencia.
 
 /******** Selectores ********/

/** Por Atributo ***/
[class]{
    /* Selecciona a todos los elementos que tengan una clase*/
    font-size: 6px;
}
/* Esto seleccionará todos los elementos cuyo atributo class comienza con "mi-clase" */
[class^="mi-clase"] {
  /* Estilos para estos elementos */
  background-color: yellow;
}

/* Esto seleccionará todos los elementos cuyo atributo class contiene "mi-clase" en cualquier lugar */
[class*="mi-clase"] {
  /* Estilos para estos elementos */
  background-color: yellow;
}
[nombreAtributo]{
    /*Cualquier nombre puede darse como atributo */
    color: blue;
}

[href="https://una-web.com"]{
    /*Elementos con atributo href que lleven a esa dirección */
    color: darkgreen;
}

[href^="loque-sea"]{
    /*Elementos con atributo href y que empiezen con loque-sea, 
    independientemente de lo que venga después.
    Viene siendo [href^="loque-sea.....]*/
    
}
[href$='loque-sea']{
    /* Elementos cuyo valor del atributo href finalice con 'loque-sea', 
    independientemente de lo que antes tenga.*/
}

[href*='loque-sea']{
    /*Elementos cuyo valor del atributo href contenga 'loque-sea' 
    independientemente de lo que tenga antes o después de esa plabra*/
}

.contenedor p {
    /* Selecciona a todos los elementos p que se encuentren dentro un contenedor,
    sin importar la descendencia*/
}

.contenedor>p {
    /* Selecciona a todos los elementos p que sean hijos directos */
}


nav.contenedor{
    /*Selecciona a los elementos nav que tengan la clase contenedor*/
}

h+p2{
    /*Selecciona al hermano adyacente y solo al adyacente*/
}
h2~p{
    /*Selecciona a todos los hermanos, a todos*/
}

                  

                    /*** Eliminar margenes de bloque **/
p{
    margin-block-start: 0;
    margin-block-end: 0;
}