@import "@radix-ui/colors/green.css";
@import "@radix-ui/colors/green-dark.css";
@import "@radix-ui/colors/amber.css";
@import "@radix-ui/colors/amber-dark.css";
@import "@radix-ui/colors/red.css";
@import "@radix-ui/colors/red-dark.css";
@import "@radix-ui/colors/blue.css";
@import "@radix-ui/colors/blue-dark.css";
@import "@radix-ui/colors/orange.css";
@import "@radix-ui/colors/orange-dark.css";
@import "@radix-ui/colors/purple.css";
@import "@radix-ui/colors/purple-dark.css";
@import "@radix-ui/colors/pink.css";
@import "@radix-ui/colors/pink-dark.css";
@import "@radix-ui/colors/slate.css";
@import "@radix-ui/colors/slate-dark.css";

:root {
  --expo-color-white: #fff;
  --expo-color-black: #000;

  /* App Icon Backgrounds */
  --expo-color-app-cyan: #07c0cb;
  --expo-color-app-light-blue: #1e92c4;
  --expo-color-app-dark-blue: #0b67af;
  --expo-color-app-indigo: #4b50b2;
  --expo-color-app-purple: #8945a3;
  --expo-color-app-pink: #c04891;
  --expo-color-app-orange: #e96d3c;
  --expo-color-app-gold: #f38f2f;
  --expo-color-app-yellow: #eebc01;
  --expo-color-app-lime: #aabd04;
  --expo-color-app-light-green: #6aa72a;
  --expo-color-app-dark-green: #3a8e39;

  /* Backgrounds */
  --expo-theme-background-default: var(--expo-color-white);
  --expo-theme-background-screen: var(--slate-1);
  --expo-theme-background-subtle: var(--slate-2);
  --expo-theme-background-element: var(--slate-3);
  --expo-theme-background-hover: var(--slate-4);
  --expo-theme-background-selected: var(--slate-5);
  --expo-theme-background-overlay: var(--expo-color-white);
  --expo-theme-background-success: var(--green-3);
  --expo-theme-background-warning: var(--amber-3);
  --expo-theme-background-danger: var(--red-3);
  --expo-theme-background-info: var(--blue-3);
  --expo-theme-background-preview: var(--purple-3);

  /* Icons */
  --expo-theme-icon-default: var(--slate-11);
  --expo-theme-icon-secondary: var(--slate-10);
  --expo-theme-icon-tertiary: var(--slate-9);
  --expo-theme-icon-quaternary: var(--slate-8);
  --expo-theme-icon-success: var(--green-10);
  --expo-theme-icon-warning: var(--amber-11);
  --expo-theme-icon-danger: var(--red-10);
  --expo-theme-icon-info: var(--blue-10);
  --expo-theme-icon-preview: var(--purple-10);

  /* Text */
  --expo-theme-text-default: var(--slate-12);
  --expo-theme-text-secondary: var(--slate-11);
  --expo-theme-text-tertiary: var(--slate-10);
  --expo-theme-text-quaternary: var(--slate-9);
  --expo-theme-text-link: var(--blue-11);
  --expo-theme-text-success: var(--green-11);
  --expo-theme-text-warning: var(--amber-11);
  --expo-theme-text-danger: var(--red-11);
  --expo-theme-text-info: var(--blue-11);
  --expo-theme-text-preview: var(--purple-11);

  /* Borders */
  --expo-theme-border-default: var(--slate-6);
  --expo-theme-border-secondary: var(--slate-5);
  --expo-theme-border-success: var(--green-7);
  --expo-theme-border-warning: var(--amber-7);
  --expo-theme-border-danger: var(--red-7);
  --expo-theme-border-info: var(--blue-7);
  --expo-theme-border-preview: var(--purple-7);

  /* Buttons */
  --expo-theme-button-primary-background: var(--expo-color-black);
  --expo-theme-button-primary-border: transparent;
  --expo-theme-button-primary-hover: var(--slate-11);
  --expo-theme-button-primary-icon: var(--expo-color-white);
  --expo-theme-button-primary-text: var(--expo-color-white);
  --expo-theme-button-primary-disabled-background: var(--slate-8);
  --expo-theme-button-primary-disabled-border: transparent;
  --expo-theme-button-primary-disabled-text: var(--expo-color-white);

  --expo-theme-button-secondary-background: var(--slate-3);
  --expo-theme-button-secondary-border: transparent;
  --expo-theme-button-secondary-hover: var(--slate-5);
  --expo-theme-button-secondary-icon: var(--slate-12);
  --expo-theme-button-secondary-text: var(--slate-12);
  --expo-theme-button-secondary-disabled-background: var(--slate-3);
  --expo-theme-button-secondary-disabled-border: transparent;
  --expo-theme-button-secondary-disabled-text: var(--slate-9);

  --expo-theme-button-tertiary-background: transparent;
  --expo-theme-button-tertiary-border: var(--slate-7);
  --expo-theme-button-tertiary-hover: var(--slate-3);
  --expo-theme-button-tertiary-icon: var(--slate-11);
  --expo-theme-button-tertiary-text: var(--slate-12);
  --expo-theme-button-tertiary-disabled-background: transparent;
  --expo-theme-button-tertiary-disabled-border: var(--slate-6);
  --expo-theme-button-tertiary-disabled-text: var(--slate-9);

  --expo-theme-button-quaternary-background: transparent;
  --expo-theme-button-quaternary-border: transparent;
  --expo-theme-button-quaternary-hover: var(--slate-3);
  --expo-theme-button-quaternary-icon: var(--slate-11);
  --expo-theme-button-quaternary-text: var(--slate-12);
  --expo-theme-button-quaternary-disabled-background: transparent;
  --expo-theme-button-quaternary-disabled-border: transparent;
  --expo-theme-button-quaternary-disabled-text: var(--slate-9);

  --expo-theme-button-primary-destructive-background: var(--red-10);
  --expo-theme-button-primary-destructive-border: transparent;
  --expo-theme-button-primary-destructive-hover: var(--red-11);
  --expo-theme-button-primary-destructive-icon: var(--red-3);
  --expo-theme-button-primary-destructive-text: var(--expo-color-white);
  --expo-theme-button-primary-destructive-disabled-background: var(--red-7);
  --expo-theme-button-primary-destructive-disabled-border: transparent;
  --expo-theme-button-primary-destructive-disabled-text: var(--expo-color-white);

  --expo-theme-button-secondary-destructive-background: var(--expo-color-white);
  --expo-theme-button-secondary-destructive-border: var(--red-7);
  --expo-theme-button-secondary-destructive-hover: var(--red-3);
  --expo-theme-button-secondary-destructive-icon: var(--red-9);
  --expo-theme-button-secondary-destructive-text: var(--red-11);
  --expo-theme-button-secondary-destructive-disabled-background: var(--expo-color-white);
  --expo-theme-button-secondary-destructive-disabled-border: var(--red-5);
  --expo-theme-button-secondary-destructive-disabled-text: var(--red-8);

  --expo-theme-button-tertiary-destructive-background: transparent;
  --expo-theme-button-tertiary-destructive-border: transparent;
  --expo-theme-button-tertiary-destructive-hover: var(--red-3);
  --expo-theme-button-tertiary-destructive-icon: var(--red-9);
  --expo-theme-button-tertiary-destructive-text: var(--red-10);
  --expo-theme-button-tertiary-destructive-disabled-background: transparent;
  --expo-theme-button-tertiary-destructive-disabled-border: transparent;
  --expo-theme-button-tertiary-destructive-disabled-text: var(--red-8);

  /* Light shadows */
  --expo-theme-shadows-none: 0 0 transparent;
  --expo-theme-shadows-xs: 0 1px 3px rgba(0, 0, 0, 0.025),
    0 1px 2px rgba(0, 0, 0, 0.05);
  --expo-theme-shadows-sm: 0 3px 6px rgba(0, 0, 0, 0.08),
    0 2px 4px rgba(0, 0, 0, 0.07);
  --expo-theme-shadows-md: 0 10px 20px rgba(0, 0, 0, 0.1),
    0 3px 6px rgba(0, 0, 0, 0.05);
  --expo-theme-shadows-lg: 0 15px 25px rgba(0, 0, 0, 0.12),
    0 5px 10px rgba(0, 0, 0, 0.05);
  --expo-theme-shadows-xl: 0 20px 40px rgba(0, 0, 0, 0.15);

}

.dark-theme {
  color-scheme: dark;

  /* Backgrounds */
  --expo-theme-background-default: var(--slate-1);
  --expo-theme-background-screen: #0C0D0E;
  --expo-theme-background-subtle: var(--slate-2);
  --expo-theme-background-element: var(--slate-3);
  --expo-theme-background-hover: var(--slate-4);
  --expo-theme-background-selected: var(--slate-5);
  --expo-theme-background-overlay: var(--slate-2);
  --expo-theme-background-success: var(--green-3);
  --expo-theme-background-warning: var(--amber-3);
  --expo-theme-background-danger: var(--red-3);
  --expo-theme-background-info: var(--blue-3);
  --expo-theme-background-preview: var(--purple-3);

  /* Icons */
  --expo-theme-icon-default: var(--slate-11);
  --expo-theme-icon-secondary: var(--slate-10);
  --expo-theme-icon-tertiary: var(--slate-9);
  --expo-theme-icon-quaternary: var(--slate-8);
  --expo-theme-icon-success: var(--green-10);
  --expo-theme-icon-warning: var(--amber-11);
  --expo-theme-icon-danger: var(--red-10);
  --expo-theme-icon-info: var(--blue-10);
  --expo-theme-icon-preview: var(--purple-10);

  /* Text */
  --expo-theme-text-default: var(--slate-12);
  --expo-theme-text-secondary: var(--slate-11);
  --expo-theme-text-tertiary: var(--slate-10);
  --expo-theme-text-quaternary: var(--slate-9);
  --expo-theme-text-link: var(--blue-11);
  --expo-theme-text-success: var(--green-11);
  --expo-theme-text-warning: var(--amber-11);
  --expo-theme-text-danger: var(--red-11);
  --expo-theme-text-info: var(--blue-11);
  --expo-theme-text-preview: var(--purple-11);

  /* Borders */
  --expo-theme-border-default: var(--slate-6);
  --expo-theme-border-secondary: var(--slate-5);
  --expo-theme-border-success: var(--green-7);
  --expo-theme-border-warning: var(--amber-7);
  --expo-theme-border-danger: var(--red-7);
  --expo-theme-border-info: var(--blue-7);
  --expo-theme-border-preview: var(--purple-7);

  /* Buttons */
  --expo-theme-button-primary-background: var(--expo-color-white);
  --expo-theme-button-primary-border: transparent;
  --expo-theme-button-primary-hover: hsl(from var(--expo-color-white) h s calc(l - 20));
  --expo-theme-button-primary-icon: var(--slate-1);
  --expo-theme-button-primary-text: var(--slate-1);
  --expo-theme-button-primary-disabled-background: var(--slate-11);
  --expo-theme-button-primary-disabled-border: transparent;
  --expo-theme-button-primary-disabled-text: var(--slate-1);

  --expo-theme-button-secondary-background: var(--slate-3);
  --expo-theme-button-secondary-border: transparent;
  --expo-theme-button-secondary-hover: var(--slate-5);
  --expo-theme-button-secondary-icon: var(--slate-12);
  --expo-theme-button-secondary-text: var(--expo-color-white);
  --expo-theme-button-secondary-disabled-background: var(--slate-2);
  --expo-theme-button-secondary-disabled-border: transparent;
  --expo-theme-button-secondary-disabled-text: var(--slate-11);

  --expo-theme-button-tertiary-background: transparent;
  --expo-theme-button-tertiary-border: var(--slate-5);
  --expo-theme-button-tertiary-hover: var(--slate-4);
  --expo-theme-button-tertiary-icon: var(--slate-12);
  --expo-theme-button-tertiary-text: var(--expo-color-white);
  --expo-theme-button-tertiary-disabled-background: transparent;
  --expo-theme-button-tertiary-disabled-border: var(--slate-7);
  --expo-theme-button-tertiary-disabled-text: var(--slate-11);


  --expo-theme-button-quaternary-background: transparent;
  --expo-theme-button-quaternary-border: transparent;
  --expo-theme-button-quaternary-hover: var(--slate-3);
  --expo-theme-button-quaternary-icon: var(--slate-12);
  --expo-theme-button-quaternary-text: var(--expo-color-white);
  --expo-theme-button-quaternary-disabled-background: transparent;
  --expo-theme-button-quaternary-disabled-border: transparent;
  --expo-theme-button-quaternary-disabled-text: var(--slate-11);

  --expo-theme-button-primary-destructive-background: hsl(from var(--red-8) h calc(s + 15) calc(l - 10));
  --expo-theme-button-primary-destructive-border: transparent;
  --expo-theme-button-primary-destructive-hover: hsl(from var(--red-7) h calc(s + 15) calc(l - 10));
  --expo-theme-button-primary-destructive-icon: var(--red-12);
  --expo-theme-button-primary-destructive-text: var(--expo-color-white);
  --expo-theme-button-primary-destructive-disabled-background: var(--red-6);
  --expo-theme-button-primary-destructive-disabled-border: transparent;
  --expo-theme-button-primary-destructive-disabled-text: var(--red-12);

  --expo-theme-button-secondary-destructive-background: var(--red-3);
  --expo-theme-button-secondary-destructive-border: var(--red-7);
  --expo-theme-button-secondary-destructive-hover: hsl(from var(--red-2) h calc(s + 15) l);
  --expo-theme-button-secondary-destructive-icon: var(--red-9);
  --expo-theme-button-secondary-destructive-text: var(--red-11);
  --expo-theme-button-secondary-destructive-disabled-background: var(--red-2);
  --expo-theme-button-secondary-destructive-disabled-border: var(--red-6);
  --expo-theme-button-secondary-destructive-disabled-text: var(--red-10);

  --expo-theme-button-tertiary-destructive-background: transparent;
  --expo-theme-button-tertiary-destructive-border: transparent;
  --expo-theme-button-tertiary-destructive-hover: var(--red-3);
  --expo-theme-button-tertiary-destructive-icon: var(--red-10);
  --expo-theme-button-tertiary-destructive-text: var(--red-11);
  --expo-theme-button-tertiary-destructive-disabled-background: transparent;
  --expo-theme-button-tertiary-destructive-disabled-border: transparent;
  --expo-theme-button-tertiary-destructive-disabled-text: var(--red-9);

  /* Dark shadows */
  --expo-theme-shadows-none: 0 0 transparent;
  --expo-theme-shadows-xs: 0 1px 3px rgba(0, 0, 0, 0.3),
    0 1px 2px rgba(0, 0, 0, 0.3);
  --expo-theme-shadows-sm: 0 3px 6px rgba(0, 0, 0, 0.4),
    0 2px 4px rgba(0, 0, 0, 0.25);
  --expo-theme-shadows-md: 0 10px 20px rgba(0, 0, 0, 0.25),
    0 3px 6px rgba(0, 0, 0, 0.25);
  --expo-theme-shadows-lg: 0 15px 25px rgba(0, 0, 0, 0.5),
    0 5px 10px rgba(0, 0, 0, 0.25);
  --expo-theme-shadows-xl: 0 20px 40px rgba(0, 0, 0, 0.5);
}