:root,
.light {
  --radius: 0.625rem;
  --top-navbar-height: 4.5rem;
  --footer-height: 2.3rem;
  --toolbar-height: 2.5rem;
  --tabs-height: 2.5rem;
  --chat-max-width: 54rem;
  --recording-play-bar-height: 4.1rem;
  --logo-height-auth: 2.5rem;
  --logo-height-chat: 3.5rem;
  --logo-height-assistant-preview: 3.5rem;

  --background: 0 0% 100%;
  --background-secondary: 0 0% 100%;

  --foreground: 0 0% 13%;
  --foreground-secondary: 0 0% 38%;

  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;

  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;
  --popover-input-background: 0 0% 100%;
  --popover-title: 0 0% 38%;

  --primary: 208 79% 51%;
  --primary-foreground: 210 40% 98%;

  --primary-dark: 245 71% 61%;
  --primary-dark-foreground: var(--primary-foreground);

  --secondary: 210 40% 96.1%;
  --secondary-foreground: 222.2 47.4% 11.2%;

  --success: 145 100% 39%;
  --success-foreground: 0 0% 100%;

  --info: 201 98% 41%;
  --info-foreground: 0 0% 100%;

  --warning: 48 100% 75%;
  --warning-foreground: 0 0% 0%;

  --muted: 210 40% 96.1%;
  --muted-foreground: 215.4 16.3% 46.9%;

  --accent: 205 86.7% 94.1%;
  --accent-foreground: var(--primary);

  --destructive: 14 82% 46%;
  --destructive-foreground: 6 71% 95%;

  --border: 205 75% 92%;
  --ring: var(--primary);

  --checkbox-background: var(--primary);
  --checkbox-foreground: var(--primary-foreground);

  --input: 214.3 31.8% 91.4%;
  --input-background: 0 0% 98%;

  --chat-input-background: var(--accent);
  --chat-input-border: var(--primary) / 0.3;

  --sidebar-background: var(--background-secondary);
  --sidebar-foreground: var(--foreground);
  --sidebar-foreground-secondary: var(--foreground-secondary);
  --sidebar-primary: var(--primary-dark);
  --sidebar-primary-foreground: var(--primary-dark-foreground);
  --sidebar-accent: var(--accent);
  --sidebar-accent-foreground: var(--primary-dark);
  --sidebar-border: var(--border);
  --sidebar-ring: var(--ring);

  --dropdown-menu-icon-background: var(--accent);
  --dropdown-menu-icon-background-hover: var(--primary) / 0.15;

  --dropzone-background: var(--accent);
  --dropzone-border: var(--primary) / 0.3;
  --dropzone-active-overlay: var(--primary) / 0.1;

  --empty-section-background: var(--accent);
  --empty-section-foreground: var(--primary);
  --empty-section-border: var(--primary) / 0.3;

  --list-item-background: var(--accent);
  --list-item-foreground: var(--primary);
  --list-item-border: var(--primary) / 0.3;
  --list-item-icon-background: var(--primary) / 0.1;

  --tabs-accent: var(--accent);

  --stepper-steps-background: var(--muted);

  --plan-card-accent: var(--accent);

  --attachment-preview-background: var(--muted);

  --toast-success-background: var(--success);
  --toast-success-foreground: 0 0% 0%;
  --toast-error-background: var(--destructive);
  --toast-error-foreground: var(--destructive-foreground);
  --toast-info-background: var(--info);
  --toast-info-foreground: var(--info-foreground);
  --toast-warning-background: var(--warning);
  --toast-warning-foreground: var(--warning-foreground);
  --toast-close-icon-foreground: 0 0% 0%;

  --permission-read-background: 205 77% 92%;
  --permission-read-foreground: 208 79% 51%;
  --permission-write-background: 119 86% 89%;
  --permission-write-foreground: 0 0% 13%;
  --permission-delete-background: 6 71% 95%;
  --permission-delete-foreground: 14 82% 46%;

  --chat-user-message-background: var(--primary);
  --chat-user-message-foreground: var(--primary-foreground);
  --chat-user-message-file-type-foreground: var(--primary-foreground) / 0.8;

  --layout-gap-background: var(--accent);

  --search-input-background: var(--background);

  --scroll-area-thumb-background: var(--border);

  --skeleton-background: var(--muted);

  --icon-background: var(--accent);

  --link: var(--primary-dark);

  --highlighted: var(--primary-dark);

  --chart-primary: var(--primary);
  --chart-primary-dark: var(--primary-dark);
  --chart-destructive: var(--destructive);
  --chart-muted: var(--muted);
  --chart-accent: var(--accent);
  --chart-warning: var(--warning);
  --chart-info: var(--info);
  --chart-success: 145 63% 42%;

  --sidebar-icon-fill-1: hsl(207, 90%, 54%);
  --sidebar-icon-fill-2: hsl(207, 90%, 77%);
  --sidebar-icon-fill-3: hsl(209, 67%, 51%);
  --sidebar-icon-fill-4: hsl(212, 80%, 42%);
  --sidebar-icon-fill-1-hover: hsl(238, 52%, 47%);
  --sidebar-icon-fill-2-hover: hsl(245, 46%, 74%);
  --sidebar-icon-fill-3-hover: hsl(238, 52%, 47%);
  --sidebar-icon-fill-4-hover: hsl(238, 51%, 48%);

  --capability-icon-fill-1: hsl(207, 90%, 77%);
  --capability-icon-fill-2: hsl(207, 90%, 54%);
  --capability-icon-fill-3: hsl(209, 67%, 51%);
  --capability-icon-fill-4: hsl(209, 68%, 52%);
  --capability-icon-fill-5: hsl(207, 91%, 77%);
  --capability-icon-fill-disabled: hsl(0, 0%, 62%);

  --chat-history-icon-fill-1: hsl(207, 90%, 77%);
  --chat-history-icon-fill-2: hsl(207, 90%, 54%);

  --user-icon-fill-1: hsl(208, 100%, 80%);
  --user-icon-fill-2: hsl(208, 100%, 63%);
  --user-icon-fill-3: hsl(0, 0%, 100%);

  --spinning-loader-fill-1: hsl(212, 80%, 42%);
  --spinning-loader-fill-2: hsl(207, 100%, 86%);
  --spinning-loader-fill-3: hsl(207, 100%, 66%);
}

.light {
  --checkbox-background: 207 89% 56%;

  --chat-input-background: 208 100% 97%;
  --chat-input-border: 207 90% 77%;

  --sidebar-accent: 232 45.5% 93.5%;

  --dropdown-menu-icon-background: 208 100% 97%;
  --dropdown-menu-icon-background-hover: 207 90% 77% / 0.4;

  --dropzone-border: 207 90% 77%;

  --empty-section-border: 207 90% 77%;
}

.dark {
  --background: 227 36% 20%;
  --background-secondary: 227 52% 14%;

  --foreground: 270 14% 93%;
  --foreground-secondary: 248 21% 75%;

  --card: 227 32% 24%;
  --card-foreground: 270 14% 93%;

  --popover: 228 32% 30%;
  --popover-foreground: 270 14% 93%;
  --popover-input-background: 227 32% 24%;
  --popover-title: 264 14% 93%;

  --primary: 207 90% 77%;
  --primary-foreground: 0 0% 20%;

  --primary-dark: 256 87% 54%;
  --primary-dark-foreground: 270 14% 93%;

  --destructive: 0 93% 59%;

  --accent: 227 38% 54%;
  --accent-foreground: 270 14% 93%;

  --muted: 227 38% 54%;
  --muted-foreground: 248 21% 75%;

  --border: 235 13% 33%;

  --input: 235 13% 33%;
  --input-background: 227 32% 24%;

  --chat-input-background: 227 32% 24%;
  --chat-input-border: 235 13% 33%;

  --sidebar-accent: 228 32% 30%;
  --sidebar-accent-foreground: 256 86% 83%;

  --dropdown-menu-icon-background: 227 32% 24%;
  --dropdown-menu-icon-background-hover: 227 38% 54%;

  --dropzone-background: 227 32% 24%;
  --dropzone-border: 235 13% 33%;
  --dropzone-active-overlay: 207 90% 77% / 0.1;

  --empty-section-background: 227 32% 24%;
  --empty-section-foreground: 207 90% 77%;
  --empty-section-border: 235 13% 33%;

  --list-item-background: 227 32% 24%;
  --list-item-foreground: 207 90% 77%;
  --list-item-border: 235 13% 33%;
  --list-item-icon-background: 207 90% 77% / 0.1;

  --tabs-accent: var(--sidebar-accent);

  --stepper-steps-background: 228 32% 27%;

  --plan-card-accent: 228 32% 30%;

  --attachment-preview-background: 228 32% 30%;

  --chat-user-message-background: 256 87% 54%;
  --chat-user-message-foreground: 0 0% 100%;
  --chat-user-message-file-type-foreground: 0 0% 100% / 0.8;

  --layout-gap-background: 227 42% 17%;

  --search-input-background: 227 32% 24%;

  --scroll-area-thumb-background: 235 13% 55%;

  --skeleton-background: 227 32% 24%;

  --icon-background: 227 32% 24%;

  --link: 234 64% 72%;

  --highlighted: 237 100% 82%;

  --chart-success: 145 55% 60%;

  --sidebar-icon-fill-1: hsl(207, 100%, 50%);
  --sidebar-icon-fill-2: hsl(207, 90%, 77%);
  --sidebar-icon-fill-3: hsl(212, 80%, 42%);
  --sidebar-icon-fill-4: hsl(212, 80%, 42%);
  --sidebar-icon-fill-1-hover: hsl(234, 89%, 65%);
  --sidebar-icon-fill-2-hover: hsl(256, 86%, 83%);
  --sidebar-icon-fill-3-hover: hsl(212, 80%, 42%);
  --sidebar-icon-fill-4-hover: hsl(239, 52%, 45%);

  --capability-icon-fill-1: hsl(205, 87%, 94%);
  --capability-icon-fill-2: hsl(207, 100%, 50%);
  --capability-icon-fill-3: hsl(212, 80%, 42%);
  --capability-icon-fill-4: hsl(209, 68%, 52%);
  --capability-icon-fill-5: hsl(205, 87%, 94%);
  --capability-icon-fill-disabled: hsl(249, 21%, 75%);
}
