/*
 * «Mis documentos» del socio (12 oct 2026, docs/secretaria.md; sin cajas, 5 nov 2026): lo que tiene que firmar, las
 * circulares, sus certificados, las actas y los papeles de la asociación. Las filas son las de socio-filas.css.
 *
 *  1. Piezas comunes
 *  2. Firmar: cada documento y sus personas
 *  3. Circulares
 *  4. Certificados, actas y papeles
 */

/* #region 1. Piezas comunes */
/* Cuántas cosas esperan en esa pestaña, en ámbar. */
.mis-documentos__contador {
    display: inline-grid;
    place-items: center;
    min-width: 1.35rem;
    height: 1.35rem;
    margin-left: auto;
    padding: 0 6px;
    border-radius: var(--radio-pildora);
    background: var(--rs-aviso);
    color: #FFFFFF;
    font-size: var(--texto-pequeno);
    font-weight: 700;
}

.mis-documentos__contador[hidden] {
    display: none;
}

.mis-documentos__panel {
    display: grid;
    gap: var(--espacio-8);
}

.mis-documentos__panel[hidden] {
    display: none;
}

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

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

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

.mis-documentos__titulos h2 {
    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-documentos__titulos p {
    display: flex;
    flex-wrap: wrap;
    gap: var(--espacio-1) var(--espacio-3);
    margin: 0;
    color: var(--rs-texto-secundario);
    font-size: var(--texto-etiqueta);
}

.mis-documentos__titulos p:empty {
    display: none;
}

/* Lo que se lee antes de firmar: se desplaza por dentro, entre dos líneas. */
.mis-documentos__texto {
    max-height: 60vh;
    overflow: auto;
    padding-block: var(--espacio-3);
    border-block: 1px solid var(--rs-borde-sutil);
    line-height: 1.6;
}

.mis-documentos__texto p {
    margin: 0 0 var(--espacio-2);
    white-space: pre-line;
}

.mis-documentos__acciones {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: var(--espacio-2) var(--espacio-4);
}

.mis-documentos__hecho {
    margin: 0;
    color: var(--rs-exito-texto);
    font-weight: 600;
}
/* #endregion */

/* #region 2. Firmar: cada documento, una hoja, con quién firma (socio-papeles.css) */
.mis-documentos__documento {
    display: grid;
    gap: var(--espacio-3);
    padding: clamp(20px, 2.4vw, 34px);
}

.mis-documentos__personas {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mis-documentos__persona {
    display: grid;
    gap: var(--espacio-3);
    padding-block: var(--espacio-3);
    border-top: 1px solid var(--rs-borde-sutil);
}

/* Su cara, quién es, cómo va y qué hacer. */
.mis-documentos__fila {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--espacio-2) var(--espacio-3);
}

.mis-documentos__quien {
    flex: 1 1 8rem;
    min-width: 0;
}

/* Lo firmado, con su firma de tinta al lado del nombre. */
.mis-documentos__persona--hecha .mis-documentos__quien::after {
    content: "";
    display: inline-block;
    width: 5.5rem;
    height: 1.6rem;
    margin-left: var(--espacio-3);
    vertical-align: middle;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 32' fill='none' stroke='%231d4e89' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 22c6-12 12-18 15-16s-5 20-2 21 8-15 12-14-2 12 2 12 7-9 11-9-1 8 3 8 6-6 10-6 2 5 6 5 8-5 14-5 12 1 30-4'/%3E%3C/svg%3E") left center / contain no-repeat;
}

.mis-documentos__fila > .etiqueta {
    flex: none;
}

.mis-documentos__fila > .mis-documentos__acciones {
    margin-left: auto;
}

.mis-documentos__firmar {
    display: grid;
    gap: var(--espacio-3);
}

.mis-documentos__firmar .mis-documentos__acciones {
    justify-content: flex-start;
}

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

.mis-documentos__lienzo p {
    margin: 0;
    font-weight: 600;
}

.mis-documentos__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-documentos__lienzo .boton-enlace {
    justify-self: start;
}
/* #endregion */

/* #region 3. Circulares */
.mis-documentos__lista:has(.mis-documentos__circular) {
    gap: 0;
    border-bottom: 1px solid var(--rs-borde-sutil);
}

.mis-documentos__circular {
    padding-inline: clamp(18px, 2vw, 28px);
}

.mis-documentos__circular details > :not(summary):last-child {
    padding-bottom: var(--espacio-4);
}

.mis-documentos__circular summary {
    padding-block: var(--espacio-4);
    list-style: none;
    cursor: pointer;
}

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

.mis-documentos__circular .mis-documentos__titulos h2 {
    font-family: inherit;
    font-size: var(--texto-grande);
    font-weight: 600;
    letter-spacing: 0;
}

.mis-documentos__circular summary > .icono:last-child {
    flex: none;
    width: 20px;
    height: 20px;
    color: var(--rs-texto-tenue);
    transition: transform var(--duracion-menu) var(--curva);
}

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

.mis-documentos__circular summary:focus-visible {
    outline: none;
    box-shadow: var(--anillo-foco);
}

.mis-documentos__circular details > :not(summary) {
    margin-bottom: var(--espacio-4);
}

.mis-documentos__circular .mis-documentos__acciones {
    justify-content: flex-start;
}

.mis-documentos__nueva {
    color: var(--marca-acento);
    font-weight: 700;
}

@media (prefers-reduced-motion: reduce) {
    .mis-documentos__circular summary > .icono:last-child {
        transition: none;
    }
}
/* #endregion */

/* #region 4. Certificados, actas y papeles */
.mis-documentos__pedir {
    display: grid;
    gap: var(--espacio-3);
}

.mis-documentos__pedir[hidden] {
    display: none;
}

.mis-documentos__pedir .lista-agrupada__titulo,
.mis-documentos__carpeta .lista-agrupada__titulo {
    margin: 0;
}

.mis-documentos__botones {
    display: flex;
    flex-wrap: wrap;
    gap: var(--espacio-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Una fila por certificado, acta o papel, con sus líneas finas. */
.mis-documentos__filas {
    display: grid;
    margin: 0;
    padding: var(--espacio-2) clamp(18px, 2vw, 28px);
    list-style: none;
}

.mis-documentos__filas[hidden],
.mis-documentos__filas:empty {
    display: none;
}

.mis-documentos__filas .fila-lista {
    flex-wrap: wrap;
}

.mis-documentos__carpeta {
    display: grid;
    gap: var(--espacio-3);
    margin-top: var(--espacio-8);
}
/* #endregion */
