/* =========================================================
   QUARZEO PRO V13.23
   Clics directs + icônes colorées sidebar et footbar
   ========================================================= */

/* Aucun élément décoratif ne doit bloquer les clics. */

#app.app:not(.hidden) .sidebar{
  pointer-events:auto !important;
}

#app.app:not(.hidden) #sideNav{
  position:relative !important;
  z-index:100 !important;

  pointer-events:auto !important;
}

#app.app:not(.hidden) #sideNav [data-page]{
  position:relative !important;
  z-index:101 !important;

  pointer-events:auto !important;
  cursor:pointer !important;

  user-select:none !important;
  touch-action:manipulation !important;
}

#app.app:not(.hidden) #sideNav [data-page] *{
  pointer-events:none !important;
}

/* Neutralisation des éventuels overlays de sidebar. */

#app.app:not(.hidden) .sidebar::before,
#app.app:not(.hidden) .sidebar::after,
#app.app:not(.hidden) #sideNav::before,
#app.app:not(.hidden) #sideNav::after{
  pointer-events:none !important;
}

/* Icône sidebar unique. */

#app.app:not(.hidden) #sideNav .navSvg{
  display:grid !important;
  place-items:center !important;

  width:31px !important;
  height:31px !important;
  min-width:31px !important;

  border:1px solid var(--qz-icon-border) !important;
  border-radius:9px !important;

  background:var(--qz-icon-bg) !important;
  color:var(--qz-icon-color) !important;
}

#app.app:not(.hidden) #sideNav .navSvg svg,
#qzProFootbarV1322 .qzFootIcon svg{
  display:block !important;

  width:16px !important;
  height:16px !important;

  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.9 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

.qzTone-cyan{
  --qz-icon-bg:rgba(39,205,224,.17);
  --qz-icon-border:rgba(74,223,236,.30);
  --qz-icon-color:#78e8ef;
}

.qzTone-blue{
  --qz-icon-bg:rgba(49,139,215,.21);
  --qz-icon-border:rgba(92,173,235,.31);
  --qz-icon-color:#86caf5;
}

.qzTone-orange{
  --qz-icon-bg:rgba(231,157,50,.21);
  --qz-icon-border:rgba(239,183,87,.31);
  --qz-icon-color:#f3c273;
}

.qzTone-purple{
  --qz-icon-bg:rgba(113,104,226,.22);
  --qz-icon-border:rgba(147,139,237,.32);
  --qz-icon-color:#b4adf7;
}

.qzTone-green{
  --qz-icon-bg:rgba(37,185,133,.20);
  --qz-icon-border:rgba(80,208,158,.30);
  --qz-icon-color:#80e0b7;
}

.qzTone-gold{
  --qz-icon-bg:rgba(217,169,49,.22);
  --qz-icon-border:rgba(234,194,93,.32);
  --qz-icon-color:#f3d078;
}

/* Footbar finale. */

#qzProFootbarV1322{
  gap:5px !important;

  padding:6px 7px !important;

  background:
    linear-gradient(
      90deg,
      #03192b,
      #073b59
    ) !important;
}

#qzProFootbarV1322 button{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;

  min-height:39px !important;

  padding:5px 9px !important;

  color:#c7dce5 !important;

  cursor:pointer !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

#qzProFootbarV1322 button > *{
  pointer-events:none !important;
}

#qzProFootbarV1322 .qzFootIcon{
  display:grid !important;
  place-items:center !important;

  width:28px !important;
  height:28px !important;
  min-width:28px !important;

  border:1px solid var(--qz-icon-border) !important;
  border-radius:9px !important;

  background:var(--qz-icon-bg) !important;
  color:var(--qz-icon-color) !important;
}

#qzProFootbarV1322 .qzFootLabel{
  color:inherit !important;

  font-size:8px !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}

#qzProFootbarV1322 button.active{
  border-color:rgba(43,208,229,.52) !important;

  background:
    linear-gradient(
      180deg,
      rgba(43,208,229,.22),
      rgba(43,208,229,.08)
    ) !important;

  color:#fff !important;

  box-shadow:
    inset 0 0 0 1px rgba(43,208,229,.08) !important;
}

@media(max-width:760px){
  #qzProFootbarV1322 .qzFootLabel{
    display:none !important;
  }
}
