/*
 * «Asambleas» del socio (12 oct 2026, docs/asambleas.md; rediseño del 19
 * oct 2026; sin cajas, 5 nov). Arriba, la que está en marcha, destacada y con las papeletas en
 * grande, pensadas para el pulgar en una sala llena; después, las próximas,
 * cada una con su fecha en grande, su voto y el orden del día; al final, las
 * ya celebradas en una lista corta con sus resultados y el acta.
 *
 *  1. Los grupos y la cabecera de cada asamblea
 *  2. Tu voto: cederlo y los que llevas
 *  3. La votación abierta y sus papeletas
 *  4. El orden del día y los resultados
 *  5. Las ya celebradas
 *
 * Convenciones: cada pieza lleva sus ajustes de móvil justo debajo.
 */

/* #region 1. Los grupos y la cabecera de cada asamblea */
.mis-asambleas {
    display: grid;
    gap: var(--espacio-10);
}

.mis-asambleas__grupo {
    display: grid;
    gap: var(--espacio-4);
}

.mis-asambleas__grupo > h2 {
    margin: 0;
    font-size: clamp(1.25rem, 1.6vw, 1.6rem);
    font-weight: 650;
    letter-spacing: -0.025em;
}

/* Cada asamblea, entre dos líneas. */
.mis-asambleas__tarjeta {
    display: grid;
    gap: var(--espacio-4);
    padding-top: var(--espacio-5);
    border-top: 1px solid var(--rs-borde-sutil);
}

.mis-asambleas__cabecera {
    display: flex;
    align-items: center;
    gap: var(--espacio-5);
}

/* La fecha, en su hoja de calendario: el mes arriba, en su banda, y el día en grande. */
.mis-asambleas__fecha {
    display: grid;
    flex: none;
    justify-items: stretch;
    width: 5.25rem;
    overflow: hidden;
    border-radius: 12px;
    background: #FFFFFF;
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.1), 0 12px 22px rgb(0 0 0 / 0.14);
    color: #1B1A17;
    line-height: 1;
    text-align: center;
}

.mis-asambleas__dia {
    order: 1;
    padding: var(--espacio-2) 0;
    font-family: var(--fuente-display);
    font-size: 2.4rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.04em;
}

.mis-asambleas__mes {
    order: 0;
    padding: 5px 0 4px;
    background: var(--marca-boton);
    color: var(--marca-boton-texto, #FFFFFF);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mis-asambleas__titulos {
    display: grid;
    flex: 1;
    gap: 2px;
    min-width: 0;
}

.mis-asambleas__titulos h3 {
    margin: 0;
    font-family: var(--fuente-display);
    font-size: clamp(1.25rem, 1.6vw, 1.6rem);
    font-weight: 650;
    letter-spacing: -0.025em;
    line-height: 1.2;
}

.mis-asambleas__tipo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--espacio-2);
    margin: 0;
    color: var(--rs-texto-secundario);
    font-size: var(--texto-etiqueta);
}

/* «En directo», latiendo. */
.mis-asambleas__directo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--marca-acento);
    font-weight: 700;
}

.mis-asambleas__directo::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    animation: asamblea-latido 1.4s ease-in-out infinite;
}

@keyframes asamblea-latido {
    50% { opacity: 0.35; }
}

.mis-asambleas__cuando {
    margin: var(--espacio-1) 0 0;
    color: var(--rs-texto-secundario);
    font-size: var(--texto-etiqueta);
}

.mis-asambleas__cuando span + span::before {
    content: " · ";
}

.mis-asambleas__nota {
    margin: 0;
    color: var(--rs-texto-secundario);
}

/* El evento que va con ella. */
.mis-asambleas__evento {
    color: var(--marca-acento);
    font-weight: 600;
    text-decoration: none;
}

.mis-asambleas__evento:hover {
    color: var(--rs-texto);
    text-decoration: none;
}

.mis-asambleas__conectar {
    display: grid;
    gap: var(--espacio-2);
}

.mis-asambleas__conectar p {
    margin: 0;
}

@media (prefers-reduced-motion: reduce) {
    .mis-asambleas__directo::before {
        animation: none;
    }
}
/* #endregion */

/* #region 2. Tu voto: cederlo y los que llevas */
.mis-asambleas__mi-voto {
    display: grid;
    justify-items: start;
    gap: var(--espacio-2);
}

.mis-asambleas__mi-voto > * {
    width: 100%;
}

.mis-asambleas__mi-voto > :is(.boton, .boton-enlace, .mis-asambleas__ceder) {
    width: auto;
}

.mis-asambleas__mi-voto p {
    display: flex;
    align-items: center;
    gap: var(--espacio-2);
    margin: 0;
}

.mis-asambleas__mi-voto p .icono {
    flex: none;
    color: var(--marca-acento);
}

.mis-asambleas__mi-voto > .boton {
    justify-self: start;
}

.mis-asambleas__lleva {
    display: grid;
    gap: var(--espacio-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.mis-asambleas__lleva li {
    display: flex;
    justify-content: space-between;
    gap: var(--espacio-3);
    padding-block: var(--espacio-2);
    border-top: 1px solid var(--rs-borde-sutil);
}

/* «¿No puedes venir? Cede tu voto»: un botón que abre a quién se lo cedes. */
.mis-asambleas__ceder > summary {
    justify-self: start;
    width: fit-content;
    list-style: none;
}

.mis-asambleas__ceder > summary::-webkit-details-marker {
    display: none;
}

.mis-asambleas__ceder[open] {
    display: grid;
    gap: var(--espacio-2);
}

.mis-asambleas__ceder[open] > summary {
    margin-bottom: var(--espacio-1);
}

.mis-asambleas__ceder label {
    font-weight: 600;
}

.mis-asambleas__encontrados {
    display: grid;
    gap: var(--espacio-1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.mis-asambleas__encontrados .boton {
    width: 100%;
    justify-content: flex-start;
}

/* El documento de cesión: firmarlo con el dedo, o el aviso de que aún falta. */
.mis-asambleas__firmar,
.mis-asambleas__falta {
    display: grid;
    gap: var(--espacio-3);
}

.mis-asambleas__falta {
    margin: 0;
}

.mis-asambleas__lienzo {
    display: grid;
    gap: var(--espacio-1);
}

.mis-asambleas__lienzo p {
    font-weight: 600;
}

.mis-asambleas__lienzo canvas {
    width: 100%;
    max-width: 600px;
    height: auto;
    aspect-ratio: 3 / 1;
    border: 2px dashed var(--rs-borde-fuerte);
    border-radius: var(--radio-md);
    background: #FFFFFF;
    touch-action: none;
}

.mis-asambleas__lienzo .boton-enlace {
    justify-self: start;
}

.mis-asambleas__acciones {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--espacio-2);
}

.mis-asambleas__mi-voto p.mis-asambleas__documento {
    flex-wrap: wrap;
}

.mis-asambleas__mi-voto p.mis-asambleas__documento .icono {
    color: var(--rs-exito);
}
/* #endregion */

/* #region 3. La votación abierta y sus papeletas */
.mis-asambleas__votacion {
    display: grid;
    gap: var(--espacio-3);
}

.mis-asambleas__votacion h3 {
    margin: 0;
    font-size: 1.25rem;
}

.mis-asambleas__votacion p {
    margin: 0;
}

.mis-asambleas__aviso {
    display: flex;
    align-items: center;
    gap: var(--espacio-2);
    color: var(--marca-acento);
    font-weight: 700;
}

.mis-asambleas__secreta {
    display: flex;
    align-items: center;
    gap: var(--espacio-2);
    color: var(--rs-texto-secundario);
    font-size: var(--texto-etiqueta);
}

.mis-asambleas__papeleta {
    display: grid;
    gap: var(--espacio-3);
    padding: var(--espacio-3);
    border-radius: var(--radio-md);
    background: var(--rs-superficie-1);
}

.mis-asambleas__papeleta fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.mis-asambleas__papeleta legend {
    margin-bottom: var(--espacio-2);
    font-weight: 600;
}

.mis-asambleas__papeleta legend small {
    color: var(--rs-texto-secundario);
    font-weight: 400;
}

.mis-asambleas__papeleta--hecha {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: var(--espacio-2);
}

.mis-asambleas__papeleta--hecha strong {
    display: flex;
    align-items: center;
    gap: var(--espacio-1);
    color: var(--rs-exito);
}

.mis-asambleas__opciones {
    display: grid;
    gap: var(--espacio-2);
}

.mis-asambleas__opcion {
    display: flex;
    align-items: center;
    gap: var(--espacio-3);
    min-height: 52px;
    padding: var(--espacio-2) var(--espacio-3);
    border: 2px solid var(--rs-borde);
    border-radius: var(--radio-md);
    font-size: 1.05rem;
    font-weight: 600;
    cursor: pointer;
}

.mis-asambleas__opcion input {
    width: 22px;
    height: 22px;
    accent-color: var(--marca-boton);
}

.mis-asambleas__opcion:has(input:checked) {
    border-color: var(--marca-acento);
    background: color-mix(in srgb, var(--marca-acento) 10%, transparent);
}

.mis-asambleas__opcion--a_favor:has(input:checked) {
    border-color: var(--rs-exito);
    background: color-mix(in srgb, var(--rs-exito) 12%, transparent);
}

.mis-asambleas__opcion--en_contra:has(input:checked) {
    border-color: var(--rs-peligro);
    background: color-mix(in srgb, var(--rs-peligro) 10%, transparent);
}

.mis-asambleas__papeleta .boton {
    width: 100%;
    justify-content: center;
}
/* #endregion */

/* #region 4. El orden del día, en su hoja, y los resultados */
.mis-asambleas__orden {
    padding-inline: clamp(16px, 2vw, 28px) 46px;
    border: 0;
}

.mis-asambleas__orden[open] {
    padding-bottom: var(--espacio-3);
}

/* Los puntos, numerados. */
.mis-asambleas__puntos {
    display: grid;
    gap: var(--espacio-2);
    margin: var(--espacio-1) 0 var(--espacio-2);
    padding: 0;
    list-style: none;
    counter-reset: punto;
}

.mis-asambleas__puntos li {
    position: relative;
    padding-left: 28px;
    counter-increment: punto;
    line-height: 1.45;
}

.mis-asambleas__puntos li::before {
    content: counter(punto);
    position: absolute;
    left: 0;
    color: var(--rs-texto-tenue);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.mis-asambleas__resultados > ul {
    display: grid;
    gap: var(--espacio-4);
    margin: var(--espacio-1) 0 var(--espacio-2);
    padding: 0;
    list-style: none;
}

.mis-asambleas__resultado p {
    margin: 0 0 var(--espacio-2);
}

.mis-asambleas__resultado ul {
    display: grid;
    gap: var(--espacio-1);
    margin: 0 0 var(--espacio-1);
    padding: 0;
    list-style: none;
}

.mis-asambleas__resultado li {
    display: grid;
    grid-template-columns: minmax(6rem, 10rem) 1fr auto;
    align-items: center;
    gap: var(--espacio-2);
}

.mis-asambleas__resultado li.gana span:first-child {
    font-weight: 700;
}

.mis-asambleas__barra {
    height: 8px;
    border-radius: var(--radio-pildora);
    background: var(--rs-superficie-3);
    overflow: hidden;
}

.mis-asambleas__barra > span {
    display: block;
    height: 100%;
    background: var(--rs-texto-tenue);
}

.mis-asambleas__resultado li.gana .mis-asambleas__barra > span {
    background: var(--marca-acento);
}
/* Votación a la vista: quién votó qué, plegado debajo del resultado. */
.mis-asambleas__nominal > summary {
    display: inline-flex;
    align-items: center;
    gap: var(--espacio-1);
    cursor: pointer;
    color: var(--rs-texto-secundario);
    font-size: var(--texto-pequeno);
}

.mis-asambleas__nominal ul {
    display: grid;
    gap: 2px;
    margin: var(--espacio-2) 0 0;
    padding: 0;
    list-style: none;
}

.mis-asambleas__nominal li {
    display: flex;
    justify-content: space-between;
    gap: var(--espacio-3);
    padding: var(--espacio-1) 0;
    border-bottom: 1px solid var(--rs-borde);
    font-size: var(--texto-pequeno);
}
/* #endregion */

/* #region 5. Las ya celebradas */
/* Una lista corta: cada una en su fila, con el acta a la derecha. */
.mis-asambleas__celebradas {
    display: grid;
    border-block: 1px solid var(--rs-borde-sutil);
}

.mis-asambleas__celebrada {
    display: grid;
    gap: var(--espacio-2);
    padding-block: var(--espacio-3);
}

.mis-asambleas__celebrada + .mis-asambleas__celebrada {
    border-top: 1px solid var(--rs-borde-sutil);
}

.mis-asambleas__celebrada .mis-asambleas__fecha {
    color: var(--rs-texto-secundario);
}

.mis-asambleas__celebrada .mis-asambleas__dia {
    font-size: 1.75rem;
}

.mis-asambleas__celebrada .mis-asambleas__titulos h3 {
    font-family: inherit;
    font-size: var(--texto-grande);
    font-weight: 600;
    letter-spacing: 0;
}

.mis-asambleas__celebrada .plegable {
    margin-left: calc(4.5rem + var(--espacio-5));
    border-top: 0;
}

@media (max-width: 767px) {
    /* El acta, debajo del título (al lado lo estrechaba hasta partirlo palabra a palabra). */
    .mis-asambleas__celebrada .mis-asambleas__cabecera {
        flex-wrap: wrap;
        row-gap: var(--espacio-2);
    }

    .mis-asambleas__celebrada .mis-asambleas__titulos {
        flex-basis: calc(100% - 4.5rem - var(--espacio-5));
    }

    .mis-asambleas__celebrada .mis-asambleas__cabecera > .boton-enlace {
        margin-left: calc(4.5rem + var(--espacio-5));
    }

    .mis-asambleas__celebrada .plegable {
        margin-left: 0;
    }
}
/* «Ver anteriores»: el histórico no caduca. */
.mis-asambleas__anteriores {
    justify-self: center;
    margin-top: var(--espacio-3);
}
/* #endregion */