/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

body{
   background-color :#291155 !important ; 
}

.well, .question-container {
    border-radius: 15px !important; /* Ajustez le nombre de pixels selon l'arrondi souhaité */
    /*overflow: hidden; /* Pour s'assurer que le contenu ne dépasse pas de l'angle arrondi */
}

/* Ajouter le logo au-dessus du nom du questionnaire */
.survey-name::before {
    content: "";
    display: block;
    
    /* Dimensions : Ajustez selon la taille de votre logo */
    width: 100%;
    height: 120px; /* Ajustez la hauteur nécessaire pour votre logo */
    
    /* Lien de l'image */
    background-image: url('https://hautsdefrance-addictions.org/medias/logo.jpg');
    
    background-color : #ffffff;
    border-radius : 15px ;
    
    /* Réglages de l'image */
    background-size: contain;      /* L'image s'adapte sans être coupée */
    background-repeat: no-repeat;
    background-position: center;   /* Centre le logo */
    
    /* Espacement avec le texte en dessous */
    margin-bottom: 20px;
    margin-top: 5px;
    }


  .container-md {
    background-color : #ffffff;
    border-radius : 15px ;
    padding : 5px 100px 5px 100px;
    margin-top: 20px;
  }
  
  .group-title.space-col {
   border-bottom: 1px solid rgba(41, 17, 95, 0.3); /*  une fine ligne de séparation */
}

 .survey-name {
    font-weight: bold;
} 

 .ls-label-question, .groupe-title{
    font-weight: bold;
    font-size: 18px !important;
} 
 
  .group-title{
    font-weight: bold;
} 

/* 1. Modifier la couleur des champs de saisie (questions ouvertes) */
.form-control, 
input[type="text"], 
textarea {
    border: 1px solid rgb(41, 17, 95) !important;
    border-radius: 10px !important;
    }

/* Changement de couleur lors du clic (focus) dans le champ */
.form-control:focus {
    border-color: rgb(41, 17, 95)) !important;
    box-shadow: 0 0 0 0.2rem rgba(52, 94, 152, 0.25) !important;
}

/* 2. Modifier les lignes des tableaux (questions de type tableau) */
.table, 
.table th, 
.table td, 
.table-bordered th, 
.table-bordered td {
    border: 1px solid rgb(41, 17, 95) !important;
}
/* Réduire l'interligne global du questionnaire */
body, .answer-container, .question-text, .group-description, .answers-list {
    line-height: 1.2 !important;
}

/* Resserrer spécifiquement les textes dans les tableaux */
.table td, .table th {
    line-height: 1.2 !important;
    padding-top: 8px !important;    /* Réduit aussi l'espace interne des cellules */
    padding-bottom: 8px !important;
}

/* Réduire l'espace entre le libellé de la question et les réponses */
.question-text {
    margin-bottom: -10px !important;
}

/* Réduire l'espace entre chaque bloc de question */
.question-container {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}

 .ls-questionhelp {
     color : rgb(41, 17, 95) ;
 }
 a{
     color : rgb(41, 17, 95) !important ;
 }

/* On change la couleur du bouton ou/Non */ 
 
 .ls-answers.btn-group-justified .btn-primary{
   background-color :#291155 !important ;
   border: 1px solid #ffffff !important;
    }
    
/* On retire le fait que les boutons reste à gauche et on force la pleine largeur */
.ls-answers.btn-group-justified {
    display: flex !important;
    justify-content: center; /* Centre horizontalement */
    flex-wrap: wrap;         /* Permet de passer à la ligne sur mobile */
    float: none !important;
    width: 100% !important;
}

/* Style du bouton quand il est SÉLECTIONNÉ */
.ls-button-radio:checked + .ls-button-label {
    background-color: #ffffff !important; /* Devient bleu */
    color: #291155  !important;                     /* Texte devient blanc */
    border: 1px solid #291155 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important; /* Effet de profondeur */
    transform: scale(1.05);                        /* Grossit légèrement */
}

/* Petit effet au survol (hover) pour l'interactivité */
.ls-answers.btn-group-justified .btn-primary:hover {
    background-color: rgba(41, 17, 95, 0.5) !important;
    cursor: pointer;
}

/* changement de couleur des numéro de question */
span.question-number.text-muted {
    color: #291155 !important;
    opacity: 1 !important;    /* Très important car text-muted réduit l'opacité */
    -webkit-text-fill-color: #291155 !important; /* Force la couleur sur certains navigateurs */
}

/* Ajouter la parenthèse après le numéro */
.question-number::after {
    content: ")";             /* Remplacez par " )" si vous préférez */
    display: inline-block;
    margin-right: 2px;
}

.fruity .progress-bar{
    background-color: #AA006E;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    color: #fff;
}

/* Couleur texte classique */
p, .btn-link, .fruity .text-info{
    color: #000000 !important ;
}

/* Couleur bouton suiviant au survol */
.fruity .btn-primary:hover
 {
     background-color: rgba(170, 0, 110, 0.5) !important;
    color: #fff;
}

/* Couleur bouton suiviant */
.fruity .btn-primary
 {
     background-color: #AA006E !important;
     border-color : #AA006E;
    color: #fff;
}
/* autre bouton */ 
.btn-outline-secondary{
    background-color: #fffff !important;
    color: #AA006E !important;
    border-color: #AA006E !important; ;
}