@import "./light.css";

@font-face {
  font-display: swap;
  font-family: "Roboto Flex";
  font-style: normal;
  font-weight: 100 1000;
  font-stretch: 100%;
  src: url("./roboto-flex-regular.woff2") format("woff2");
}

:root,
:host,
.sl-theme-light {
  color-scheme: light;

  --sl-color-gray-1: hsl(0 0 97%);
  --sl-color-gray-2: hsl(0 0 93%);
  --sl-color-gray-3: hsl(0 0 87%);
  --sl-color-gray-4: hsl(0 0 75%);
  --sl-color-gray-5: hsl(0 0 62%);
  --sl-color-gray-6: hsl(0 0 50%);
  --sl-color-gray-7: hsl(0 0 44%);
  --sl-color-gray-8: hsl(0 0 33%);
  --sl-color-gray-9: hsl(0 0 24%);
  --sl-color-gray-10: hsl(0 0 15%);
  --sl-color-gray-11: hsl(0 0 7%);

  --sl-color-red-1: hsl(18deg 100% 96%);
  --sl-color-red-2: hsl(13deg 100% 94%);
  --sl-color-red-3: hsl(12deg 100% 87%);
  --sl-color-red-4: hsl(10deg 100% 78%);
  --sl-color-red-5: hsl(9deg 84% 65%);
  --sl-color-red-6: hsl(9deg 88% 48%);
  --sl-color-red-7: hsl(0deg 100% 38%);
  --sl-color-red-8: hsl(8deg 85% 28%);
  --sl-color-red-9: hsl(3deg 100% 18%);
  --sl-color-red-10: hsl(2deg 100% 14%);
  --sl-color-red-11: hsl(1deg 100% 10%);

  --sl-color-yellow-1: hsl(40deg 100% 96%);
  --sl-color-yellow-2: hsl(40deg 95% 91%);
  --sl-color-yellow-3: hsl(45deg 100% 85%);
  --sl-color-yellow-4: hsl(42deg 100% 75%);
  --sl-color-yellow-5: hsl(43deg 98% 60%);
  --sl-color-yellow-6: hsl(44deg 100% 48%);
  --sl-color-yellow-7: hsl(42deg 100% 26%);
  --sl-color-yellow-8: hsl(41deg 100% 19%);
  --sl-color-yellow-9: hsl(38deg 100% 13%);
  --sl-color-yellow-10: hsl(37deg 100% 10%);
  --sl-color-yellow-11: hsl(34deg 100% 7%);

  --sl-color-green-1: hsl(125deg 76% 97%);
  --sl-color-green-2: hsl(131deg 63% 92%);
  --sl-color-green-3: hsl(130deg 61% 83%);
  --sl-color-green-4: hsl(133deg 49% 67%);
  --sl-color-green-5: hsl(138deg 47% 49%);
  --sl-color-green-6: hsl(144deg 100% 31%);
  --sl-color-green-7: hsl(140deg 100% 24%);
  --sl-color-green-8: hsl(134deg 100% 18%);
  --sl-color-green-9: hsl(126deg 100% 12%);
  --sl-color-green-10: hsl(134deg 100% 8%);
  --sl-color-green-11: hsl(122deg 100% 6%);

  --sl-color-blue-1: hsl(201deg 100% 95%);
  --sl-color-blue-2: hsl(202deg 100% 93%);
  --sl-color-blue-3: hsl(202deg 100% 90%);
  --sl-color-blue-4: hsl(202deg 100% 86%);
  --sl-color-blue-5: hsl(202deg 100% 79%);
  --sl-color-blue-6: hsl(202deg 94% 67%);
  --sl-color-blue-7: hsl(205deg 97% 57%);
  --sl-color-blue-8: hsl(207deg 81% 52%);
  --sl-color-blue-9: hsl(209deg 80% 46%);
  --sl-color-blue-10: hsl(211deg 83% 41%);
  --sl-color-blue-11: hsl(214deg 89% 28%);

  --sl-color-lotus-1: hsl(233deg 100% 98%);
  --sl-color-lotus-2: hsl(236deg 73% 96%);
  --sl-color-lotus-3: hsl(236deg 73% 91%);
  --sl-color-lotus-4: hsl(238deg 95% 85%);
  --sl-color-lotus-5: hsl(241deg 98% 78%);
  --sl-color-lotus-6: hsl(246deg 97% 69%);
  --sl-color-lotus-7: hsl(257deg 95% 55%);
  --sl-color-lotus-8: hsl(256deg 77% 41%);
  --sl-color-lotus-9: hsl(260deg 100% 25%);
  --sl-color-lotus-10: hsl(256deg 88% 20%);
  --sl-color-lotus-11: hsl(256deg 100% 14%);

  --sl-color-primary-50: var(--sl-color-lotus-1);
  --sl-color-primary-100: var(--sl-color-lotus-2);
  --sl-color-primary-200: var(--sl-color-lotus-3);
  --sl-color-primary-300: var(--sl-color-lotus-4);
  --sl-color-primary-400: var(--sl-color-lotus-5);
  --sl-color-primary-500: var(--sl-color-lotus-6);
  --sl-color-primary-600: var(--sl-color-lotus-7);
  --sl-color-primary-700: var(--sl-color-lotus-8);
  --sl-color-primary-800: var(--sl-color-lotus-9);
  --sl-color-primary-900: var(--sl-color-lotus-10);
  --sl-color-primary-950: var(--sl-color-lotus-11);

  --sl-color-success-50: var(--sl-color-green-1);
  --sl-color-success-100: var(--sl-color-green-2);
  --sl-color-success-200: var(--sl-color-green-3);
  --sl-color-success-300: var(--sl-color-green-4);
  --sl-color-success-400: var(--sl-color-green-5);
  --sl-color-success-500: var(--sl-color-green-6);
  --sl-color-success-600: var(--sl-color-green-7);
  --sl-color-success-700: var(--sl-color-green-8);
  --sl-color-success-800: var(--sl-color-green-9);
  --sl-color-success-900: var(--sl-color-green-10);
  --sl-color-success-950: var(--sl-color-green-11);

  --sl-color-warning-50: var(--sl-color-yellow-1);
  --sl-color-warning-100: var(--sl-color-yellow-2);
  --sl-color-warning-200: var(--sl-color-yellow-3);
  --sl-color-warning-300: var(--sl-color-yellow-4);
  --sl-color-warning-400: var(--sl-color-yellow-5);
  --sl-color-warning-500: var(--sl-color-yellow-6);
  --sl-color-warning-600: var(--sl-color-yellow-7);
  --sl-color-warning-700: var(--sl-color-yellow-8);
  --sl-color-warning-800: var(--sl-color-yellow-9);
  --sl-color-warning-900: var(--sl-color-yellow-10);
  --sl-color-warning-950: var(--sl-color-yellow-11);

  --sl-color-danger-50: var(--sl-color-red-1);
  --sl-color-danger-100: var(--sl-color-red-2);
  --sl-color-danger-200: var(--sl-color-red-3);
  --sl-color-danger-300: var(--sl-color-red-4);
  --sl-color-danger-400: var(--sl-color-red-5);
  --sl-color-danger-500: var(--sl-color-red-6);
  --sl-color-danger-600: var(--sl-color-red-7);
  --sl-color-danger-700: var(--sl-color-red-8);
  --sl-color-danger-800: var(--sl-color-red-9);
  --sl-color-danger-900: var(--sl-color-red-10);
  --sl-color-danger-950: var(--sl-color-red-11);

  --sl-color-neutral-50: var(--sl-color-gray-1);
  --sl-color-neutral-100: var(--sl-color-gray-2);
  --sl-color-neutral-200: var(--sl-color-gray-3);
  --sl-color-neutral-300: var(--sl-color-gray-4);
  --sl-color-neutral-400: var(--sl-color-gray-5);
  --sl-color-neutral-500: var(--sl-color-gray-6);
  --sl-color-neutral-600: var(--sl-color-gray-7);
  --sl-color-neutral-700: var(--sl-color-gray-8);
  --sl-color-neutral-800: var(--sl-color-gray-9);
  --sl-color-neutral-900: var(--sl-color-gray-10);
  --sl-color-neutral-950: var(--sl-color-gray-11);

  --sl-color-info-50: var(--sl-color-blue-1);
  --sl-color-info-100: var(--sl-color-blue-2);
  --sl-color-info-200: var(--sl-color-blue-3);
  --sl-color-info-300: var(--sl-color-blue-4);
  --sl-color-info-400: var(--sl-color-blue-5);
  --sl-color-info-500: var(--sl-color-blue-6);
  --sl-color-info-600: var(--sl-color-blue-7);
  --sl-color-info-700: var(--sl-color-blue-8);
  --sl-color-info-800: var(--sl-color-blue-9);
  --sl-color-info-900: var(--sl-color-blue-10);
  --sl-color-info-950: var(--sl-color-blue-11);

  --sl-color-neutral-0: hsl(0deg 0% 100%);
  --sl-color-neutral-1000: hsl(0deg 0% 0%);

  --sl-border-radius-small: 0.375rem;
  --sl-border-radius-medium: 0.625rem;
  --sl-border-radius-large: 0.75rem;
  --sl-border-radius-x-large: 1rem;
  --sl-border-radius-2x-large: 3rem;
  --sl-border-radius-circle: 50%;
  --sl-border-radius-pill: 9999px;

  --sl-spacing-3x-small: 0.25rem;
  --sl-spacing-2x-small: 0.5rem;
  --sl-spacing-x-small: 0.75rem;
  --sl-spacing-small: 1rem;
  --sl-spacing-medium: 1.25rem;
  --sl-spacing-large: 1.5rem;
  --sl-spacing-x-large: 2rem;
  --sl-spacing-2x-large: 2.5rem;
  --sl-spacing-3x-large: 4rem;
  --sl-spacing-4x-large: 5rem;

  --sl-font-mono: "Roboto Flex", helvetica, arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --sl-font-sans: "Roboto Flex", helvetica, arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --sl-font-serif: "Roboto Flex", helvetica, arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

  --sl-font-size-2x-small: 0.5rem;
  --sl-font-size-x-small: 0.75rem;
  --sl-font-size-small: 0.875rem;
  --sl-font-size-medium: 1rem;
  --sl-font-size-large: 1.125rem;
  --sl-font-size-large-plus: 1.25rem;
  --sl-font-size-x-large: 1.5rem;
  --sl-font-size-x-large-plus: 1.75rem;
  --sl-font-size-2x-large: 2.25rem;
  --sl-font-size-3x-large: 3.25rem;
  --sl-font-size-4x-large: 4.5rem;

  --sl-font-weight-light: 300;
  --sl-font-weight-normal: 400;
  --sl-font-weight-semibold: 500;
  --sl-font-weight-bold: 600;

  --sl-letter-spacing-denser: -0.04em;
  --sl-letter-spacing-dense: -0.02em;
  --sl-letter-spacing-normal: normal;
  --sl-letter-spacing-loose: 0.04em;
  --sl-letter-spacing-looser: 0.12em;

  --sl-line-height-denser: 1;
  --sl-line-height-dense: 1.2;
  --sl-line-height-normal: 1.5;
  --sl-line-height-loose: 1.8;
  --sl-line-height-looser: 2;

  --sl-button-font-size-small: var(--sl-font-size-small);
  --sl-button-font-size-medium: var(--sl-font-size-medium);
  --sl-button-font-size-large: var(--sl-font-size-large);

  --sl-input-height-small: 1.875rem;
  --sl-input-height-medium: 2.25rem;
  --sl-input-height-large: 3.125rem;

  --sl-input-color: var(--sl-color-primary-900);
  --sl-input-color-hover: var(--sl-color-primary-900);
  --sl-input-color-focus: var(--sl-color-primary-900);
  --sl-input-focus-ring-color: var(--sl-color-primary-300);
  --sl-input-placeholder-color: var(--sl-color-neutral-600);

  --sl-input-background-color-disabled: var(--sl-color-neutral-100);

  --sl-toast-stack-top: 70px;
}

body {
  font-family: var(--sl-font-sans);
  font-size: 16px;
  color: var(--sl-color-neutral-900);
}

yd-dialog > sl-tab-group::part(body) {
  overflow: visible;
}