.btn-icon img{
  display: inline-block;
  height: 22px;
  max-width: 22px;
}

.btn-icon{
  position: relative;
  overflow: hidden;
  min-height: 31px;
}
[dir="ltr"] .btn-icon{
  padding-left: 3rem;
}
[dir="rtl"] .btn-icon{
  padding-right: 3rem;
}
[dir="ltr"] .btn-icon.btn-sm{
  padding-left: 2.5rem;
}
[dir="rtl"] .btn-icon.btn-sm{
  padding-right: 2.5rem;
}

[class^="btn-"] svg{
  height: 24px;
  display: inline-block;
  vertical-align: middle;
}
.btn-sm svg{
  height: 21px;
}
.btn-lg svg{
  height: 30px;
}

.btn-icon svg{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  line-height: 1;
  text-align: center;
  max-width: 38px;
  padding: 7px;
  display: block;
  transition: 0.2s;
  background-color: rgba(0,0,0,0.05);
  opacity: 0.5;
  height: 36px;
}
.btn-icon.btn-sm svg{
  padding: 3px;
  height: 29px;
  color: #5C5F62;
}
.btn-icon.btn-lg svg{
  padding: 3px;
  height: 46px;
  color: #5C5F62;
}
[dir="rtl"] .btn-icon svg{
  left: inherit;
  right: 0;
}
.btn-icon:hover svg{
  opacity: 0.7;
}
.btn-icon:focus svg{
  opacity: 0.9;
}
.btn-icon span{
  display: inline-block;
}


.btn-link-danger {
  font-weight: 400;
  color: #dc3545;
}
.btn-link-danger:hover {
  color: #bb2d3b;
  text-decoration: underline;
}
.btn-link-danger:disabled, .btn-link-danger.disabled {
  color: #b02a37;
}

[class^="btn-"].rounded-none{
  border-radius: 0px;
}
[class^="btn-"].rounded-lg{
  border-radius: 0.75rem;
}
[class^="btn-"].rounded-xl{
  border-radius: 1rem;
}
[class^="btn-"].rounded-2xl{
  border-radius: 1rem;
}
[class^="btn-"].rounded-3xl{
  border-radius: 1.5rem;
}
[class^="btn-"].rounded-full{
  border-radius: 9999px;
}