/** Shopify CDN: Minification failed

Line 119:0 Expected "}" to go with "{"

**/
.glass-with-animated-border {
  position: absolute;
  border-radius: 30px;
  color: white;
  z-index: 0;
  inset-block-start: calc(100% + 10px) !important;
  inset-inline-end: 0;
  min-width: var(--account-popover-min-width);
  width: max-content;
  overflow: hidden; /* keep border clean at edges */
  isolation: isolate; /* create a clean stacking context */
  inset-inline-end: 0;
  width: max-content;
}

/* Frosted glass background */
.glass-with-animated-border::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25),
              0 0 10px rgba(255, 255, 255, 0.3);
  z-index: -2;
}

.glass-with-animated-border .account-actions__link.button-secondary:hover {
  text-shadow: 0 0 6px rgba(255, 255, 255, 0.9),
               0 0 12px rgba(255, 255, 255, 0.8);

  border-color: rgba(255, 255, 255, 0.9); /* glowing white border */
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.7),
              0 0 12px rgba(255, 255, 255, 0.6); /* layered white glow */
}

.glass-with-animated-border .account-actions__link.button-secondary {
  background-color: #6a0dad;   /* default background */
  color: white;                /* keep text readable */
  border-radius:8px;          /* optional: smooth corners */
  transition: all 0.3s ease;   /* smooth hover */
}

.glass-with-animated-border .account-actions__link.button-secondary:hover {
  background-color: #7f3fff;   /* hover background */
  box-shadow: 0 0 16px #BC04FA; /* glowing purple shadow */
}




.glass-with-animated-border::after {
  --border-size: 1.5px;

  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: var(--border-size);
  background: conic-gradient(
    from var(--deg) at center,
    #00c3ff,
    #4d0199,
    #6300c6,
    #00c3ff
  );
  animation: autoRotate 3s linear infinite;

  /* Mask out the inside */
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;

  box-sizing: border-box;
  z-index: -1;

  /* Animate rotation */
@property --deg {
  syntax: '<angle>';
  inherits: true;
  initial-value: 0deg;
}
@keyframes autoRotate {
  to { --deg: 360deg; }
}

/* Content always on top */
.glass-with-animated-border > * {
  position: relative;
  z-index: 1;
}


.appstle_subscription_wrapper_option.appstle_selected_background.appstle-active-option {
  background: rgba(180, 6, 255, 0.05); /* frosted glass effect */
  border: 2px solid #00c3ff; /* bright border to highlight selection */
  border-radius: 12px;
  padding: 1rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

/* Optional: hover effect for the selected option */
.appstle_subscription_wrapper_option.appstle_selected_background.appstle-active-option:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 25px rgba(0, 0, 0, 0.15);
}


