/*/////////////////////////////////////////////
/////////////////////////     DEBUG  
/////////////////////////////////////////////*/
#steps {
}
#steps section {
}
#steps svg {
  height: 15px;
  width: auto;
}
#debug-panel-container {
  z-index: 99999999999 !important;
  position: fixed;
  top: 0% !important;
  left: 0% !important;
  display: flex;
  overflow-y: auto !important;
  font-size: 10px;
  flex-direction: column;
}
#debug-panel-container:not(.open) {
  height: auto !important;
  padding: 0 !important;
  background-color: transparent !important;
}
#debug-panel-container.open {
}
#debug-panel-btn {
  height: max-content;
  border-radius: 0px 0px 10px 0px !important;
}
#debug-panel-container.open #debug-panel-btn {
  border-radius: 50px 0px 0px 50px !important;
}
#debug-panel-btn svg {
  width: 15px;
  height: 15px;
}
#debug-panel-container:not(.open) #debug-panel-btn span {
  display: none;
}
#debug-panel-container.open #debug-panel-btn span {
}
#debug-panel {
  max-width: 500px;
}
#debug-panel.hidden {
}

.btn-debug {
  color: #fff;
  background-color: #ff3b30;
  border-color: #ff3b30;
}
:checked + .btn-debug,
.btn-debug.active,
.btn-debug:hover {
  color: #fff;
  background-color: #c1271a;
  border-color: #c1271a;
}
.btn-debug:focus {
  color: #fff !important;
  background-color: #c1271a !important;
  border-color: #c1271a !important;
  box-shadow: 0px 0px 5px 0px rgba(255, 59, 48, 0.5);
}
.btn-debug:disabled {
  color: #fff;
  background-color: #bdbdbd;
  border-color: #bdbdbd;
}
