.swiper { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; }
        .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; }
        .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; }
        .swiper-scrollbar { border-radius: 10px; position: relative; background: #edf2f7; height: 6px !important; bottom: 0 !important; }
        .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: #cbd5e0; border-radius: 10px; left: 0; top: 0; }

        /* Estructura general */
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #f4f6f9; color: #333; margin: 0; padding: 20px; }
        .contenedor { max-width: 1200px; margin: 0 auto; background: white; padding: 30px; border-radius: 10px;  }
        .header-banner { background: url('https://utadeovirtual.utadeo.edu.co/pluginfile.php/2399/mod_folder/content/0/header_tools.jpg'); background-size: cover; background-position: center; width: 100%; height: 250px; border-radius: 10px; }
        .encabezado { width: 100%; text-align: center; }
        .encabezado h1 { background: white; border-radius: 10px 10px 0 0; padding: 15px 40px; margin: -40px auto 0 auto; display: inline-block; box-shadow: 0 -5px 15px rgba(0,0,0,0.1); font-size: 24px; color: #1a365d; text-transform: uppercase; letter-spacing: 1px; }
        h2.section-title { color: #2b6cb0; border-bottom: 2px solid #e2e8f0; padding-bottom: 10px; margin-top: 40px; font-size: 22px; }
        p.section-desc { line-height: 1.6; color: #4a5568; margin-top: 10px; margin-bottom: 25px; }
        
        /* Swiper y Cards */
        .box-tool { margin-top: 10px; padding: 10px 0; }
        .swiper { width: 100%; padding-bottom: 40px !important; }
        
        /* FIX MOODLE OVERFLOW: Permitir que los menús flotantes sobresalgan del contenedor */
        .swiper-slide { overflow: visible !important; }
        .post { background: #fff; border-radius: 12px; box-shadow: 0 4px 10px rgba(0,0,0,0.08); overflow: visible !important; border: 1px solid #edf2f7; transition: transform 0.3s ease; height: auto; display: flex; flex-direction: column; position: relative; }
        .post:hover, .post:focus-within { z-index: 50 !important; } /* Sube la tarjeta en foco para evitar que otras tapen el menú */
        
        .post-img { width: 100%; height: 150px; object-fit: cover; border-radius: 12px 12px 0 0; background: #e2e8f0; }
        .post-body { padding: 30px 20px 20px 20px; position: relative; flex-grow: 1; display: flex; flex-direction: column; overflow: visible !important; }
        .post-avatar { width: 55px; height: 55px; border-radius: 50%; position: absolute; top: -27px; left: 20px; background: white; padding: 4px; box-shadow: 0 3px 8px rgba(0,0,0,0.15); object-fit: cover; }
        .post-name { font-size: 18px; margin: 0 0 8px 0; color: #2d3748; font-weight: 600; }
        .post-author { font-size: 14px; color: #718096; margin: 0 0 10px 0; line-height: 1.4; flex-grow: 1; }
        
        /* Dropdown de Acciones CORREGIDO */
        .post-actions { align-self: flex-end; margin-top: 10px; position: relative; overflow: visible !important; }
        .post-actions-controller { background: #edf2f7; border: none; cursor: pointer; color: #4a5568; width: 35px; height: 35px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background 0.2s; }
        .post-actions-controller:hover { background: #e2e8f0; color: #2b6cb0; }
        
        /* Menú Flotante */
        .post-actions-content { 
            position: absolute !important; 
            bottom: 115% !important; 
            right: 0 !important; 
            background: #ffffff !important; 
            box-shadow: 0 8px 25px rgba(0,0,0,0.2) !important; 
            border-radius: 8px !important; 
            width: 160px !important; 
            z-index: 9999 !important; /* Valor alto para superar Moodle */
            display: none !important; 
            padding: 8px 0 !important; 
            border: 1px solid #e2e8f0 !important; 
        }
        
        /* Regla de visibilidad reforzada */
        .post-actions-content[data-visible="true"] { 
            display: block !important; 
            animation: fadeIn 0.2s ease; 
        }
        
        .grid-flow { list-style: none; margin: 0; padding: 0; }
        .post-actions-link { display: flex; align-items: center; padding: 10px 15px; color: #4a5568; text-decoration: none; font-size: 14px; transition: background 0.2s; cursor: pointer; }
        .post-actions-link:hover { background: #f7fafc; color: #2b6cb0; }
        .post-actions-link i { width: 24px; text-align: center; margin-right: 8px; color: #a0aec0; }
        .post-actions-link:hover i { color: #2b6cb0; }
        
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

        /* Modales */
        .detalle { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 99999; backdrop-filter: blur(3px); }
        .cont_detalle { background: white; width: 90%; max-width: 750px; border-radius: 12px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); box-shadow: 0 15px 30px rgba(0,0,0,0.3); display: flex; flex-direction: column; overflow: hidden; }
        @media (min-width: 768px) { .cont_detalle { flex-direction: row; height: auto; min-height: 350px; } }
        .img_detalle { width: 100%; height: 200px; object-fit: cover; }
        @media (min-width: 768px) { .img_detalle { width: 45%; height: auto; } }
        .txt_detalle { padding: 40px 30px; width: 100%; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; }
        @media (min-width: 768px) { .txt_detalle { width: 55%; } }
        .txt_detalle h2 { margin-top: 0; font-size: 24px; color: #2d3748; margin-bottom: 15px; }
        .txt_detalle p { font-size: 15px; margin-bottom: 15px; line-height: 1.6; color: #4a5568; }
        .cerrar_detalle { position: absolute; top: 15px; right: 20px; font-size: 28px; cursor: pointer; color: #a0aec0; background: none; border: none; transition: color 0.2s; z-index: 10; line-height: 1; padding: 0; }
        .cerrar_detalle:hover { color: #e53e3e; }
        .btn-sitio { display: inline-flex; align-items: center; background: #2b6cb0; color: white; padding: 12px 24px; border-radius: 6px; text-decoration: none; font-weight: 600; margin-top: auto; align-self: flex-start; transition: background 0.3s; }
        .btn-sitio i { margin-right: 8px; }
        .btn-sitio:hover { background: #2c5282; }