/*
 * «Actualidad» (28 oct 2026, migración 0261, docs/contenidos.md): la
 * pantalla del socio en Comunidad y la de la Junta. Los colores son los de
 * la asociación (sus tonos, base.css) y los de estado de Rasedia.
 */

/* #region 1. Socio: arriba, sobre su foto, la cuenta atrás y el tiempo de ahora */
.banda-socio__dentro:has(> .actualidad-portada:not([hidden])) {
    grid-template-columns: minmax(0, 1fr);
    align-items: end;
}

.actualidad-portada {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--espacio-4) clamp(24px, 4vw, 72px);
}

.actualidad-portada[hidden] {
    display: none;
}

.actualidad-cuenta {
    display: grid;
    gap: 2px;
}

.actualidad-cuenta[hidden] {
    display: none;
}

.actualidad-cuenta__antes {
    margin: 0;
    color: rgb(255 255 255 / 0.85);
    font-size: 15px;
}

.actualidad-cuenta__cifras {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--espacio-1) clamp(14px, 1.6vw, 26px);
}

/* Las cifras, muy grandes, con su unidad al lado. */
.actualidad-cifra {
    display: inline-flex;
    align-items: baseline;
    gap: var(--espacio-2);
}

.actualidad-cifra strong {
    font-family: var(--fuente-display);
    font-size: clamp(2.8rem, 5vw, 5.6rem);
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 0.95;
}

.actualidad-cifra small {
    color: rgb(255 255 255 / 0.85);
    font-size: clamp(14px, 1.2vw, 18px);
}

.actualidad-cuenta__ya {
    font-family: var(--fuente-display);
    font-size: clamp(1.75rem, 3vw, 3rem);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.actualidad-cuenta__nombre {
    margin: var(--espacio-1) 0 0;
    color: #FFFFFF;
    font-family: var(--fuente-display);
    font-size: clamp(1.1rem, 1.5vw, 1.5rem);
    font-weight: 650;
    letter-spacing: -0.025em;
}

.actualidad-cuenta__fechas {
    margin: 0;
    color: rgb(255 255 255 / 0.85);
    font-size: 15px;
}

.actualidad-cuenta__fechas .icono {
    display: none;
}

.actualidad-cuenta__accion {
    margin-top: var(--espacio-2);
}

/* El tiempo de ahora: lleva a su pestaña, con los próximos días. */
.actualidad-tiempo-corto {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: center;
    column-gap: var(--espacio-3);
    color: #FFFFFF;
    text-decoration: none;
}

.actualidad-tiempo-corto[hidden] {
    display: none;
}

.actualidad-tiempo-corto:hover {
    color: #FFFFFF;
    text-decoration: none;
    opacity: 0.85;
}

.actualidad-tiempo-corto .icono {
    display: block;
    width: 44px;
    height: 44px;
}

.actualidad-tiempo-corto b {
    font-family: var(--fuente-display);
    font-size: clamp(2rem, 2.6vw, 2.75rem);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
}

.actualidad-tiempo-corto small {
    grid-column: 1 / -1;
    margin-top: var(--espacio-1);
    color: rgb(255 255 255 / 0.85);
    font-size: 14px;
}

/* El tiempo, en su pestaña. */
.actualidad-tiempo {
    display: flex;
    flex-direction: column;
    gap: var(--espacio-3);
    max-width: 44rem;
}

.actualidad-tiempo__titulo {
    display: flex;
    align-items: center;
    gap: var(--espacio-2);
    margin: 0;
    font-size: var(--texto-base);
    font-weight: 600;
    color: var(--rs-texto-secundario);
}

.actualidad-tiempo__ahora {
    display: flex;
    align-items: center;
    gap: var(--espacio-3);
}

.actualidad-tiempo__icono {
    display: inline-grid;
    place-items: center;
    color: var(--rs-texto-secundario);
}

.actualidad-tiempo__ahora .actualidad-tiempo__icono .icono {
    width: 48px;
    height: 48px;
}

.actualidad-tiempo__icono--despejado,
.actualidad-tiempo__icono--poco_nuboso {
    color: var(--rs-oro-claro);
}

.actualidad-tiempo__icono--lluvia,
.actualidad-tiempo__icono--llovizna,
.actualidad-tiempo__icono--chubascos {
    color: var(--rs-info);
}

.actualidad-tiempo__icono--tormenta {
    color: var(--rs-aviso);
}

.actualidad-tiempo__grados {
    font-family: var(--fuente-display);
    font-size: 2.75rem;
    font-weight: 700;
    line-height: 1;
}

.actualidad-tiempo__estado {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.actualidad-tiempo__estado small {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--rs-texto-secundario);
    font-size: var(--texto-pequeno);
}

.actualidad-tiempo__dias {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: var(--espacio-1);
    margin: var(--espacio-2) 0 0;
    padding: 0;
    list-style: none;
}

.actualidad-tiempo__dias li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    font-size: 15px;
    text-transform: capitalize;
    padding: var(--espacio-3) 0;
    border-top: 1px solid var(--rs-borde-sutil);
}

.actualidad-tiempo__dias small {
    color: var(--rs-texto-tenue);
}

.actualidad-tiempo__lluvia {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: var(--rs-info) !important;
}

.actualidad-tiempo__lluvia .icono {
    width: 12px;
    height: 12px;
}

.actualidad-tiempo__fuente {
    margin: 0;
    color: var(--rs-texto-tenue);
    font-size: 0.6875rem;
}
/* #endregion */

/* #region 2. Socio: las pestañas y las noticias */
.actualidad-pestanas.pestanas--una-sola {
    display: none;
}

.actualidad-panel {
    display: flex;
    flex-direction: column;
    gap: var(--espacio-4);
}

.actualidad-subtitulo {
    margin: 0 0 var(--espacio-2);
    font-size: var(--texto-grande);
}

.actualidad-familias {
    display: flex;
    flex-wrap: wrap;
    gap: var(--espacio-1) var(--espacio-5);
}

.actualidad-familia {
    color: var(--rs-texto-secundario);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
    padding: 0 0 var(--espacio-1);
    border: 0;
    border-bottom: 2px solid transparent;
    background: none;
}

.actualidad-familia--activa {
    background: none;
    color: var(--marca-acento);
}

.actualidad-enlaces,
.actualidad-programas,
.actualidad-premios,
.actualidad-musica {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Las noticias, como en un periódico: la más nueva en grande y las siguientes al lado. */
.actualidad-periodico {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: clamp(24px, 3vw, 48px);
}

.actualidad-noticia__de {
    color: var(--rs-texto-secundario);
    font-size: 14px;
}

.actualidad-noticia__de--propia {
    color: var(--marca-acento);
    font-weight: 600;
}

.actualidad-lead,
.actualidad-pieza,
.actualidad-titular {
    padding: 0;
    border: 0;
    background: none;
    color: var(--rs-texto);
    font: inherit;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

:is(.actualidad-lead, .actualidad-pieza, .actualidad-titular):hover {
    color: var(--rs-texto);
    text-decoration: none;
}

:is(.actualidad-lead, .actualidad-pieza, .actualidad-titular):hover strong {
    color: var(--marca-acento);
}

:is(.actualidad-lead, .actualidad-pieza, .actualidad-titular):focus-visible {
    outline: 2px solid var(--marca-acento);
    outline-offset: 3px;
}

.actualidad-lead,
.actualidad-pieza {
    display: grid;
    align-content: start;
    gap: var(--espacio-2);
}

.actualidad-lead img {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--radio-lg);
    object-fit: cover;
}

.actualidad-lead strong {
    font-family: var(--fuente-display);
    font-size: clamp(1.9rem, 3vw, 3.2rem);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.06;
    transition: color var(--duracion-hover) var(--curva);
}

/* Las siguientes: el titular y su foto a la derecha, si la tiene. */
.actualidad-titulares {
    display: grid;
    align-content: start;
    margin: 0;
    padding: 0;
    list-style: none;
}

.actualidad-titulares > li + li {
    border-top: 1px solid var(--rs-borde-sutil);
}

.actualidad-titular {
    display: flex;
    align-items: center;
    gap: var(--espacio-4);
    width: 100%;
    padding: var(--espacio-4) 0;
}

.actualidad-titulares > li:first-child .actualidad-titular {
    padding-top: 0;
}

.actualidad-titular img {
    flex: none;
    width: 112px;
    aspect-ratio: 4 / 3;
    border-radius: var(--radio-md);
    object-fit: cover;
}

.actualidad-titular__textos {
    display: grid;
    flex: 1;
    gap: 5px;
    min-width: 0;
}

.actualidad-titular__textos strong {
    font-family: var(--fuente-display);
    font-size: clamp(1.05rem, 1.3vw, 1.35rem);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.22;
    transition: color var(--duracion-hover) var(--curva);
}

/* Debajo, las de foto en rejilla y las que solo tienen titular, en columnas. */
.actualidad-rejilla {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: var(--espacio-5) 20px;
    margin-top: var(--espacio-6);
    padding-top: var(--espacio-5);
    border-top: 1px solid var(--rs-borde-sutil);
}

.actualidad-pieza img {
    width: 100%;
    aspect-ratio: 3 / 2;
    border-radius: var(--radio-md);
    object-fit: cover;
}

.actualidad-pieza strong {
    font-family: var(--fuente-display);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.22;
    transition: color var(--duracion-hover) var(--curva);
}

.actualidad-titulares--columnas {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 24rem), 1fr));
    column-gap: clamp(24px, 3vw, 48px);
    margin-top: var(--espacio-5);
    padding-top: var(--espacio-4);
    border-top: 1px solid var(--rs-borde-sutil);
}

.actualidad-titulares--columnas > li,
.actualidad-titulares--columnas > li + li {
    border-top: 0;
    border-bottom: 1px solid var(--rs-borde-sutil);
}

.actualidad-titulares--columnas > li:first-child .actualidad-titular {
    padding-top: var(--espacio-4);
}

@media (max-width: 899px) {
    .actualidad-periodico {
        grid-template-columns: minmax(0, 1fr);
    }
}

.actualidad-enlace {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--espacio-3);
    padding: var(--espacio-3) 0;
    border: 0;
    border-top: 1px solid var(--rs-borde-sutil);
    background: none;
    color: inherit;
    text-decoration: none;
}

.actualidad-enlace:hover strong {
    color: var(--marca-acento);
}

.actualidad-enlace > .icono {
    color: var(--rs-texto-tenue);
}

.actualidad-enlace__textos,
.actualidad-programas__textos,
.actualidad-premio__textos,
.actualidad-musica__textos {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.actualidad-enlace__textos > span,
.actualidad-programas__textos small,
.actualidad-premio__textos small,
.actualidad-musica__textos small {
    color: var(--rs-texto-secundario);
    font-size: var(--texto-pequeno);
}

.actualidad-webs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--espacio-2);
    margin: var(--espacio-2) 0 0;
}
/* #endregion */

/* #region 3. Socio: enlaces, programas y directorio */
.actualidad-enlaces {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    column-gap: var(--espacio-6);
}

/* Su icono, en su color y sin caja. */
.actualidad-enlace__icono,
.actualidad-programas__icono,
.actualidad-musica__icono {
    display: grid;
    place-items: center;
    width: 28px;
    color: var(--tono-enlace, var(--tono-marcha, var(--tono-1)));
}

.actualidad-enlace__textos small {
    color: var(--tono-enlace, var(--tono-1));
    font-size: var(--texto-etiqueta);
    font-weight: 600;
}

.actualidad-programas li,
.actualidad-musica li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--espacio-3);
    padding-block: var(--espacio-3);
    border-top: 1px solid var(--rs-borde-sutil);
}

.actualidad-directorio {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: var(--espacio-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.actualidad-entidad {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--espacio-2);
    padding-block: var(--espacio-3);
    text-align: center;
}

.actualidad-entidad__escudo {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    overflow: hidden;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--tono-1);
    box-shadow: var(--sombra-sm);
}

.actualidad-entidad__escudo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.actualidad-entidad__enlaces {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px;
}
/* #endregion */

/* #region 4. Socio: premios y música */
.actualidad-anyo {
    border-top: 1px solid var(--rs-borde-sutil);
}

.actualidad-anyo > summary {
    display: flex;
    align-items: center;
    gap: var(--espacio-3);
    padding-block: var(--espacio-3);
    cursor: pointer;
    list-style: none;
}

.actualidad-anyo > summary::-webkit-details-marker {
    display: none;
}

.actualidad-anyo > summary strong {
    font-family: var(--fuente-display);
    font-size: 1.25rem;
}

.actualidad-anyo > summary .texto-tenue {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--rs-oro-texto);
}

.actualidad-anyo > summary > .icono:last-child {
    margin-left: auto;
    transition: transform var(--duracion-hover) var(--curva);
}

.actualidad-anyo[open] > summary > .icono:last-child {
    transform: rotate(180deg);
}

.actualidad-premios {
    padding-bottom: var(--espacio-3);
}

.actualidad-premio {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--espacio-3);
    padding-block: var(--espacio-2);
}

.actualidad-premio__copa {
    color: var(--rs-texto-tenue);
}

.actualidad-premio--nuestro .actualidad-premio__copa {
    color: var(--rs-oro-texto);
}

.actualidad-premio__foto {
    width: 56px;
    height: 56px;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: var(--radio-md);
    cursor: zoom-in;
}

.actualidad-premio__foto img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.actualidad-musica__acciones {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--espacio-2);
}
/* #endregion */

/* #region 5. Junta */
.pestanas__panel .tarjeta > [id^="lista-"] {
    margin-top: var(--espacio-4);
}

.actualidad-junta-lista {
    display: grid;
    gap: var(--espacio-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.actualidad-junta-fila {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--espacio-3);
    padding: var(--espacio-3);
    border: 1px solid var(--rs-borde-tarjeta);
    border-radius: var(--radio-lg);
}

.actualidad-junta-fila__icono {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: var(--radio-md);
    background: color-mix(in srgb, var(--tono-seccion, var(--marca-acento)) 14%, transparent);
    color: var(--tono-seccion, var(--marca-acento));
}

.actualidad-junta-fila__icono img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Un premio de la propia asociación: el trofeo, en dorado. */
.actualidad-junta-fila__icono:has(.actualidad-trofeo-propio) {
    background: color-mix(in srgb, var(--rs-aviso) 16%, transparent);
    color: var(--rs-aviso-texto);
}

.actualidad-junta-fila__datos {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.actualidad-junta-fila__datos small {
    overflow: hidden;
    color: var(--rs-texto-secundario);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.actualidad-junta-fila__acciones {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--espacio-2);
}

/* «Más» de cada fila: quitar su fichero y quitarla (2 nov 2026), abierto hacia la izquierda. */
.actualidad-mas .menu-desplegable__panel {
    right: 0;
    left: auto;
    min-width: 13rem;
}

.actualidad-estado {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--texto-pequeno);
    font-weight: 600;
}

.actualidad-estado--bien {
    color: var(--rs-exito-texto);
}

.actualidad-estado--aviso {
    color: var(--rs-aviso-texto);
}

.actualidad-familia-junta {
    display: flex;
    flex-direction: column;
    gap: var(--espacio-3);
}

.actualidad-familia-junta + .actualidad-familia-junta {
    margin-top: var(--espacio-5);
}

.actualidad-familia-junta__cabecera {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--espacio-2);
}

.actualidad-familia-junta__cabecera h3 {
    margin: 0 auto 0 0;
}

.actualidad-pueblos {
    display: grid;
    gap: var(--espacio-2);
    margin: var(--espacio-3) 0 0;
    padding: 0;
    list-style: none;
}

.actualidad-pueblos button {
    width: 100%;
    justify-content: flex-start;
    text-align: left;
}

.actualidad-subir {
    position: relative;
}

.actualidad-subir input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}
/* #endregion */

/* #region 6. Móvil */
@media (max-width: 760px) {
    .actualidad-titular img {
        width: 84px;
    }

    .actualidad-musica li,
    .actualidad-programas li,
    .actualidad-junta-fila {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .actualidad-musica__acciones,
    .actualidad-programas li > :last-child,
    .actualidad-junta-fila__acciones {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}
/* #endregion */

/* #region Noticias de la asociación (migración 0308) */
.actualidad-titular__marca {
    color: var(--marca-acento);
    font-size: var(--texto-etiqueta);
    font-weight: 600;
}

.actualidad-noticia__foto {
    display: block;
    width: 100%;
    max-height: 55vh;
    object-fit: cover;
    border-radius: var(--radio-lg);
}

.actualidad-noticia__fecha {
    display: flex;
    align-items: center;
    gap: var(--espacio-2);
    color: var(--rs-texto-secundario);
    font-size: var(--texto-pequeno);
}

.actualidad-noticia__texto {
    overflow-wrap: anywhere;
    line-height: 1.6;
}

.actualidad-ver-mas {
    display: flex;
    justify-content: center;
    margin-top: var(--espacio-3);
}
/* #endregion */

/* #region Reducir movimiento */
@media (prefers-reduced-motion: reduce) {
    .actualidad-anyo > summary > .icono:last-child {
        transition: none;
    }
}
/* #endregion */

/* #region Ajustes: buscar el pueblo, con el botón a la altura del campo */
.actualidad-pueblo {
    align-items: flex-end;
}

.actualidad-pueblo .campo {
    flex: 1 1 14rem;
    margin: 0;
}

.actualidad-pueblo .formulario-acciones {
    flex: none;
    align-items: center;
    margin: 0;
}
/* #endregion */
