/* btn tabs capsule device (main and sub tabs - start) */
.btn-row-capsule.main {
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #e2e2e5;
}

.btn-row-capsule .btn-row-inner {
  display: flex;
}

.btn-row-capsule .btn-capsule {
  display: flex;
  align-items: center;
  border: 1px solid #c0c0c0;
  height: 45px;
  margin-right: 12px;
  font-family: var(--font-medium);
  font-size: 14px;
  line-height: 20px;
  background-color: var(--white-color);
  width: max-content;
}

.btn-row-capsule .btn-capsule:focus {
  box-shadow: none;
}

.btn-row-capsule .btn-capsule-txt {
  color: var(--charcoal80-grey-color);
}

.btn-row-capsule .btn-capsule-txt span {
  display: inline-block;
  width: max-content;
}

.btn-row-capsule .btn-capsule-txt.active {
  background-color: var(--primary-color);
  color: var(--white-color);
  border-color: var(--primary-color);
}

.btn-row-capsule .btn-capsule-txt-ico span {
  display: inline-block;
  width: max-content;
  font-family: var(--font-medium);
  font-size: 20px;
  line-height: 28px;
  color: #1a1c1e;
}

.btn-row-capsule .btn-capsule-txt-ico i {
  display: inline-block;
  height: 26px;
  margin-right: 12px;
  position: relative;
  top: -2px;
}

.btn-row-capsule .btn-capsule-txt-ico img {
  max-height: 100%;
  width: auto;
}

.btn-row-capsule .btn-capsule-ico {
  align-items: normal !important;
}

.btn-row-capsule .btn-capsule-ico span {
  display: inline-block;
  height: 26px;
}

.btn-row-capsule .btn-capsule-ico .ico-true-visions {
  height: 16px;
  width: 100px;
}

.btn-row-capsule .btn-capsule-ico .ico-true-id {
  height: 16px;
  width: 70px;
}

.btn-row-capsule .btn-capsule-ico .ico-iqiyi {
  height: 16px;
  width: 65px;
}

.btn-row-capsule .btn-capsule-ico .ico-wetv {
  height: 16px;
  width: 65px;
}

.btn-row-capsule .btn-capsule-ico .ico-viu {
  margin-top: -3px;
  width: 80px;
}

.btn-row-capsule .btn-capsule-ico .ico-samsung {
  height: 16px;
  width: 80px;
}

.btn-row-capsule .btn-capsule-ico .ico-oppo {
  height: 16px;
  width: 70px;
}

.btn-row-capsule .btn-capsule-ico .ico-vivo {
  height: 16px;
  width: 70px;
}

.btn-row-capsule .btn-capsule-ico img {
  max-height: 100%;
  width: auto;
}

.btn.btn-capsule.dark.active {
  background: #000000;
  color: #fff;
  border: 1px solid #000000;
}

.btn.btn-capsule.dark.active span {
  color: #fff;
}

.btn.btn-capsule.dark.btn-capsule-txt-ico._iv.active i,
.btn.btn-capsule.dark.btn-capsule-ico_iv.active span {
  filter: brightness(0) invert(1);
}

.btn-row-capsule .btn-row-inner .btn-capsule {
  display: flex;
  align-items: center;
  border: 1px solid silver;
  height: 45px;
  margin-right: 12px;
  font-family: "better_togethermedium";
  font-size: 14px;
  line-height: 20px;
  background-color: #fff;
  width: -moz-max-content;
  width: max-content;
  transition: 0s;
  white-space: nowrap;
}

.btn-row-capsule .btn-row-inner .btn-capsule.active {
  background-color: #e00000;
  color: #fff;
  border-color: #e00000;
  border-radius: 45px;
}

.btn-row-capsule .btn-row-inner .btn-capsule.dark.active {
  background: #000000;
  color: #fff;
  border: 1px solid #000000;
}

.btn-row-capsule .btn-row-inner .btn-capsule.dark._iv.active span {
  filter: brightness(0) invert(1);
  color: #fff;
  transition: 0s;
}

.btn-row-capsule .btn-row-inner .btn-capsule.btn-capsule-txt-ico span {
  transition: 0s;
}

.btn-row-capsule .btn-row-inner .btn-capsule.btn-capsule-txt-ico i {
  display: inline-block;
  height: 26px;
  margin-right: 12px;
  position: relative;
  top: -2px;
}

.btn-row-capsule .btn-row-inner .btn-capsule.btn-capsule-txt-ico img {
  max-height: 100%;
  width: auto;
}

.btn-row-capsule .btn-row-inner .btn-capsule span {
  display: inline-block;
  width: max-content;
  font-family: var(--font-medium);
  font-size: 20px;
  line-height: 28px;
  color: #1a1c1e;
}

.btn-row-capsule.main > .btn-row-inner .btn-capsule:hover span {
  color: #1a1c1e;
}

.btn-row-capsule.main > .btn-row-inner .btn-capsule.active:hover span {
  color: #ffffff;
}

.btn-row-capsule.main .btn-row-inner .btn-capsule.dark:hover {
  background: #ffffff;
  color: #000000;
  border: 1px solid silver;
}

.btn-row-capsule.main .btn-row-inner .btn-capsule.dark.active:hover {
  background: #000000;
  color: #ffffff;
  border: 1px solid #000000;
}

.btn-row-capsule.main > .btn-row-inner {
  justify-content: center;
}

.btn-row-capsule .btn-row-inner.nav-tabs-container-2 {
  display: flex;
  justify-content: center !important;
}

@media (max-width: 991px) {
  .btn-row-capsule {
    position: relative;
    width: auto;
    margin-bottom: 25px;
    height: auto;
    overflow: hidden;
  }

  .btn-row-capsule .btn-row-inner {
    overflow-x: auto;
  }

  .btn-row-capsule.main > .btn-row-inner::-webkit-scrollbar,
  .btn-row-capsule .btn-row-inner.nav-tabs-container-2::-webkit-scrollbar {
    display: none;
  }

  .btn-row-capsule.main > .btn-row-inner {
    justify-content: start;
  }

  .btn-row-capsule .btn-row-inner.nav-tabs-container-2 {
    justify-content: start !important;
  }

  .btn-row-capsule .btn-row-inner.nav-tabs-container-2 .btn-capsule {
    height: 38px;
  }

  .btn-row-capsule .btn-row-inner.nav-tabs-container-2 .btn-capsule span {
    font-size: 14px;
  }
}

/* btn tabs capsule device (main and sub tabs - end) */
