/* ============================================================
   MOBILE / _perfil.css — Perfil de usuario (/u)
   Archivo desktop relacionado: perfil-figma.css
   ============================================================ */

/* ── Layout de 2 columnas → 1 columna en tablet/móvil ───────── */
@media (max-width: 1023px) {

    .perfil-figma-layout {
        grid-template-columns: 1fr;
    }
}

/* ── Padding de la página ───────────────────────────────────── */
@media (max-width: 639px) {

    .perfil-figma-page {
        padding: 24px 16px 40px;
    }

    .perfil-figma-page .perfil-figma-title {
        font-size: clamp(1.4rem, 6vw, 1.8rem);
        margin-bottom: 20px;
    }
}

/* ── Tabla del perfil (historial resumido) ──────────────────── */
@media (max-width: 639px) {

    /* Wrapper con scroll horizontal para tablas que no pueden colapsarse */
    .perfil-figma-tabla-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 -16px;          /* sangría negativa para usar ancho completo */
        padding: 0 16px 8px;
    }

    .perfil-figma-tabla {
        min-width: 480px;         /* fuerza scroll en lugar de comprimir columnas */
    }

    .perfil-figma-tabla th,
    .perfil-figma-tabla td {
        padding: 8px 10px;
        font-size: 0.82rem;
        white-space: nowrap;
    }
}

/* ── Formulario de perfil ───────────────────────────────────── */
@media (max-width: 639px) {

    .perfil-figma-form-group input {
        font-size: 16px;    /* evita zoom automático en iOS al hacer focus */
    }

    .perfil-figma-btn-primary {
        min-height: 48px;   /* área táctil cómoda */
    }
}

/* ── Tarjetas del perfil ────────────────────────────────────── */
@media (max-width: 639px) {

    .perfil-figma-card {
        padding: 16px;
    }

    .perfil-figma-card-title {
        font-size: 1.05rem;
    }
}