/* Fallback for header background and border on scroll */
.bg-background\/80 {
  background-color: #241b0acc !important; /* 80% opacity of #241b0a */
  backdrop-filter: blur(8px) !important;
}
.border-primary\/35 {
  border-bottom: 1.5px solid #ff6a0059 !important; /* 35% opacity of #ff6a00 */
}
.bg-transparent {
  background-color: transparent !important;
}
.border-transparent {
  border-bottom: 1.5px solid transparent !important;
}
/* Fallback for header background on scroll */
.bg-background\/80 {
  background-color: #241b0acc !important; /* 80% opacity of #241b0a */
  backdrop-filter: blur(8px);
}

@import 'tailwindcss';

@custom-variant dark (&:is(.dark *));

:root {
  color-scheme: dark;
  --background: oklch(0.085 0.004 40);
  --foreground: oklch(0.95 0 0);
  --card: oklch(0.1 0.005 60);
  --card-foreground: oklch(0.95 0 0);
  --popover: oklch(0.1 0.005 60);
  --popover-foreground: oklch(0.95 0 0);
  --primary: oklch(0.7 0.18 50);
  --primary-foreground: oklch(0.1 0 0);
  --secondary: oklch(0.15 0.01 50);
  --secondary-foreground: oklch(0.95 0 0);
  --muted: oklch(0.15 0.005 50);
  --muted-foreground: oklch(0.55 0 0);
  --accent: oklch(0.7 0.18 50);
  --accent-foreground: oklch(0.1 0 0);
  --destructive: oklch(0.5 0.2 25);
  --destructive-foreground: oklch(0.95 0 0);
  --border: oklch(0.2 0.01 50);
  --input: oklch(0.2 0.01 50);
  --ring: oklch(0.7 0.18 50);
  --chart-1: oklch(0.7 0.18 50);
  --chart-2: oklch(0.6 0.15 50);
  --chart-3: oklch(0.5 0.12 50);
  --chart-4: oklch(0.8 0.15 50);
  --chart-5: oklch(0.65 0.16 50);
  --radius: 0.5rem;
  --sidebar: oklch(0.1 0.005 60);
  --sidebar-foreground: oklch(0.95 0 0);
  --sidebar-primary: oklch(0.7 0.18 50);
  --sidebar-primary-foreground: oklch(0.1 0 0);
  --sidebar-accent: oklch(0.15 0.01 50);
  --sidebar-accent-foreground: oklch(0.95 0 0);
  --sidebar-border: oklch(0.2 0.01 50);
  --sidebar-ring: oklch(0.7 0.18 50);
}
@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
    background-color: #241b0a;
    background-image:
      url("data:image/svg+xml,%3Csvg width='200' height='200' viewBox='0 0 200 200' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 200V0H200' stroke='white' stroke-opacity='0.08'/%3E%3C/svg%3E");
    background-size: 200px 200px;
    background-attachment: fixed;
    background-repeat: repeat;
    position: relative;
  }

  .hero-section {
    background: none !important;
    position: relative;
  }

  .hero-section::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 8vw;
    pointer-events: none;
    z-index: 2;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, #281c10 100%);
  }


  body::before {
    content: '';
    position: fixed;
    top: -8rem;
    left: 50%;
    width: 90vw;
    max-width: 90rem;
    height: 28rem;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 0;
    background: radial-gradient(ellipse 60% 60% at 50% 0%, rgba(255,106,0,0.22) 0%, rgba(255,106,0,0.09) 60%, transparent 100%);
    filter: blur(32px);
    opacity: 1;
  }
}

/* Selected variant border style */

.variant-button {
  border-width: 2.5px !important;
  border-color: transparent;
}
.variant-selected {
  border-color: #ff6a00 !important;
  box-shadow: 0 0 0 2px #ff6a00cc;
}

@theme inline {
  --font-sans: 'Geist', 'Geist Fallback';
  --font-mono: 'Geist Mono', 'Geist Mono Fallback';
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-destructive-foreground: var(--destructive-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);
}


@layer base {

  /* Selected variant border style */
  .variant-selected {
    border-width: 2.5px !important;
    border-color: oklch(0.7 0.18 50 / 0.95) !important;
    box-shadow: 0 0 0 2px oklch(0.7 0.18 50 / 0.25);
  }
}

@keyframes gradient-shift {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

@keyframes shiny-text-shift {
  0% {
    background-position: 180% 0;
  }
  100% {
    background-position: -180% 0;
  }
}

.shiny-text {
  animation: shiny-text-shift 2.8s linear infinite;
  will-change: background-position;
}

.spin-loop {
  animation: spin 18s linear infinite;
}

.spin-very-slow {
  animation: spin 8s linear infinite;
}

.spin-very-slow-reverse {
  animation: spin-reverse 8s linear infinite;
}

@keyframes spin-reverse {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
  }
}

@keyframes aurora-drift {
  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.55;
  }
  50% {
    transform: translate3d(3rem, -1.5rem, 0) scale(1.12);
    opacity: 0.85;
  }
}

.aurora-drift {
  animation: aurora-drift 18s ease-in-out infinite;
}

@keyframes reviews-scroll {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(0, -50%, 0);
  }
}

.reviews-scroll-track {
  animation: reviews-scroll 22s linear infinite;
  will-change: transform;
}

@keyframes cta-tracer-flow {
  0% {
    stroke-dashoffset: 120;
    opacity: 0.2;
  }
  15% {
    opacity: 1;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 0.35;
  }
}

.cta-tracer-line {
  stroke-dasharray: 6 10;
  animation: cta-tracer-flow 2.8s linear infinite;
}

.checkout-cta {
  transition: background-color 220ms ease;
}

.checkout-cta-primary:hover:not(:disabled) {
  background-color: rgba(var(--cl-accent), 0.84);
}

.checkout-cta-secondary:hover:not(:disabled) {
  background-color: rgba(var(--cl-accent), 0.28);
}

.aurora-drift-slow {
  animation: aurora-drift 26s ease-in-out infinite;
}

.aurora-drift-reverse {
  animation: aurora-drift 22s ease-in-out infinite reverse;
}

@keyframes accordion-down {
  from {
    height: 0;
  }
  to {
    height: var(--radix-accordion-content-height);
  }
}

@keyframes accordion-up {
  from {
    height: var(--radix-accordion-content-height);
  }
  to {
    height: 0;
  }
}

.accordion-content[data-state='open'] {
  animation: accordion-down 200ms ease-out;
}

.accordion-content[data-state='closed'] {
  animation: accordion-up 200ms ease-out;
}

:root {
  --altcha-border-width: 1px;
  --altcha-border-radius: 0.5rem;
  --altcha-color-base: rgba(var(--cl-card), 1);
  --altcha-color-border: rgba(255, 255, 255, 0.05);
  --altcha-color-text: #fff;
  --altcha-color-border-focus: currentColor;
  --altcha-color-error-text: #ef4444;
  --altcha-color-footer-bg: #f4f4f4;
  --altcha-max-width: 460px;
}

[x-cloak] {
  display: none !important;
}

input[type='number']::-webkit-outer-spin-button,
input[type='number']::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type='number'] {
  appearance: textfield;
  -moz-appearance: textfield;
}

.hide-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.pulsating {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  opacity: 0;
  pointer-events: none;
  animation: pulsating 1.25s linear infinite;
}

@keyframes pulsating {
  0% {
    opacity: 0.4;
  }

  100% {
    transform: scale(2);
    opacity: 0;
  }
}

#snow {
  @apply fixed inset-0 z-[9999] h-screen w-screen overflow-hidden pointer-events-none;
}

#snow .snowflake {
  @apply absolute -mt-[10px] size-[10px] rounded-full;
  background: rgba(var(--cl-snow, 255, 255, 255), 1);
}

.currency-selector .choices.is-open {
  @apply !ring-0;
}

.currency-selector .choices__inner {
  @apply !min-w-[5rem] !min-h-0 !h-[38px] !rounded-lg !border !border-white/5 !bg-card !py-2 !text-sm;
}

.currency-selector .choices.is-open .choices__inner {
  border-color: rgb(var(--cl-accent)) !important;
}

.currency-selector .choices__inner .symbol {
  @apply min-w-0 bg-transparent font-medium;
  color: rgba(var(--cl-t-primary), 0.8);
}

.currency-selector .choices__inner .code,
.currency-selector .choices__inner .default {
  @apply hidden;
}

.currency-selector .choices__list.choices__list--dropdown {
  @apply !min-w-[11rem] ml-[-5rem] mt-[0.5rem] rounded-lg;

  -ms-overflow-style: none;
  scrollbar-width: none;
}

.currency-selector .choices__inner .choices__item {
  @apply max-w-[50px] overflow-hidden whitespace-nowrap text-clip;
}

.currency-selector .choices__list::-webkit-scrollbar {
  @apply hidden;
}

.currency-selector .choices__list--dropdown .choices__item--selectable {
  @apply !pr-2.5;
}

.currency-selector .choices__list--dropdown .choices__item--selectable.is-highlighted::after {
  @apply hidden;
}

.editor .rtl {
  direction: rtl;
}

.editor .e-paragraph {
  position: relative;
  font-size: 1rem;
  line-height: 1.5rem;
  word-wrap: break-word;
}

.editor .e-quote {
  font-size: 1rem;
  padding-left: 1rem;
  border-left-color: rgb(var(--cl-accent));
  border-left-width: 0.25rem;
  border-left-style: solid;
}

.editor .e-hr,
.editor hr {
  border-top: 1px solid rgb(var(--cl-accent));
  margin: 0.5rem 0;
}

.editor .e-heading-h1 {
  font-size: 2.25rem;
  line-height: 2.5rem;
}

.editor .e-heading-h2 {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.editor .e-heading-h3 {
  font-size: 1.5rem;
  line-height: 2rem;
}

.editor .e-nested-listitem {
  list-style-type: none;
}

.editor .e-list-ol {
  padding: 0;
  margin: 0;
  margin-left: 1rem;
  list-style-type: decimal;
}

.editor .e-list-ul {
  padding: 0;
  margin: 0;
  margin-left: 1rem;
  list-style-type: disc;
}

.editor .e-listitem {
  margin: 0.5rem 1rem;
}

.editor .e-image img {
  max-width: 100%;
  height: auto;
}

.editor .e-youtube iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
}

.editor .e-link {
  color: rgb(var(--cl-accent));
  text-decoration: underline;
}

.editor .e-text-bold {
  font-weight: bold;
}

.editor .e-text-code {
  background-color: rgba(0, 0, 0, 0.5);
  padding: 0.0625rem 0.25rem;
  font-family: monospace;
  font-size: 95%;
}

.editor .e-text-italic {
  font-style: italic;
}

.editor .e-text-strikethrough {
  text-decoration: line-through;
}

.editor .e-text-underline {
  text-decoration: underline;
}

.editor .e-text-underlineStrikethrough {
  text-decoration: underline line-through;
}

.editor .e-code {
  display: block;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 0.5rem;
  font-family: monospace;
  border-radius: 0.5rem;
}

.editor .e-collapsible {
  margin: 0.25rem 0;
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 6px;
}

.editor .e-collapsible-title {
  display: block;
  position: relative;
  padding: 0.5rem 0.5rem 0.5rem 1.5rem;
  font-weight: 600;
}

.editor .e-collapsible-title::marker,
.editor .e-collapsible-title::-webkit-details-marker {
  display: none;
}

.editor .e-collapsible-title:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 0.625rem;
  transform: translateY(-50%);
  border: 1px solid transparent;
  border-left-color: rgb(var(--cl-accent));
  border-width: 4px 6px;
}

.editor .e-collapsible[open] > .editor .e-collapsible-title:before {
  border-left-color: transparent;
  border-top-color: rgb(var(--cl-accent));
  border-width: 6px 4px 0;
}

.editor .e-collapsible-content {
  padding: 0.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.choices {
  @apply !mb-0 rounded-lg;
}

.choices.is-open {
  @apply rounded-b-none;
  box-shadow: 0 0 0 2px rgba(var(--cl-accent), 0.5);
}

.choices .choices__inner {
  @apply min-h-10 w-full rounded-lg border-0 bg-white/[0.025] px-4 py-2 text-base;
  color: rgb(var(--cl-t-primary));
}

.choices[data-type*='select-one'] .choices__inner {
  @apply px-4 py-2;
}

.choices .choices__list.choices__list--single {
  @apply p-0;
}

.choices.is-open .choices__inner {
  @apply rounded-t-lg;
}

.choices .choices__list.choices__list--dropdown {
  @apply rounded-b-lg bg-background;
}

.choices.is-open .choices__list--dropdown,
.choices.is-open .choices__list[aria-expanded] {
  @apply border-white/10;
}

.choices[data-type*='select-one'] .choices__list .choices__input {
  @apply border-b-white/5;
}

.choices[data-type*='select-one'] .choices__list.choices__list--dropdown .choices__input {
  @apply bg-white/[0.025];
  color: rgb(var(--cl-t-primary));
}

.choices .choices__list--dropdown .choices__item,
.choices .choices__list[aria-expanded] .choices__item {
  @apply bg-white/[0.025];
  color: rgb(var(--cl-t-primary));
}

.choices .choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
  background-color: rgb(var(--cl-accent));
  color: rgb(var(--cl-t-primary));
}

.choices .choices[data-type*='select-one'] .choices__input {
  background-color: rgb(var(--cl-accent));
  color: rgb(var(--cl-t-primary));
}

.splide.thumbnails .splide__slide.is-active {
  @apply opacity-100;
}

.splide .splide__arrow {
  background-color: rgba(var(--cl-accent), 0.1);
}

.splide .splide__arrow svg {
  fill: rgb(var(--cl-accent));
}

body lite-youtube {
  @apply max-w-none;
}

.grecaptcha-badge {
  visibility: hidden;
}

.builder .component {
  @apply relative;
}

.builder .component .builder-toolbar {
  @apply z-50 hidden;
}

.builder .component:hover .builder-toolbar {
  @apply block;
}

.builder .announcement .builder-toolbar .actions button:not(.edit),
.builder .navbar .builder-toolbar .actions button:not(.edit),
.builder .footer .builder-toolbar .actions button:not(.edit) {
  display: none;
}

#vouchesContainer .vouches-card {
  @apply rounded-lg border border-white/5 bg-card p-4;
  color: rgb(var(--cl-t-primary));
}

.vouches-title .vouches-profile,
#vouchesContainer .vouches-card .username,
#vouchesContainer .vouches-card .proof-link {
  color: rgb(var(--cl-accent));
}

#vouchesContainer .vouches-card div svg {
  @apply inline-block;
  fill: rgb(var(--cl-accent));
}

#vouchesContainer .vouches-card .description {
  @apply line-clamp-6 text-sm;
  color: rgba(var(--cl-t-primary), 0.5);
}

#vouchesContainer .vouches-card .data-timestamp span {
  @apply text-xs;
  color: rgba(var(--cl-t-primary), 0.5);
}

.faq-accordion-content {
  max-height: 0;
  overflow: hidden;
  opacity: 0.7;
  transition: max-height 240ms ease, opacity 240ms ease;
}

.faq-accordion-item.is-open .faq-accordion-content {
  opacity: 1;
}

.faq-accordion-content-inner {
  padding-top: 0;
}

.faq-accordion-icon {
  transform: rotate(0deg);
  transition: transform 240ms ease;
}

.faq-accordion-item.is-open .faq-accordion-icon {
  transform: rotate(180deg);
}