/*inicio noticias*/

.noticias{
    background-color: var(--color-secundary);
    padding-bottom: 32px;
}

.contNoticias{
    display: grid;
    grid-template-areas:
        "not1 not1 not1"
        "not2 not3 not4";
        gap: 24px;  
}


.cardNoticias{
    background-color: var(--color-withe-medius);
    border-radius:4px;
    padding:24px 32px;
    margin-bottom: 24px;
    border:.5px solid #cccccc;
}


.contNoticiasGeneral{
    display: grid;
    grid-template-areas:
        "not1-1 not2 not3"
        "not4 not5 not6"        
        "not7 not8 not9";
        gap: 24px;  
}


.not1{
  grid-area: not1;
  border:.5px solid #cccccc;
  display: flex;
  justify-content:space-between;
  background-color: var(--color-withe-medius);
  border-radius:4px;
  padding:24px 32px;
}

.not1 .contImgNoticias{
  margin-right: 24px;
}
.not1-1{
grid-area: not1-1;
}
.not2{
  grid-area: not2;
}

.not3{
  grid-area: not3;
}

.not4{
  grid-area: not4;
}

.contImgNoticias{
    margin-right:auto;
    min-height: 180px;
    height: 192px;
    overflow: hidden;
    border:1px solid var(--color-light-grey)
}
.contImgNoticias img{
    object-fit: cover;
    height:100%;
    width:100%;
}

.textCardNoticias{
    margin-top: 24px;
    width: 100%;
}
.contTituloFecha{
    padding: 0;
    margin: 0;
}
.titNoticias{
    padding: 0;
    margin: 0;
}
.titNoticias a{
  color: var(--color-primary);
  text-decoration: none;
}
.contBtnNoticias{
    width: 100%;
    height: auto;
    text-align: center;
    padding:0;
}

.pagination {
  display: flex;
  justify-content: center; /* centra el paginador */
  align-items:center;
  gap: 16px; /* espacio entre items */
  margin: 30px 0;}

.pagination .page-numbers {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid #ccc;
  border-radius: 6px;
  text-decoration: none;
  color: #333;
  transition: all 0.3s ease;
}
.pagination .page-numbers:hover {
  background-color:var(--color-primary-opacity);
  color: var(--color-title);
}

/* Página actual */
.pagination .current {
  background-color: var(--color-primary); /* azul WP */
  color:var(--bg-body);
  font-weight: bold;
  border-color: var(--color-primary);
}

/* Elipsis (dots) */
.pagination .dots {
  border: none;
  background: none;
  padding: 8px;
  cursor: default;
}

/* Botón siguiente (puedes personalizarlo diferente) */
.pagination .next {
  background-color: #eee;
  font-weight: bold;
}

/*noticias individuales*/

.modBlog{
  padding:0 18%;
}
.imgNotIndv{
  width: 100%;
  height: 300px;
  background-color: aqua;
}
.NoticiaIndvText{
  padding: 42px 0;
}
.NoticiaIndvText h2{
  padding-bottom: 16px;
}

.btnInteraccion{
  display: flex;
  justify-content: space-around;
}
.btnInteraccion a button{
  border: none;
  background-color: transparent;
}

.botonPrincNoticias{
  display: block;
  padding: 8px 24px;
  background-color: var(--color-primary);
  color: var(--bg-body);
  border: none;
  border-radius: 5px;
  cursor: pointer;
  justify-self: flex-end; 
}  

.pagination .next {
    background-color: #eee;
    font-weight: bold;
}
.pagination .page-numbers {
    display: inline-block;
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    text-decoration: none;
    color: #333;
    transition: all 0.3s 
ease;
}
/*fin noticias*/


@media screen and (max-width: 700px){   
  /* Contenedor de noticias principales */
   .contNoticias,
  .contNoticiasGeneral {
    display: flex;
    overflow-x: auto; /* scroll horizontal funcional */
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 16px;}

    .contNoticias::-webkit-scrollbar,
  .contNoticiasGeneral::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera, Edge nuevos */
  }

  .contNoticias .cardNoticias,
  .contNoticias .not1 {
    flex: 0 0 80%; /* ancho visible de cada card */
    scroll-snap-align: start;
    min-width: 280px;
  }

  /* Contenedor de noticias generales */
  .contNoticiasGeneral {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 16px;
  }

   .contNoticias .cardNoticias,
  .contNoticiasGeneral .cardNoticias,
  .contNoticias .not1 {
    flex: 0 0 80%; /* ancho visible */
    scroll-snap-align: start;
    min-width: 280px;
  }

  /* Opcional: quitar márgenes grandes y bordes si se ven pesados en móvil */
  .cardNoticias, .not1 {
    margin-bottom: 0;
  }

  /* Para evitar que el scroll se corte */
  .noticias {
    overflow: hidden;
  }
  .not1{
    display: flex;
    flex-direction: column;
  }
  .textCardNoticias{
    margin-top:0;
  }
}