/* ===================================================================== */
/*                          SectionCollGest.css                          */
/* � 2024  Dunin Technologie Inc.                                       */
/* ===================================================================== */

/* - DÉFINITION -------------------------------------------------------- */
/* Affichage des sections.                                               */
/* --------------------------------------------------------------------- */

/* - NOTES ------------------------------------------------------------- */
/* --------------------------------------------------------------------- */

.FilAriane {margin-bottom: 10px;}

.OngletSpec > .Contenu {overflow: auto; flex-direction: column;}
.OngletSpec > .Boutons {flex-wrap: wrap;} 

.SecFile .ActFile { width: 41%; height: 220px; align-self: center; }
.FileDrop {margin-bottom: 20px;}

.SecShowImg .ImgTools.Cadre {width: 38%; margin-bottom: 20px;}
.SecShowImg .ImgTools .ActBouton {align-items: flex-end;} /* 2023:08-02 should be moved to the vue using css class: ?*/
.ImgFile > img {width: 64px; height: 64px;}
.ImgTools {flex-wrap: wrap;} 


/* --------------------------------------------------------------------- */
/* liste des références.                                                 */

.ListeRef .ActTexte span  { padding: 4%; }
.ListeRef .ActTexte:hover, .ListeRefSource .ActTexte:not(.indent-0):hover, .ListeItem .Ligne:not(.Actif) > .ActTexte:hover
{ 
  background-color: var(--couleurBoutonSecondaireHover);
  color: var(--couleurTexteBoutonSecondaireHover);
  cursor: pointer;
}
.ListeRef .ActImage img {width: 24px; height: 24px;}
.ListeItem .Ligne {gap: 1em;}
.ListeItem .Ligne .ActTexte {padding: 6px;}
.ListeItem .Ligne img {width: 24px; height: 24px;}
.ListeRefParcour .ActTexte {width: 20%; padding: 6px; cursor: pointer;}

/* --------------------------------------------------------------------- */
/* Propriété et valeur.                                                  */
div.Prop
{
  border: 2px solid #1e5cb2;
  border-radius: 8px;
  padding: 10px;
  margin: 10px 0;
  background-color: #e6e9f5;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
span.Prop
{
  font-weight: bold;
  color: #153491;
  font-size: 1.2em;
}

.Val
{
  align-items: center;
  margin: 5px;
  background-color: #cfe0f3;
  border: 1px solid #153491;
  border-radius: 5px;
  overflow: hidden;
}
.Val:hover {background-color: #b0c4e7;}

div.Valeur
{
  align-items: center;
  padding: 5px 10px;
  flex-grow: 1;
}
span.Valeur {color: #153491;}


/* ---------------------------------------------------------------------  */
/* Interface Utilisation.                                                 */

.ImageAcc.ActImage { height: -webkit-fill-available;}
.ImageAcc > img    { width: -webkit-fill-available; }

.UtilImageCItems .Colonne.ActSection {margin-left: 40px; margin-top: 30px; }
.UtilImageCItems .ListePhotos {height: 200px; width: 150px;}
.UtilImageCItems .ListePhotos > img {cursor: pointer; width: 100%;}
.UtilImageCItems .TitreLigne  {margin-top: 14px; width: 150px;}

.UtilImageCItems {margin-right: 40px !important; gap: 1rem;}


.PhotoTech {margin-left: 40px; margin-bottom: 40px; margin-right: 60px;}
.PhotoTech > img {width: 500px;}

.DescriptionTech {gap: 1em; padding-right: 10px;}
.DescriptionTech .TitreDesc {font-size: 19px;}
.DescriptionTech span.Puce {display: list-item; list-style-type: disc; margin-left: 25px;} /* pour forcer les éléments span à s'afficher comme des éléments de liste */

.LigneVal    {padding-left: 30px;}