.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.26), transparent 28%),
    linear-gradient(135deg, var(--theme-color) 0%, #4dc7ff 58%, #7af0ff 100%);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow:
    0 12px 28px rgba(var(--theme-color-rgb), 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.08) inset;
  background-size: 180% 180%;
  animation: import-button-gradient 4.8s ease infinite;
}

.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor::after {
  content: "";
  position: absolute;
  top: -32%;
  left: -18%;
  width: 42%;
  height: 170%;
  transform: rotate(22deg);
  background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0));
  animation: import-button-sheen 3.2s ease-in-out infinite;
  pointer-events: none;
}

.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.28);
  transform: translateY(-2px) scale(1.01);
  box-shadow:
    0 16px 34px rgba(var(--theme-color-rgb), 0.34),
    0 0 24px rgba(77, 199, 255, 0.2);
}

.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor.btn-active {
  box-shadow:
    0 18px 38px rgba(var(--theme-color-rgb), 0.36),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset,
    0 0 28px rgba(122, 240, 255, 0.28);
}

.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor .btn-icon {
  position: relative;
  z-index: 1;
  transform-origin: center;
  animation: import-button-icon 1.8s ease-in-out infinite;
}

.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor span,
.dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor svg {
  position: relative;
  z-index: 1;
}

body.dark-theme .dashboard-container .subscription-card .subscription-actions .btn-outline.btn-highlight-btnbgcolor {
  box-shadow:
    0 14px 30px rgba(0, 0, 0, 0.36),
    0 0 26px rgba(var(--theme-color-rgb), 0.22);
}

@keyframes import-button-gradient {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

@keyframes import-button-sheen {
  0% {
    left: -28%;
    opacity: 0;
  }

  18% {
    opacity: 1;
  }

  42% {
    left: 105%;
    opacity: 0;
  }

  100% {
    left: 105%;
    opacity: 0;
  }
}

@keyframes import-button-icon {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-1px) scale(1.08);
  }
}
