/* ===================================================================== */
/*                             Telescope.css                             */
/* � 2019  Dunin Technologie Inc.                                        */
/* ===================================================================== */

/* - D�FINITION -------------------------------------------------------- */
/* Affichage des fonctions t�l�scopiques.                                */
/* --------------------------------------------------------------------- */

/* - NOTES ------------------------------------------------------------- */
/* --------------------------------------------------------------------- */


/* --------------------------------------------------------------------- */
/* Wrapper global.                                                       */

.ActTelescope
  {
    flex-direction: column;           /* Titre en haut du contenu        */
    flex: 1;                          /* Prend toute la largeur dispo    */
    width:100%;                       /* Utilise 100% de l'espace        */
  }


/* --------------------------------------------------------------------- */
/* �l�ment s�lectionn�.                                                  */

div.Ligne:not(.Actif) > .ActTelescope > .ActTitre  { background-color: var(--couleurTitreTelescopeLigne); border: solid 1px var(--couleurBordureTitreTelescopeLigne); }
.Ligne.Actif > .ActTelescope > .ActTitre  { color: var(--couleurTexteTitreTelescopeLigneActif);  background-color: var(--couleurTitreTelescopeLigneActif); border: solid 1px var(--couleurBordureTitreTelescopeLigneActif); }


/* --------------------------------------------------------------------- */
/* Section Titre.                                                        */

.ActTelescope > .ActTitre
  {
    flex: 0;
    min-height: auto;                 /* Annule le min-height 0, qui efface le titre */
    align-items: center;              /* Texte au centre verticalement   */
  }


/* --------------------------------------------------------------------- */
/* La section titre prend toute la largeur disponible.                   */

.ActTelescope > .ActTitre > .Titre
  {
    flex: 1
  }


/* --------------------------------------------------------------------- */
/* Section Contenu.                                                      */

.ActTelescope > .Contenu
  {
    overflow: auto;                   /* Peut scroller si d�passe        */   
    flex: 1;
  }

.ActTelescope.Large > .ActTitre
  {
    padding:6px;
    font-size: 19px;
    color: var(--couleurTexteTitreTelescopeLarge);
  }

.ActTelescope.Large > .ActTitre > .Titre > .ActTexte > .Label
  {
    font-weight: 700;
  }

  
/* --------------------------------------------------------------------- */
/* Boutons 'toggle' (ex: t�l�scope).                                     */

.Toggle > button
  {
    height:30px;
    width:30px;
    background-size: cover;
    background-color: var(--couleurBoutonToggle);
    border: none;
  }

.Toggle.Ferme > button
  {
    transform: rotate(-90deg)
  }

.Toggle.Hide > button
  {
    display: none;
  }
  
.ActTelescope.Large > .ActTitre > .Toggle.Ferme > button
  {
    transform: rotate(-90deg)
  }
  
.ActTelescope.Large > .ActTitre > .Toggle.Hide > button
  {
    display: none;
  }

.Toggle > button                                             { background-image: url("../../Client/Imgs/TelescopeFlecheNoir.svg") }
.Ligne.Actif > .ActTelescope > .ActTitre > .Toggle > button  { background-image: url("../../Client/Imgs/TelescopeFlecheNoir.svg") }
.ActTelescope.Large > .ActTitre > .Toggle > button           { background-image: url("../../Client/Imgs/TelescopeFlecheNoir.svg") }

/* --------------------------------------------------------------------- */
/* Imbrication de t�lescopes (ex: mod�les de portes).                    */

.TelescopeNiveau2 > .ActTitre { padding-left: 12px }