/* [project]/apps/mercato/src/theme/flows360-theme.css [app-client] (css) */
:root:not(.dark) {
  --spectrum: linear-gradient(90deg, #4a2fd8 0%, #0f66f5 55%, #06bfb8 100%);
  --spectrum-soft: #eeebff;
  --track: #ece9f7;
}

:root:not(.dark) body {
  background-image: radial-gradient(900px 360px at 12% -140px, #4a2fd812, #0000 70%), radial-gradient(1100px 380px at 88% -160px, #0f66f50f, #0000 70%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

:root:not(.dark) ::selection {
  color: #1a1640;
  background: #dcd5ff;
}

:root:not(.dark) * {
  scrollbar-color: #d5cfee transparent;
}

:root:not(.dark) :is(button, a).bg-primary {
  background-image: linear-gradient(#ffffff1f, #fff0);
  transition: box-shadow .15s, transform .15s, background-color .15s;
  box-shadow: 0 1px 2px #1a16401a, 0 6px 14px -8px #4a2fd88c;
}

:root:not(.dark) :is(button, a).bg-primary:hover:not(:disabled) {
  box-shadow: 0 1px 2px #1a16401f, 0 10px 20px -10px #4a2fd8a6;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) {
  padding-top: 1.25rem;
  padding-bottom: 1.1rem;
  position: relative;
  overflow: hidden;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]):before {
  content: "";
  background: var(--spectrum);
  height: 3px;
  position: absolute;
  inset: 0 0 auto;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) > div:first-child {
  align-items: center;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) > div:first-child > p:first-child {
  color: #4a2fd8;
  letter-spacing: .08em;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) > div:first-child > p:nth-of-type(2) {
  background: var(--spectrum-soft);
  color: #3f27c4;
  border-radius: 999px;
  padding: 4px 9px;
  font-weight: 600;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) > div:first-child > .text-border {
  opacity: .8;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) > .min-h-\[115px\] {
  min-height: 0;
  padding-block: 2px 4px;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) .h-\[2px\] {
  border-radius: 0;
  height: 6px;
  margin-inline: -1px;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) .h-\[2px\].bg-border\/60 {
  background: var(--track);
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) .h-\[2px\].bg-status-success-icon {
  background: var(--spectrum);
  background-size: 100vw 100%;
  background-attachment: fixed;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) .size-9.bg-status-success-icon {
  background: var(--spectrum);
  background-size: 100vw 100%;
  background-attachment: fixed;
  border-color: #0000;
  box-shadow: 0 2px 8px -2px #4a2fd873;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) .size-9.border-border.bg-background {
  color: #8a85ad;
  background: #f7f6fc;
  border-color: #e7e3f7;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) [aria-current="step"] .size-9 {
  color: #4a2fd8;
  width: 2.75rem;
  height: 2.75rem;
  box-shadow: 0 0 0 6px var(--spectrum-soft), 0 6px 16px -6px #4a2fd88c;
  background: #fff;
  border: 2.5px solid #4a2fd8;
  margin-block: -.25rem;
  font-size: .95rem;
  position: relative;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) [aria-current="step"] .size-9:after {
  content: "";
  border: 2px solid #4a2fd859;
  border-radius: 999px;
  animation: 2.4s ease-out infinite f360-halo;
  position: absolute;
  inset: -9px;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) [aria-current="step"] > div:nth-child(2) > div:first-child {
  color: #3f27c4;
  font-size: .8125rem;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) [aria-current="step"] > div:nth-child(2) > div:nth-child(2) {
  background: var(--spectrum-soft);
  color: #3f27c4;
  border-radius: 999px;
  margin-top: 3px;
  padding: 2px 8px;
  font-weight: 600;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) > .mt-5.border-t {
  border-color: #e7e3f7;
  border-top-style: dashed;
}

:root:not(.dark) [role="progressbar"]:has( > .min-h-\[115px\]) .bg-status-success-icon.h-11 {
  box-shadow: 0 6px 14px -8px #0b6e66b3;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full {
  height: .625rem;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+1) {
  background-color: #4a2fd8;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+2) {
  background-color: #3f4fe6;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+3) {
  background-color: #2a63f0;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+4) {
  background-color: #0f7bf0;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+5) {
  background-color: #0a93e0;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+6) {
  background-color: #07a6cc;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+7) {
  background-color: #06b4bc;
}

:root:not(.dark) .space-y-2 > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full > .bg-muted:nth-child(8n+8) {
  background-color: #06bfb8;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li > .bg-muted:first-child {
  border-color: #0000;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+1) > .bg-muted:first-child {
  background-color: #4a2fd8;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+2) > .bg-muted:first-child {
  background-color: #3f4fe6;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+3) > .bg-muted:first-child {
  background-color: #2a63f0;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+4) > .bg-muted:first-child {
  background-color: #0f7bf0;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+5) > .bg-muted:first-child {
  background-color: #0a93e0;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+6) > .bg-muted:first-child {
  background-color: #07a6cc;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+7) > .bg-muted:first-child {
  background-color: #06b4bc;
}

:root:not(.dark) .space-y-2:has( > .flex.h-2.w-full.gap-1.overflow-hidden.rounded-full) > ul > li:nth-child(8n+8) > .bg-muted:first-child {
  background-color: #06bfb8;
}

:root:not(.dark) .text-2xl.sm\:text-3xl.font-semibold.tracking-tight.text-card-foreground {
  font-family: var(--font-heading);
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

:root:not(.dark) .group.relative.flex.w-full.flex-col.gap-2\.5.rounded-lg.border.border-border.bg-card.shadow-xs {
  transition: box-shadow .15s, border-color .15s;
}

:root:not(.dark) .group.relative.flex.w-full.flex-col.gap-2\.5.rounded-lg.border.border-border.bg-card.shadow-xs:hover {
  border-color: #d5cfee;
  box-shadow: 0 1px 2px #1a16400f, 0 10px 24px -14px #4a2fd873;
}

:root:not(.dark) .group.relative.flex.w-full.flex-col.gap-2\.5.rounded-lg.border.border-border.bg-card.shadow-xs .text-base.font-bold.leading-normal.text-foreground {
  font-family: var(--font-heading);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

@keyframes f360-halo {
  0% {
    opacity: .9;
    transform: scale(.85);
  }

  70% {
    opacity: 0;
    transform: scale(1.15);
  }

  to {
    opacity: 0;
    transform: scale(1.15);
  }
}

@media (prefers-reduced-motion: reduce) {
  [role="progressbar"] [aria-current="step"] .size-9:after {
    opacity: 0;
    animation: none;
  }
}

@font-face {
  font-family: Plus Jakarta Sans Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url("/fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Plus Jakarta Sans Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url("/fonts/plus-jakarta-sans-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/outfit-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit Variable;
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/outfit-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html:root {
  --font-geist-sans: "Plus Jakarta Sans Variable", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-heading: "Outfit Variable", var(--font-geist-sans);
  --radius: .75rem;
}

:root:not(.dark) {
  --flows-canvas: #f5f3fe;
  --background: #fff;
  --foreground: #1a1640;
  --card: #fff;
  --card-foreground: #1a1640;
  --popover: #fff;
  --popover-foreground: #1a1640;
  --muted: #f1eefd;
  --muted-foreground: #5f5a85;
  --secondary: #f1eefd;
  --secondary-foreground: #1a1640;
  --accent: #eae6fc;
  --accent-foreground: #1a1640;
  --primary: #4a2fd8;
  --primary-foreground: #fff;
  --primary-hover: #3f27c4;
  --accent-indigo: #4a2fd8;
  --accent-indigo-foreground: #fff;
  --destructive: #d02b57;
  --brand-violet: #a898f5;
  --brand-violet-foreground: #1a1640;
  --border: #e7e3f7;
  --input: #d5cfee;
  --ring: #a898f5;
  --bg-disabled: #f7f6fc;
  --text-disabled: #c8c4dd;
  --border-disabled: #ece9f7;
  --chart-1: #4a2fd8;
  --chart-2: #0f66f5;
  --chart-3: #06bfb8;
  --chart-4: #f59e0b;
  --chart-5: #ec4899;
  --chart-blue: #0f66f5;
  --chart-indigo: #4a2fd8;
  --chart-violet: #7462e8;
  --chart-teal: #06a8a2;
  --sidebar: #fff;
  --sidebar-foreground: #1a1640;
  --sidebar-primary: #4a2fd8;
  --sidebar-primary-foreground: #fff;
  --sidebar-accent: #f1eefd;
  --sidebar-accent-foreground: #1a1640;
  --sidebar-border: #e7e3f7;
  --sidebar-ring: #a898f5;
  --status-info-bg: #eeebff;
  --status-info-text: #4a2fd8;
  --status-info-border: #d9d1fa;
  --status-info-icon: #4a2fd8;
  --status-info-solid: #4a2fd8;
  --status-success-bg: #e2f7f5;
  --status-success-text: #0b6e66;
  --status-success-border: #b9e9e3;
  --status-success-icon: #0e8f86;
  --status-success-solid: #0b7a72;
  --status-warning-bg: #fff3dc;
  --status-warning-text: #8f4e00;
  --status-warning-border: #f7d9a0;
  --status-warning-icon: #c27200;
  --status-warning-solid: #b45309;
  --status-error-bg: #ffecef;
  --status-error-text: #b4234a;
  --status-error-border: #f8c8d3;
  --status-error-icon: #d22a55;
  --status-error-solid: #c81e4b;
  --status-neutral-bg: #f1eff8;
  --status-neutral-text: #4f4a72;
  --status-neutral-border: #e2def1;
  --status-neutral-icon: #6e6993;
  --status-neutral-solid: #5f5a85;
  --status-pink-bg: #fdecf7;
  --status-pink-text: #b21f72;
  --status-pink-border: #f6c8e3;
  --status-pink-icon: #d03c93;
  --status-pink-solid: #b21f72;
}

body {
  background-color: var(--flows-canvas, var(--background));
}

@layer base {
  h1, h2, h3 {
    font-family: var(--font-heading, inherit);
  }
}