@import "tw-animate-css";
@import "tailwindcss/preflight.css";

@import "tailwindcss/theme.css";
@import "tailwindcss/preflight.css";
@import "tailwindcss/utilities.css";

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

@theme inline {
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --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-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);
  --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);
}

:root {
  --radius: 0.625rem;
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.205 0 0);
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.556 0 0);
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --border: oklch(0.922 0 0);
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);
  --chart-1: oklch(0.646 0.222 41.116);
  --chart-2: oklch(0.6 0.118 184.704);
  --chart-3: oklch(0.398 0.07 227.392);
  --chart-4: oklch(0.828 0.189 84.429);
  --chart-5: oklch(0.769 0.188 70.08);
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.205 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
}

.dark {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.205 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.205 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.922 0 0);
  --primary-foreground: oklch(0.205 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.704 0.191 22.216);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 15%);
  --ring: oklch(0.556 0 0);
  --chart-1: oklch(0.488 0.243 264.376);
  --chart-2: oklch(0.696 0.17 162.48);
  --chart-3: oklch(0.769 0.188 70.08);
  --chart-4: oklch(0.627 0.265 303.9);
  --chart-5: oklch(0.645 0.246 16.439);
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-primary: oklch(0.488 0.243 264.376);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(1 0 0 / 10%);
  --sidebar-ring: oklch(0.556 0 0);
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground;
  }
}

@theme {
    /* Colors */
    --color-blue-normal: #229bff;
    --color-blue-lighter: #2cbbff;
    --color-blue-90: #38a5ff;
    --color-blue-80: #4eafff;
    --color-blue-70: #64b9ff;
    --color-blue-60: #7ac3ff;
    --color-blue-50: #91cdff;
    --color-blue-40: #a7d7ff;
    --color-blue-30: #bde1ff;
    --color-blue-20: #d3ebff;
    --color-blue-10: #e9f5ff;
    --color-blue-shade-100: #1f8ce6;
    --color-blue-shade-200: #1b7ccc;
    --color-blue-shade-300: #186db3;
    --color-blue-shade-400: #145d99;
    --color-blue-shade-500: #114e80;
    --color-blue-tint-100: #38a5ff;
    --color-blue-tint-200: #4eafff;
    --color-blue-tint-300: #64b9ff;
    --color-blue-tint-400: #7ac3ff;
    --color-blue-tint-500: #91cdff;

    --color-purple-normal: #5256be;
    --color-purple-shade-5: #4e52b5;
    --color-purple-tint-95: #5b5ec1;
    --color-purple-tint-90: #6367c5;
    --color-purple-tint-85: #6c6fc8;
    --color-purple-tint-80: #7578cb;
    --color-purple-tint-75: #7d80ce;
    --color-purple-tint-70: #8689d2;
    --color-purple-tint-65: #8f91d5;
    --color-purple-tint-60: #979ad8;
    --color-purple-tint-55: #a0a2db;
    --color-purple-tint-50: #a9abdf;
    --color-purple-tint-45: #b1b3e2;
    --color-purple-tint-40: #babbe5;
    --color-purple-tint-35: #c2c4e8;
    --color-purple-tint-30: #cbccec;
    --color-purple-tint-25: #d4d5ef;
    --color-purple-tint-20: #dcddf2;
    --color-purple-tint-15: #e5e6f5;
    --color-purple-tint-10: #eeeef9;
    --color-purple-tint-5: #f6f7fc;

    --color-gray-normal: #394854;
    --color-gray-60: #f0f2f5;
    --color-gray-100: #f7f9fa;
    --color-gray-150: #e8ecf0;
    --color-gray-200: #d9e0e5;
    --color-gray-250: #cad3db;
    --color-gray-300: #bbc7d1;
    --color-gray-350: #abbac6;
    --color-gray-400: #9caebc;
    --color-gray-450: #8da1b2;
    --color-gray-500: #7e95a7;
    --color-gray-550: #6f889d;
    --color-gray-600: #627c90;
    --color-gray-650: #586f81;
    --color-gray-700: #4d6272;
    --color-gray-750: #435563;
    --color-gray-800: #394854;
    --color-gray-850: #2e3b44;
    --color-gray-900: #242e35;
    --color-gray-950: #1a2126;
    --color-gray-1000: #0f1417;

    /* Font family */
    --font-sans: 'Host Grotesk', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';

    /* Font sizes */
    --text-smaller-3: 10.22px;
    --text-smaller-2: 11.22px;
    --text-smaller-1: 12.2px;
    --text-1x: 15px;
    --text-2x: 15.75px;
    --text-3x: 17.72px;
    --text-4x: 19.93px;
    --text-5x: 22.43px;
    --text-6x: 25.23px;
    --text-7x: 28.38px;
    --text-8x: 31.38px;
    --text-9x: 33.38px;
    --text-10x: 36px;
    --text-11x: 39.6px;
    --text-12x: 43.56px;

    /* Border radius */
    --radius-1: 20px;
    --radius-2: 16px;
    --radius-3: 12px;
    --radius-4: 8px;
    --radius-5: 6px;
    --radius-6: 4px;
    --radius-7: 2px;

    /* Box shadows */
    --shadow-input: 0 5px 20px -3px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-card: 0 4px 10px -6px rgba(0, 0, 0, 0.04), 0 2px 4px -1px rgba(0, 0, 0, 0.02);

    /* Spacing - 4px scale for 1-219 (ALL VALUES) */
    --spacing-1: 4px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 20px;
    --spacing-6: 24px;
    --spacing-7: 28px;
    --spacing-8: 32px;
    --spacing-9: 36px;
    --spacing-10: 40px;
    --spacing-11: 44px;
    --spacing-12: 48px;
    --spacing-13: 52px;
    --spacing-14: 56px;
    --spacing-15: 60px;
    --spacing-16: 64px;
    --spacing-17: 68px;
    --spacing-18: 72px;
    --spacing-19: 76px;
    --spacing-20: 80px;
    --spacing-21: 84px;
    --spacing-22: 88px;
    --spacing-23: 92px;
    --spacing-24: 96px;
    --spacing-25: 100px;
    --spacing-26: 104px;
    --spacing-27: 108px;
    --spacing-28: 112px;
    --spacing-29: 116px;
    --spacing-30: 120px;
    --spacing-31: 124px;
    --spacing-32: 128px;
    --spacing-33: 132px;
    --spacing-34: 136px;
    --spacing-35: 140px;
    --spacing-36: 144px;
    --spacing-37: 148px;
    --spacing-38: 152px;
    --spacing-39: 156px;
    --spacing-40: 160px;
    --spacing-41: 164px;
    --spacing-42: 168px;
    --spacing-43: 172px;
    --spacing-44: 176px;
    --spacing-45: 180px;
    --spacing-46: 184px;
    --spacing-47: 188px;
    --spacing-48: 192px;
    --spacing-49: 196px;
    --spacing-50: 200px;
    --spacing-51: 204px;
    --spacing-52: 208px;
    --spacing-53: 212px;
    --spacing-54: 216px;
    --spacing-55: 220px;
    --spacing-56: 224px;
    --spacing-57: 228px;
    --spacing-58: 232px;
    --spacing-59: 236px;
    --spacing-60: 240px;
    --spacing-61: 244px;
    --spacing-62: 248px;
    --spacing-63: 252px;
    --spacing-64: 256px;
    --spacing-65: 260px;
    --spacing-66: 264px;
    --spacing-67: 268px;
    --spacing-68: 272px;
    --spacing-69: 276px;
    --spacing-70: 280px;
    --spacing-71: 284px;
    --spacing-72: 288px;
    --spacing-73: 292px;
    --spacing-74: 296px;
    --spacing-75: 300px;
    --spacing-76: 304px;
    --spacing-77: 308px;
    --spacing-78: 312px;
    --spacing-79: 316px;
    --spacing-80: 320px;
    --spacing-81: 324px;
    --spacing-82: 328px;
    --spacing-83: 332px;
    --spacing-84: 336px;
    --spacing-85: 340px;
    --spacing-86: 344px;
    --spacing-87: 348px;
    --spacing-88: 352px;
    --spacing-89: 356px;
    --spacing-90: 360px;
    --spacing-91: 364px;
    --spacing-92: 368px;
    --spacing-93: 372px;
    --spacing-94: 376px;
    --spacing-95: 380px;
    --spacing-96: 384px;
    --spacing-97: 388px;
    --spacing-98: 392px;
    --spacing-99: 396px;
    --spacing-100: 400px;
    --spacing-101: 404px;
    --spacing-102: 408px;
    --spacing-103: 412px;
    --spacing-104: 416px;
    --spacing-105: 420px;
    --spacing-106: 424px;
    --spacing-107: 428px;
    --spacing-108: 432px;
    --spacing-109: 436px;
    --spacing-110: 440px;
    --spacing-111: 444px;
    --spacing-112: 448px;
    --spacing-113: 452px;
    --spacing-114: 456px;
    --spacing-115: 460px;
    --spacing-116: 464px;
    --spacing-117: 468px;
    --spacing-118: 472px;
    --spacing-119: 476px;
    --spacing-120: 480px;
    --spacing-121: 484px;
    --spacing-122: 488px;
    --spacing-123: 492px;
    --spacing-124: 496px;
    --spacing-125: 500px;
    --spacing-126: 504px;
    --spacing-127: 508px;
    --spacing-128: 512px;
    --spacing-129: 516px;
    --spacing-130: 520px;
    --spacing-131: 524px;
    --spacing-132: 528px;
    --spacing-133: 532px;
    --spacing-134: 536px;
    --spacing-135: 540px;
    --spacing-136: 544px;
    --spacing-137: 548px;
    --spacing-138: 552px;
    --spacing-139: 556px;
    --spacing-140: 560px;
    --spacing-141: 564px;
    --spacing-142: 568px;
    --spacing-143: 572px;
    --spacing-144: 576px;
    --spacing-145: 580px;
    --spacing-146: 584px;
    --spacing-147: 588px;
    --spacing-148: 592px;
    --spacing-149: 596px;
    --spacing-150: 600px;
    --spacing-151: 604px;
    --spacing-152: 608px;
    --spacing-153: 612px;
    --spacing-154: 616px;
    --spacing-155: 620px;
    --spacing-156: 624px;
    --spacing-157: 628px;
    --spacing-158: 632px;
    --spacing-159: 636px;
    --spacing-160: 640px;
    --spacing-161: 644px;
    --spacing-162: 648px;
    --spacing-163: 652px;
    --spacing-164: 656px;
    --spacing-165: 660px;
    --spacing-166: 664px;
    --spacing-167: 668px;
    --spacing-168: 672px;
    --spacing-169: 676px;
    --spacing-170: 680px;
    --spacing-171: 684px;
    --spacing-172: 688px;
    --spacing-173: 692px;
    --spacing-174: 696px;
    --spacing-175: 700px;
    --spacing-176: 704px;
    --spacing-177: 708px;
    --spacing-178: 712px;
    --spacing-179: 716px;
    --spacing-180: 720px;
    --spacing-181: 724px;
    --spacing-182: 728px;
    --spacing-183: 732px;
    --spacing-184: 736px;
    --spacing-185: 740px;
    --spacing-186: 744px;
    --spacing-187: 748px;
    --spacing-188: 752px;
    --spacing-189: 756px;
    --spacing-190: 760px;
    --spacing-191: 764px;
    --spacing-192: 768px;
    --spacing-193: 772px;
    --spacing-194: 776px;
    --spacing-195: 780px;
    --spacing-196: 784px;
    --spacing-197: 788px;
    --spacing-198: 792px;
    --spacing-199: 796px;
    --spacing-200: 800px;
    --spacing-201: 804px;
    --spacing-202: 808px;
    --spacing-203: 812px;
    --spacing-204: 816px;
    --spacing-205: 820px;
    --spacing-206: 824px;
    --spacing-207: 828px;
    --spacing-208: 832px;
    --spacing-209: 836px;
    --spacing-210: 840px;
    --spacing-211: 844px;
    --spacing-212: 848px;
    --spacing-213: 852px;
    --spacing-214: 856px;
    --spacing-215: 860px;
    --spacing-216: 864px;
    --spacing-217: 868px;
    --spacing-218: 872px;
    --spacing-219: 876px;
}

#coupons-plus-welcome {
    font-family: 'Host Grotesk', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    line-height: 1.5;
    font-weight: 400;

    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    margin: 0;
}