/* 1. LAYOUT DEL CONTENEDOR */
.mwp-slider-container {
    position: relative;
    width: 100%;
    height: 600px; /* Altura por defecto */
    overflow: hidden; /* Oculta las diapositivas laterales */
    box-sizing: border-box;
}

/* 2. PISTA DE DESLIZAMIENTO (WRAPPER) */
.mwp-slides-wrapper {
    display: flex; /* Pone los slides en fila */
    width: 100%;   /* Ocupa el ancho del padre */
    height: 100%;
    /* La transición se maneja aquí. La velocidad se puede inyectar por PHP, pero ponemos un default */
    transition: transform 0.8s ease-in-out;
    will-change: transform; /* Optimización de rendimiento */
}

/* 3. DIAPOSITIVA INDIVIDUAL (LA SOLUCIÓN) */
.mwp-slide {
    /* ESTA ES LA CLAVE QUE FALTABA: */
    flex: 0 0 100%;      /* No crecer, no encoger, base 100% */
    min-width: 100%;     /* Forzar ancho mínimo */
    max-width: 100%;     /* Forzar ancho máximo */
    
    height: 100%;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
}

/* 4. CONTROLES Y UI (Se mantienen igual para el diseño) */
.mwp-controls {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none;
}
.mwp-prev-btn, .mwp-next-btn {
    position: absolute; top: 50%; transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.5); color: white; border: none;
    padding: 15px; cursor: pointer; z-index: 20; font-size: 2em;
    pointer-events: auto; /* Habilitar click */
}
.mwp-prev-btn:hover, .mwp-next-btn:hover { background: rgba(0, 0, 0, 0.8); }
.mwp-prev-btn { left: 10px; }
.mwp-next-btn { right: 10px; }

.mwp-pagination {
    position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
    z-index: 20; display: flex; gap: 10px; pointer-events: auto;
}
.mwp-dot {
    width: 12px; height: 12px; background: rgba(255,255,255,0.5); border-radius: 50%; cursor: pointer; transition: 0.3s;
}
.mwp-dot.active { background: white; transform: scale(1.2); }

/* Overlay y Texto */
.mwp-slide::after { content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.3); z-index: 1; }
.mwp-slide-content { z-index: 2; padding: 20px; position: relative; }
.mwp-slide-content h2 { font-size: 3em; color: white; margin-bottom: 10px; }
.mwp-btn { display: inline-block; padding: 10px 20px; background: #ff5722; color: white; text-decoration: none; margin-top: 15px; border-radius: 4px; }

/* RESPONSIVE */
@media (max-width: 768px) {
    .mwp-slider-container { height: 400px !important; } /* Forzar altura en móviles */
    .mwp-slide-content h2 { font-size: 1.8em; }
}