/* Estilos para corregir la barra lateral en versión escritorio */
/* Por defecto, la barra lateral debe estar oculta hasta que se active */
.cd-primary-nav {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    visibility: hidden;
    opacity: 0;
    transition: transform 0.4s, visibility 0s 0.4s, opacity 0.4s;
    height: 100%;
    width: 300px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background: rgba(247, 247, 247, 0.96);
    overflow-y: auto;
}

/* Solo mostrar la barra lateral cuando tiene la clase is-visible */
.cd-primary-nav.is-visible {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    visibility: visible;
    opacity: 1;
    transition: transform 0.4s, visibility 0s 0s, opacity 0.4s;
}

/* Ajustar el contenido principal cuando la barra lateral está visible en escritorio */
@media only screen and (min-width: 1170px) {
    /* Asegurarse que el botón de menú sea visible en escritorio */
    .cd-primary-nav-trigger {
        display: block !important;
        z-index: 1100;
    }
    
    /* Cuando la barra lateral está visible, ajustar el contenido principal */
    .cd-primary-nav.is-visible + .cd-main-content {
        margin-left: 300px;
        transition: margin-left 0.4s;
    }
    
    /* Transición suave para el contenido principal */
    .cd-main-content {
        transition: margin-left 0.4s;
        margin-left: 0;
    }
}

/* Ocultar la isla dinámica en escritorio */
@media only screen and (min-width: 768px) {
    .dynamic-island-container {
        display: none !important;
    }
}
