/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */



html {
    height: 100%;
    width: 100%;
}

body {
    font-family: opensans_regular, Arial;
    background-color: #29292a;
    height: 100%;
}

/*****************************************************/
/********************HEADER***************************/
/*****************************************************/
header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.imgHome {
    width: 16vw;
}

header p {
    color: rgba(181, 181, 181, 1);
    margin-right: 1.4em;
    font-size: 1.2vw;
}

header .logout-header {
    color: white;
}

/*****************************************************/
/********************MAIN***************************/
/*****************************************************/

main {
    background-color: #404041;

}

.simple-carousel {
    overflow: hidden; /* Hide the overflowing part */
    width: 100%;
    position: relative; /* Used to position the buttons */
}

.carousel-images {
    display: flex; /* Line up the images horizontally */
    transition: transform 0.3s; /* Smooth translation */
}

.carousel-image {
    flex: 0 0 100%; /* Take up 100% of the carousel width */
    max-width: 100%; /* Set maximum width */
}

.carousel-nav {
    position: absolute;
    bottom: 0;
    height: 10%;
    width: 10%;
    cursor: pointer;
}

.carousel-prev {
    left: 0;
}

.carousel-next {
    right: 0;
}


.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

.modal-content {
    max-width: 55vw;
    position: relative;
}

.modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255, 255, 255, 0.8);
    border: none;
    cursor: pointer;
}

.paddingRight1vw {
    padding-right: 1vw;
}

.choice-btn {
    position: absolute;
    width: 15%; /* à ajuster selon la taille de la zone souhaitée */
    height: 10%; /* à ajuster selon la taille de la zone souhaitée */
    display: none;
    cursor: pointer;
}

#yesChoice {
    top: 66%;
    right: 27%;
}

#noChoice {
    top: 66%;
    left: 27%;
}

.carousel-prev[disabled], .carousel-next[disabled] {
    opacity: 0.5;
    pointer-events: none;
    // empêche les clics
}