/* Estilos para centrar la isla dinámica y hacerla flotar */
.dynamic-island-container {
    position: fixed !important;
    top: 15px !important; /* Separación del borde superior */
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto !important;
    transform: none !important;
    z-index: 9999 !important;
    width: 160px !important; /* Ancho fijo para la isla no expandida */
    text-align: center !important;
    border-radius: 26px !important; /* Bordes redondeados */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important; /* Sombra suave para efecto flotante */
}

/* Asegurar que el contenido de la isla esté centrado */
.dynamic-island-content {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
}

/* Ajustes para dispositivos móviles */
@media only screen and (max-width: 767px) {
    .dynamic-island-container {
        width: 138px !important;
        left: 0 !important;
        right: 0 !important;
        margin: 0 auto !important;
        transform: none !important;
    }
}