[dse-toggle-color-modes] {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: var(--dse-toggle-color-modes-size);
  height: var(--dse-toggle-color-modes-size);
  margin: auto;
  transition: var(--dse-toggle-color-modes-transition);
  font-size: var(--dse-toggle-color-modes-icon-size);
  color: var(--dse-toggle-color-modes-color);
  cursor: pointer;
}

[dse-toggle-color-modes] {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: var(--dse-toggle-color-modes-size);
  height: var(--dse-toggle-color-modes-size);
  margin: auto;
  transition: var(--dse-toggle-color-modes-transition);
  font-size: var(--dse-toggle-color-modes-icon-size);
  color: var(--dse-toggle-color-modes-color);
  cursor: pointer;
}


[dse-toggle-color-modes][dse-active] {
  transform: scale(1);
}

[dse-toggle-color-modes-dark],
[dse-toggle-color-modes-light] {
  font-size: inherit !important;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--dse-toggle-color-modes-transition);
  position: var(--dse-toggle-color-modes-icon-position);
}


[dse-toggle-color-modes-dark] svg,
[dse-toggle-color-modes-light] svg{
  width: inherit  !important;
  height: inherit  !important;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--dse-toggle-color-modes-transition);
  position: var(--dse-toggle-color-modes-icon-position);
}


[dse-toggle-color-modes-dark] {
  color: var(--dse-toggle-color-modes-dark-icon-color);
  fill: var(--dse-toggle-color-modes-dark-icon-color);
}

[dse-toggle-color-modes-light] {
  color: var(--dse-toggle-color-modes-light-icon-color);
  fill: var(--dse-toggle-color-modes-light-icon-color);
}

[dse-toggle-color-modes] [dse-toggle-color-modes-light] { 
  transform: scale(var(--dse-toggle-color-modes-scale-active));
}

[dse-toggle-color-modes] [dse-toggle-color-modes-dark] { 
  transform: scale(var(--dse-toggle-color-modes-scale-normal));
}

[dse-toggle-color-modes][dse-active] [dse-toggle-color-modes-light] { 
  transform: scale(var(--dse-toggle-color-modes-scale-normal));
}

[dse-toggle-color-modes][dse-active] [dse-toggle-color-modes-dark] {
  transform: scale(var(--dse-toggle-color-modes-scale-active));
}