/**********
* STYLESHEET WEB SCREEN
**********/

/* Ne pas afficher les alertes */
#lizmap-edition-message {
  display: none;
}

/**********
FENETRE DE DEMARRAGE
**********/

/* Le conteneur general */
#modal-cartet1 {
  background-color: #011C40;
  font-family: Montserrat!important;
}

/* le 'Bienvenue'  */
#modal-cartet1 .modal-header h2{
    border-bottom: none;
    font-weight: bold!important;
    color: white;
}

/* Le corps de texte */
#modal-cartet1 .modal-body{
    color: white;
    font-size: 0.9em;
}

/* Le pied de page */
#modal-cartet1 .modal-footer{
    background-color: #011C40;
    border-top: none;
    text-align: center;
}

/* le bouton J'ai compris */
#modal-cartet1 .modal-footer button{
    font-family : Montserrat, Verdana;
    background-color: #011C40;
    border-radius: 8px;
    border: white solid 1px;
    color: white;
    font-weight: bold;
}
/* Le logo dans la fenetre de depart */
.modal-header #logo{
  background: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/icon/logo_plaineco.png);
  background-size: 100px;
}

/* Le lien */
#link {
  color: white;
}

/**********
ENTETE DE LA PAGE
**********/
#header{
    background: #011C40;
    max-height: 70px;
    box-sizing: content-box;
    min-height: 70px;
}

/* pas de logo */
#logo{
    background: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/icon/logo_plaineco.png);
    background-size: 100% 100%;
    min-width: 100px;
    min-height: 70px;
    margin-left: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}

/* la boite de titre */
#title{
    margin-left: 30px;
    margin-top: 10px;
    box-sizing: content-box;
    min-height: 70px;
    /* top : 55%!important; */
}

/* le titre principal */
#title h1 {
  color : white!important;
  font-weight: 1000!important;
  line-height: 2em;
}

/* le titre secondaire */
#title h2 {
  color : white!important;
  display: block!important;
  font-size: 1.2em!important;
  margin-top: 0em;
  margin-left: 5px;
}

/* le dock */
#dock{
    max-width: 30vw;
    background: #011C40!important;
    overflow: hidden;
}

/* La barre laterale avec les outils */
#mapmenu {
  background: #011C40!important;
}

/* Les boutons de navigation a droite */
#navbar button.btn, #navbar div.slider {
  background-color: #011C40!important;
}

/* Les titres des volets du dock */
#dock-tabs {
  font-family: Montserrat, Verdana;
  font-size: 15px;
}

/* la bordure en pointille en dessous du titre du panneau */
ul.nav.nav-tabs{
  border-bottom: none!important;
}


/* le panneau qui contient les elements de legende */
#switcher-layers-container .menu-content {
  background-color: white!important;
  border-radius: 10px!important;
}


/*******
* POPUP
*******/

/* la popup en elle-meme */
#liz_layer_popup_contentDiv {
  background-color: #011C40;
  display: inline-block;
}

/* Le contribution dans chaque popup */
.lizmapPopupSingleFeature h4{
  display: none;
}

/* Le titre des contributions */
.lizmapPopupDiv h3 {
  font-family: Montserrat, Verdana;
  color: white;
  font-size: 1.1em;
  font-weight: 200;
  margin-top: 5px;
  margin-left: 5px;
  line-height: 20px;
}

/* la contribution dans  la popup */
.lizmapPopupDiv p {
  font-family: Montserrat, Verdana;
  color: white;
  font-size: 0.9em;
  margin-top:5px;
  margin-left: 5px;
}

/* Les popup quand on clique sur les equipements */
#map-content .lizmapPopupDiv, .lizmapPopupSingleFeature{
  background-color: #011C40!important;
  box-sizing: border-box;
  display: inline-table;
  margin: 2px!important;
  overflow: auto;
  color : white;
}

/* le contenant exterieur de la contribution */
.lizmapPopup.olPopup, #map-content .lizmapPopup {
  border-radius: 8px;
  border: 2px solid white!important;
}

#map-content .lizmapPopup .olPopupCloseBox {
  background-color: #011C40!important;
}

.ol-popup{
  background-color: #011C40;
}

/**********
* LE PANNEAU D'INFORMATION
***********/

#metadata{
  background-color: #011C40!important;
}
#metadata .dl-vertical {
  color: white;
}

/* Changer l'image affichee */
#metadata img {
  background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/docs/night.png);
}

/**********
* LES BOUTONS POUR AFFICHER DESAFFICHER LES CONTRIBUTIONS
**********/

/* Le bouton avec les categories de contributions */
#filtre_categorie{
    position: absolute;
    top: 0.7%;
    right : 4%;
    z-index: 1000;
}

#filtre_categorie > div{
    display: inline-block;
    cursor: pointer;
}

#filtre_categorie > div > div{
    display: inline-block;
    vertical-align: middle;
}

/* Le texte des boutons */
#filtre_categorie .cat-text{
    padding: 5px;
    color: #fff;
    font-weight: bold;
    font-size: 12px;
    margin: 5px;
    /* border: 1px #fff solid; */
    text-transform: uppercase;
}

/* les icones eye */
#filtre_categorie .eye-icon{
    width: 30px;
    height: 30px;
}

/* La couleur de fond des noms des boutons */
#filtre_categorie > div[data-cat='1'] .cat-text{
    background-color: #1c7d69;
    font-family: Montserrat, Verdana;
}
#filtre_categorie > div[data-cat='2'] .cat-text{
    background-color: #ef4651;
    font-family: Montserrat, Verdana;
}
#filtre_categorie > div[data-cat='3'] .cat-text{
    background-color: #4abeb5;
    font-family: Montserrat, Verdana;
}
#filtre_categorie > div[data-cat='4'] .cat-text{
    background-color: #ffd700;
    font-family: Montserrat, Verdana;
}
#filtre_categorie > div[data-cat='5'] .cat-text{
    background-color: #6b5493;
    font-family: Montserrat, Verdana;
}

/* Le rendu quand les contributions sont affichees */
#filtre_categorie > div[data-cat='1'] .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/eye_green.svg);
}
#filtre_categorie > div[data-cat='2'] .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/eye_red.svg);
}
#filtre_categorie > div[data-cat='3'] .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/eye_turquoise.svg);
}
#filtre_categorie > div[data-cat='4'] .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/eye_yellow.svg);
}
#filtre_categorie > div[data-cat='5'] .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/eye_purple.svg);
}


/* Le rendu quand les contributions ne sont pas affichees */
#filtre_categorie > div[data-cat='1'].unchecked .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/blind_green.svg);
}
#filtre_categorie > div[data-cat='2'].unchecked .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/blind_red.svg);
}
#filtre_categorie > div[data-cat='3'].unchecked .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/blind_turquoise.svg);
}
#filtre_categorie > div[data-cat='4'].unchecked .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/blind_yellow.svg);
}
#filtre_categorie > div[data-cat='5'].unchecked .eye-icon{
    background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/svg/blind_purple.svg);
}


/**********
FORMULAIRE D'EDITION
**********/

#edition-draw{
  display: flex;
  justify-content: center;
  align-items: center;
}

.jforms-label{
  font-weight: bold;
}

/* les etiquettes du slider ressenti */
datalist {
  display: flex;
  justify-content: space-between;
  color: #011C40;
  width: 205px;
}


#edition div.menu-content {
  background: white;
  border-radius: 10px;
  margin-top: 10px;
}
#dock-close {
  display:inline;
  background-image: url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/icon/arrow.png);
  background-size: 25px 25px;
  background-color: #011C40;
  border : 0px!important;
  right : 15px;
  top : 8px;
  position: static;
}

/* Le message avant de pouvoir contribuer */
#edition-modification-msg {
  display: block!important;
}

/* Supprimer le menu de selection de couche */
#edition-layer {
  display: none;
}

/* Le mode d'emploi du formulaire */
#exContrib {
  font-family: Verdana;
}

.form-actions {
  background-color: white;
}

input, button, select, textarea {
  font-family: Verdana;
}

/* Les 3 boutons du formulaire  */
#jforms_view_edition_reinit,
#jforms_view_edition__submit_cancel,
#jforms_view_edition__submit_submit {
  text-transform: none;
}

#edition-form-container h4, h4 {
  font-weight: bold;
  font-family: Montserrat, Verdana;
  font-size: 3em;
  color: #011C40;
  line-height: 40px;
}

/* Les boites de saisie des mail/inscription au projet */
#jforms_view_edition_email, #jforms_view_edition_email_label,
#jforms_view_edition_inscription, #jforms_view_edition_inscription_label  {
  display: block!important;
}

#edition div.tab-content {
  box-sizing: content-box;
  overflow: hidden;
  border: 0px;
  border-radius: 20px;
  background-color: white;
  border-radius: 20px;
}

.form-actions button, .form-actions input{
    background-color: #011C40;
    background-image: none;
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    text-shadow: none;
}

/* Le bouton d'édition */
#start_edition{
  position: absolute;
  bottom: 5%;
  left: calc(50% - 48px);
  z-index: 1000;
  font-size: 1.2em;
  padding: 10px 16px;
  cursor: pointer;

  font-family : Montserrat, Verdana;
  background-color: #F2B441;
  border-radius: 8px;
  color: white;
  font-weight: bold;
}

#edition-point-coord-form,
#nav-tab-edition,
.edition h3,
#edition-form-container h3,
#jforms_view_edition_photo1_jf_action_keep_item,
#jforms_view_edition_photo2_jf_action_keep_item,
#jforms_view_edition_photo3_jf_action_keep_item,
#jforms_view_edition_photo1_jf_action_new,
#jforms_view_edition_photo2_jf_action_new,
#jforms_view_edition_photo3_jf_action_new{
    display: none!important;
}

/* Le titre de l'input email */
#label, #jforms_view_edition_email_label{
  font-weight: bold;
}

/* Le texte avant les questions facultatives */
#facultatif{
  font-family: Montserrat, Verdana;
  font-size: 13px;
}

#jforms_view_edition_photo1_label,
#jforms_view_edition_photo2_label,
#jforms_view_edition_photo3_label{
    display: inline-block;
    float: left;
}

.jforms-image-select-btn{
  color: transparent!important;
  width: 50px;
  height: 50px;
  background-image:url(/map/index.php/view/media/getMedia?repository=sdalpc&project=sdalpc&path=media%2Fthemes%2Fsdalpc%2Fcss%2F/icon/picture.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-color: transparent!important;
  border-width: 0px;
}

#jforms_view_edition label{
  font-weight: bold!important;
}

#jforms_view_edition_photo1,
#jforms_view_edition_photo2,
#jforms_view_edition_photo3,
#jforms_view_edition_liz_future_action_label,
#jforms_view_edition_liz_future_action {
  display: none!important;
}

#jforms_view_edition_m_photo1_choice_update_item span.jforms-item-controls,
#jforms_view_edition_m_photo2_choice_update_item span.jforms-item-controls,
#jforms_view_edition_m_photo3_choice_update_item span.jforms-item-controls{
    margin-left: 1.4em;
}

/* Les boutons pour valider/annuler/vider le formulaire */
.jforms-submit-buttons form-actions,
#jforms_view_edition_reinit,
#jforms_view_edition__submit_cancel,
#jforms_view_edition__submit_submit {
  display: inline-block;
  font-family: Montserrat, Verdana;
  padding: 1px 6px;
  border: 2px solid #011C40;
  border-bottom-color: #011C40;
  box-shadow: none;
  border-radius: 4px;
}

/* La boite qui contient les images des photos */
.jforms-choice .jforms-item-controls{
  margin: 0px!important;
}

/**********
GESTION DES SCROLLBAR
***********/

/* width */
::-webkit-scrollbar {
  width: 7px;
  border-radius: 8px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #011C40;
}


:-webkit-scrollbar-thumb {
  background: white;
}


::-webkit-scrollbar-thumb:hover {
  background: #888;
  border-radius: 8px;
  width: 10px;
}
