.humdesign-toolbar-control {
  -webkit-tap-highlight-color: transparent;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .12s ease;
}

.humdesign-toolbar-control svg {
  color: #a7adac !important;
  opacity: .82;
  transition: color .16s ease, opacity .16s ease;
}

.humdesign-toolbar-control:hover {
  background: rgba(23, 52, 56, .055) !important;
}

.humdesign-toolbar-control:hover svg {
  color: #536467 !important;
  opacity: 1;
}

.humdesign-toolbar-toggle:not([setting-value="false"]) {
  border-color: rgba(176, 137, 71, .38) !important;
  background: rgba(176, 137, 71, .14) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .56) !important;
}

.humdesign-toolbar-toggle:not([setting-value="false"]) svg {
  color: #173438 !important;
  opacity: 1;
}

.humdesign-toolbar-control:focus,
.humdesign-toolbar-control:focus-visible {
  outline: none !important;
}

.humdesign-toolbar-control:focus-visible {
  border-color: rgba(176, 137, 71, .58) !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(176, 137, 71, .5) !important;
}

.humdesign-toolbar-control svg:focus {
  outline: none !important;
}

.humdesign-toolbar-control:has(svg:focus-visible) {
  border-color: rgba(176, 137, 71, .58) !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(176, 137, 71, .5) !important;
}

.humdesign-toolbar-control:active {
  transform: scale(.96);
}

@media (prefers-reduced-motion: reduce) {
  .humdesign-toolbar-control,
  .humdesign-toolbar-control svg {
    transition: none !important;
  }
}