/* style.css */
body {
    margin: 0;
    overflow: hidden;
    /* Evita barras de desplazamiento */
    font-family: sans-serif;
    box-sizing: content-box; /* Add this line */
}


#mobile-content {
    object-fit: cover;
    min-height: 100vh;
    width: 100vw;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


#desktop-content {
    min-height: 100vh;
    width: 100vw;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


.background-image {
    background-image: url('/assets/images/botaniq-music-label-by-dennis-cruz-2025.jpg'); /* Reemplazar con la URL de la imagen adjunta */
}
.background-image-mobile {
    background-image: url('/assets/images/botaniq-music-label-by-dennis-cruz-2025-mobile.jpg'); /* Reemplazar con la URL de la imagen adjunta */
}

/* Estilos adicionales para los botones */
.btn-primary {
    font-weight: bold;
    border-radius: 10px;
}

.bg-dark-botaniq {
    background-color: #271b00; /* Reemplaza con el código de color negro deseado  */
}


.btn-outline-light {
    border-radius: 50%;
    /* Hace los iconos circulares */
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1;
    /* Centra el icono verticalmente */
    padding: 0;
}


.btn-outline-light i {
    font-size: 1.5em;
}


/* Ajustes para el modal de video (ya proporcionados por Bootstrap) */


/* Offcanvas styles */
.offcanvas {
    border: none; /* AQUÍ: Elimina el borde general del offcanvas */
}

.offcanvas-header {
    border: none; /* AQUÍ:  Elimina el borde general del offcanvas header */
}

.offcanvas-body {
    border: none;/* AQUÍ:  Elimina el borde general del offcanvas body */
}

#offcanvas-trigger-area {
    position: fixed;
    top: 0;
    right: 0;
    width: 60px;
    height: 70px;
    /* background-color: rgba(0, 0, 0, 0.1); */
    /* Just for visualization */
    z-index: 1000;
}

.fixed-offcanvas {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1050; /* Bootstrap's default offcanvas z-index */
}

/* Override Bootstrap's default behavior to NOT hide the offcanvas */
.offcanvas.show {
    transform: none;
    border: none;
}

.offcanvas-backdrop.show {
    opacity: 0;
    visibility: hidden;
    border: none;
}