#wp-admin-bar-dracula {
  @import "toggles/style-14";

  .ab-item {
    padding: 0 5px !important;
    margin: 0 0 0 0 !important;
    height: 32px;
    line-height: 32px;
    display: flex !important;
    align-items: center;
    justify-content: center;
  }


}

/*--- Block Editor Toggle ---*/
.dracula-block-editor-toggle {
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto auto auto 15px;
  cursor: pointer;
  background-color: #484d60;
  mask: url("../images/toggles/light.svg") no-repeat center / contain;

  &:hover {
    background-color: #484d60 !important;
  }

  & + div {
    margin-left: 10px;
  }
}

/*--- Classic Editor Toggle ---*/
.mce-dracula-toggle {
  .mce-i-dracula_toggle {
    background-color: #484d60;
    mask: url("../images/toggles/light.svg") no-repeat center / contain;

    &.mode-dark {
      background-color: rgb(176, 169, 159);
      mask: url("../images/toggles/dark.svg") no-repeat center / contain;
    }
  }
}

html[data-dracula-scheme="dark"] {
  .dracula-block-editor-toggle {
    mask: url("../images/toggles/dark.svg") no-repeat center / contain;
    background-color: #fff !important;
  }

  .mce-dracula-toggle {
    .mce-i-dracula_toggle {
      background-color: rgb(176, 169, 159);
    }
  }
}

.dracula-dark-mode-switches {
  @import "settings/toggles";

  .toggles {
    .toggle-wrap {
      padding: 5px !important;
    }
  }
}