/* ============================================ */
/* responsive.css - Ajustes para móviles y tablets */
/* ============================================ */

/* Ocultar menú inferior en escritorio */
@media (min-width: 769px) {
    #menu-inferior { display: none; }
}

/* Tablets */
@media (min-width: 769px) and (max-width: 1024px) {
    .layout-3columnas { grid-template-columns: 220px 1fr 250px; gap: 14px; padding: 16px; }
    .grid-categorias { grid-template-columns: repeat(2, 1fr); }
    .herramientas-grid, .recursos-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Móviles */
@media (max-width: 768px) {
    body { padding-top: 56px; padding-bottom: 72px; }

    /* Ocultar barra de navegación superior en móvil */
    .barra-navegacion { display: none !important; }

    /* Mostrar columnas laterales como secciones apiladas */
    #columna-izquierda, #columna-derecha {
        display: block !important;
        width: 100%;
        height: auto !important;
        overflow-y: visible !important;
        margin-bottom: 16px;
    }

    /* Layout vertical para móvil */
    .layout-3columnas {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        overflow: visible !important;
        padding: 10px 10px;
    }

    /* Columna central */
    .columna-central {
        width: 100%;
        height: auto !important;
        overflow-y: visible !important;
        padding: 0;
    }

    /* Secciones: ocultar completamente las no activas */
    .seccion {
        display: none !important;
        opacity: 1 !important;
    }
    .seccion.activa {
        display: block !important;
    }

    /* Cabecera */
    .cabecera { height: 56px; }
    .cabecera-contenido { padding: 0 14px; }
    .logo { font-size: 1.1rem; }
    .btn-agendar { font-size: 0.8rem; padding: 8px 14px; }
    .titulo-seccion { font-size: 1.2rem; }
    .subtitulo-seccion { font-size: 0.85rem; margin-bottom: 18px; }

    /* Muro */
    .muro { gap: 12px; }
    .post-card-imagen { height: 180px; }
    .post-card-cuerpo { padding: 12px 14px 8px; }
    .post-card-titulo { font-size: 1.05rem; }
    .post-card-extracto { font-size: 0.85rem; }
    .post-card-meta { font-size: 0.75rem; }
    .post-card-interacciones { padding: 8px 14px 12px; font-size: 0.8rem; gap: 16px; }

    /* Categorías */
    .grid-categorias { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .categoria-card { padding: 16px 12px; }
    .categoria-icono { font-size: 2rem; }
    .categoria-nombre { font-size: 0.85rem; }

    /* Herramientas y Recursos */
    .herramientas-grid, .recursos-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .herramienta-card, .recurso-card { padding: 16px; }

    /* Perfil */
    .perfil-foto { width: 80px; height: 80px; font-size: 2.5rem; }
    .perfil-nombre { font-size: 1.2rem; }
    .perfil-descripcion { font-size: 0.9rem; padding: 0 10px; }
    .perfil-contacto { max-width: 100%; padding: 0 20px; }

    /* Widgets */
    .widget { padding: 12px; margin-bottom: 10px; }

    /* Menú inferior visible */
    #menu-inferior { display: flex; }
}

/* Móviles pequeños */
@media (max-width: 400px) {
    .herramientas-grid, .recursos-grid { grid-template-columns: 1fr; }
    .grid-categorias { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .menu-texto { font-size: 0.6rem; }
    .menu-icono { font-size: 1.2rem; }
    .post-card-imagen { height: 150px; }
}