html, body {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
}

.root {
  display: flex;
  flex-direction: column;
  height: 100%;
}

* {
  scrollbar-width: thin;
  scrollbar-color: #a0a0a0 #f1f1f1;
}

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
::-webkit-scrollbar-thumb {
  background: #a0a0a0; 
}

::-webkit-scrollbar-thumb:hover {
  background: #747474; 
}

input[type="color"] {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  border: 1px solid #686868;
  padding: 0;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
  border-radius: 50%;
}

input[type="color"]::-webkit-color-swatch {
  border: none;
  border-radius: 50%;
}

input[type="color"]::-moz-color-swatch {
  border: none;
  border-radius: 50%;
}