@tailwind base;
@tailwind components;
@tailwind utilities;

html,
body {
  @apply bg-bg-primary;
}

.max-h-alert-dialog {
  max-height: calc(90vh - 120px);
}

.focus-ring-shadow-xs-skeuomorphic:focus {
  box-shadow: 0px 0px 0px 1px rgba(10, 13, 18, 0.18) inset, 0px -2px 0px 0px rgba(10, 13, 18, 0.05) inset, 0px 1px 2px 0px rgba(10, 13, 18, 0.05), 0px 0px 0px 2px #FFF, 0px 0px 0px 4px #3A43FF;
}

.ring-shadow-xs-skeuomorphic {
  box-shadow: 0px 0px 0px 1px rgba(10, 13, 18, 0.18) inset, 0px -2px 0px 0px rgba(10, 13, 18, 0.05) inset, 0px 1px 2px 0px rgba(10, 13, 18, 0.05), 0px 0px 0px 2px #FFF, 0px 0px 0px 4px #3A43FF;
}

.focus.ring-shadow-error:focus {
  box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 4px #F04438;
}

.ring-shadow-error {
  box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 4px #F04438;
}

.outline-sucess-outer {
  border-radius: 999px;
  border: 2px solid var(--Colors-Foreground-fg-success-primary, #47CD89);
  opacity: 0.1;
}

.outline-error-outer {
  border-radius: 24px;
  border: 2px solid var(--Colors-Foreground-fg-error-primary, #F97066);
  opacity: 0.1;
}

.outline-error-inter {
  border-radius: 24px;
  border: 2px solid var(--Colors-Foreground-fg-error-primary, #F97066);
  opacity: 0.3;
}

.outline-sucess-inter {
  border-radius: 999px;
  border: 2px solid var(--Colors-Foreground-fg-success-primary, #47CD89);
  opacity: 0.3;
}



@layer base {
  :root {
    /* Cores Bases */
    --white: #fff;
    --black: #000;
    --gray-25: #fdfdfd;
    --gray-50: #fafafa;
    --gray-100: #f5f5f5;
    --gray-200: #e9eaeb;
    --gray-300: #d5d7da;
    --gray-400: #a4a7ae;
    --gray-500: #717680;
    --gray-600: #535862;
    --gray-700: #414651;
    --gray-800: #252b37;
    --gray-900: #181d27;
    --gray-950: #0a0d12;
    --brand-25: #f5f7ff;
    --brand-50: #f0f3ff;
    --brand-100: #e4e9ff;
    --brand-200: #cdd6ff;
    --brand-300: #a5b2ff;
    --brand-400: #7280ff;
    --brand-500: #3a43ff;
    --brand-600: #1612ff;
    --brand-700: #0101ff;
    --brand-800: #0000cc;
    --brand-900: #0202b0;
    --brand-950: #000778;
    --error-25: #fffbfa;
    --error-50: #fef3f2;
    --error-100: #fee4e2;
    --error-200: #fecdca;
    --error-300: #fda29b;
    --error-400: #f97066;
    --error-500: #f04438;
    --error-600: #d92d20;
    --error-700: #b42318;
    --error-800: #912018;
    --error-900: #7a271a;
    --error-950: #55160c;
    --warning-25: #fffcf5;
    --warning-50: #fffaeb;
    --warning-100: #fef0c7;
    --warning-200: #fedf89;
    --warning-300: #fec84b;
    --warning-400: #fdb022;
    --warning-500: #f79009;
    --warning-600: #dc6803;
    --warning-700: #b54708;
    --warning-800: #93370d;
    --warning-900: #7a2e0e;
    --warning-950: #4e1d09;
    --success-25: #f6fef9;
    --success-50: #ecfdf3;
    --success-100: #dcfae6;
    --success-200: #abefc6;
    --success-300: #75e0a7;
    --success-400: #47cd89;
    --success-500: #17b26a;
    --success-600: #079455;
    --success-700: #067647;
    --success-800: #085d3a;
    --success-900: #074d31;
    --success-950: #053321;
    --gray-blue-25: #fcfcfd;
    --gray-blue-50: #f8f9fc;
    --gray-blue-100: #eaecf5;
    --gray-blue-200: #d5d9eb;
    --gray-blue-300: #b3b8db;
    --gray-blue-400: #717bbc;
    --gray-blue-500: #4e5ba6;
    --gray-blue-600: #3e4784;
    --gray-blue-700: #363f72;
    --gray-blue-800: #293056;
    --gray-blue-900: #101323;
    --gray-blue-950: #0d0f1c;
    --gray-cool-25: #fcfcfd;
    --gray-cool-50: #f9f9fb;
    --gray-cool-100: #eff1f5;
    --gray-cool-200: #dcdfea;
    --gray-cool-300: #b9c0d4;
    --gray-cool-400: #7d89b0;
    --gray-cool-500: #5d6b98;
    --gray-cool-600: #4a5578;
    --gray-cool-700: #404968;
    --gray-cool-800: #30374f;
    --gray-cool-900: #111322;
    --gray-cool-950: #0e101b;
    --gray-modern-25: #fcfcfd;
    --gray-modern-50: #f8fafc;
    --gray-modern-100: #eef2f6;
    --gray-modern-200: #e3e8ef;
    --gray-modern-300: #cdd5df;
    --gray-modern-400: #9aa4b2;
    --gray-modern-500: #697586;
    --gray-modern-600: #4b5565;
    --gray-modern-700: #364152;
    --gray-modern-800: #202939;
    --gray-modern-900: #121926;
    --gray-modern-950: #0d121c;
    --gray-neutral-25: #fcfcfd;
    --gray-neutral-50: #f9fafb;     
    --gray-neutral-100: #f3f4f6;
    --gray-neutral-200: #e5e7eb;
    --gray-neutral-300: #d2d6db;
    --gray-neutral-400: #9da4ae;
    --gray-neutral-500: #6c737f;
    --gray-neutral-600: #4d5761;
    --gray-neutral-700: #384250;      
    --gray-neutral-800: #1f2a37;
    --gray-neutral-900: #111927;
    --gray-neutral-950: #0d121c;
    --gray-iron-25: #fcfcfc;
    --gray-iron-50: #fafafa;
    --gray-iron-100: #f4f4f5;
    --gray-iron-200: #e4e4e7;      
    --gray-iron-300: #d1d1d6;
    --gray-iron-400: #a0a0ab;
    --gray-iron-500: #70707b;
    --gray-iron-600: #51525c;
    --gray-iron-700: #3f3f46;
    --gray-iron-800: #26272b;
    --gray-iron-900: #1a1a1e;
    --gray-iron-950: #131316;
    --gray-true-25: #fcfcfc;
    --gray-true-50: #f7f7f7;
    --gray-true-100: #f5f5f5;
    --gray-true-200: #e5e5e5;
    --gray-true-300: #d6d6d6;
    --gray-true-400: #a3a3a3;
    --gray-true-500: #737373;
    --gray-true-600: #525252;
    --gray-true-700: #424242;
    --gray-true-800: #292929;
    --gray-true-900: #141414;
    --gray-true-950: #0f0f0f;
    --gray-warm-25: #fdfdfc;
    --gray-warm-50: #fafaf9;
    --gray-warm-100: #f5f5f4;
    --gray-warm-200: #e7e5e4;
    --gray-warm-300: #d7d3d0;
    --gray-warm-400: #a9a29d;
    --gray-warm-500: #79716b;
    --gray-warm-600: #57534e;
    --gray-warm-700: #44403c;
    --gray-warm-800: #292524;
    --gray-warm-900: #1c1917;
    --gray-warm-950: #171412;
    --moss-25: #fafdf7;
    --moss-50: #f5fbee;
    --moss-100: #e6f4d7;
    --moss-200: #ceeab0;
    --moss-300: #acdc79;
    --moss-400: #86cb3c;
    --moss-500: #669f2a;
    --moss-600: #4f7a21;
    --moss-700: #3f621a;
    --moss-800: #335015;
    --moss-900: #2b4212;
    --moss-950: #1a280b;
    --green-mode-25: #fafef5;
    --green-mode-50: #f3fee7;
    --green-mode-100: #e3fbcc;
    --green-mode-200: #d0f8ab;
    --green-mode-300: #a6ef67;
    --green-mode-400: #85e13a;
    --green-mode-500: #66c61c;
    --green-mode-600: #4ca30d;
    --green-mode-700: #3b7c0f;
    --green-mode-800: #326212;
    --green-mode-900: #2b5314;
    --green-mode-950: #15290a;
    --green-25: #f6fef9;
    --green-50: #edfcf2;
    --green-100: #d3f8df;
    --green-200: #aaf0c4;
    --green-300: #73e2a3;
    --green-400: #3ccb7f;
    --green-500: #16b364;
    --green-600: #099250;
    --green-700: #087443;
    --green-800: #095c37;
    --green-900: #084c2e;
    --green-950: #052e1c;
    --teal-25: #f6fefc;
    --teal-50: #f0fdf9;
    --teal-100: #ccfbef;
    --teal-200: #99f6e0;
    --teal-300: #5fe9d0;
    --teal-400: #2ed3b7;
    --teal-500: #15b79e;
    --teal-600: #0e9384;
    --teal-700: #107569;
    --teal-800: #125d56;
    --teal-900: #134e48;
    --teal-950: #0a2926;
    --cyan-25: #f5feff;
    --cyan-50: #ecfdff;
    --cyan-100: #cff9fe;
    --cyan-200: #a5f0fc;
    --cyan-300: #67e3f9;
    --cyan-400: #22ccee;
    --cyan-500: #06aed4;
    --cyan-600: #088ab2;
    --cyan-700: #0e7090;
    --cyan-800: #155b75;
    --cyan-900: #164c63;      
    --cyan-950: #0d2d3a;
    --blue-mode-25: #f5fbff;
    --blue-mode-50: #f0f9ff;
    --blue-mode-100: #e0f2fe;
    --blue-mode-200: #b9e6fe;
    --blue-mode-300: #7cd4fd;
    --blue-mode-400: #36bffa;
    --blue-mode-500: #0ba5ec;
    --blue-mode-600: #0086c9;
    --blue-mode-700: #026aa2;
    --blue-mode-800: #065986;
    --blue-mode-900: #0b4a6f;
    --blue-mode-950: #062c41;
    --blue-25: #f5faff;
    --blue-50: #eff8ff;
    --blue-100: #d1e9ff;
    --blue-200: #b2ddff;
    --blue-300: #84caff;
    --blue-400: #53b1fd;
    --blue-500: #2e90fa;
    --blue-600: #1570ef;
    --blue-700: #175cd3;
    --blue-800: #1849a9;
    --blue-900: #194185;
    --blue-950: #102a56;
    --indigo-25: #f5f8ff;
    --indigo-50: #eef4ff;
    --indigo-100: #e0eaff;
    --indigo-200: #c7d7fe;
    --indigo-300: #a4bcfd;
    --indigo-400: #8098f9;
    --indigo-500: #6172f3;
    --indigo-600: #444ce7;
    --indigo-700: #3538cd;
    --indigo-800: #2d31a6;
    --indigo-900: #2d3282;
    --indigo-950: #1f235b;
    --violet-25: #fbfaff;
    --violet-50: #f5f3ff;
    --violet-100: #ece9fe;
    --violet-200: #ddd6fe;
    --violet-300: #c3b5fd;
    --violet-400: #a48afb;
    --violet-500: #875bf7;
    --violet-600: #7839ee;
    --violet-700: #6927da;
    --violet-800: #5720b7;
    --violet-900: #491c96;
    --violet-950: #2e125e;
    --purple-25: #fafaff;
    --purple-50: #f4f3ff;
    --purple-100: #ebe9fe;
    --purple-200: #d9d6fe;
    --purple-300: #bdb4fe;
    --purple-400: #9b8afb;
    --purple-500: #7a5af8;
    --purple-600: #6938ef;
    --purple-700: #5925dc;
    --purple-800: #4a1fb8;
    --purple-900: #3e1c96;
    --purple-950: #27115f;
    --fuchsia-25: #fefaff;
    --fuchsia-50: #fdf4ff;
    --fuchsia-100: #fbe8ff;
    --fuchsia-200: #f6d0fe;
    --fuchsia-300: #eeaafd;
    --fuchsia-400: #e478fa;
    --fuchsia-500: #d444f1;
    --fuchsia-600: #ba24d5;
    --fuchsia-700: #9f1ab1;
    --fuchsia-800: #821890;
    --fuchsia-900: #6f1877;
    --fuchsia-950: #47104c;
    --pink-25: #fef6fb;
    --pink-50: #fdf2fa;
    --pink-100: #fce7f6;
    --pink-200: #fcceee;
    --pink-300: #faa7e0;
    --pink-400: #f670c7;
    --pink-500: #ee46bc;
    --pink-600: #dd2590;
    --pink-700: #c11574;
    --pink-800: #9e165f;
    --pink-900: #851651;
    --pink-950: #4e0d30;
    --rose-25: #fff5f6;
    --rose-50: #fff1f3;
    --rose-100: #ffe4e8;
    --rose-200: #fecdd6;      
    --rose-300: #fea3b4;
    --rose-400: #fd6f8e;
    --rose-500: #f63d68;
    --rose-600: #e31b54;
    --rose-700: #c01048;
    --rose-800: #a11043;
    --rose-900: #89123e;      
    --rose-950: #510b24;
    --orange-25: #fefaf5;
    --orange-50: #fef6ee;
    --orange-100: #fdead7;
    --orange-200: #f9dbaf;
    --orange-300: #f7b27a;
    --orange-400: #f38744;
    --orange-500: #ef6820;
    --orange-600: #e04f16;
    --orange-700: #b93815;
    --orange-800: #932f19;
    --orange-900: #772917;
    --orange-950: #511c10;
    --yellow-25: #fefdf0;
    --yellow-50: #fefbe8;
    --yellow-100: #fef7c3;
    --yellow-200: #feee95;
    --yellow-300: #fde272;
    --yellow-400: #fac515;
    --yellow-500: #eaaa08;
    --yellow-600: #ca8504;
    --yellow-700: #a15c07;
    --yellow-800: #854a0e;
    --yellow-900: #713b12;      
    --yellow-950: #542c0d;


    /* Dinamicas Textos */
    --text-primary: var(--gray-900);
    --text-primary_on-brand: var(--white);
    --text-secondary: var(--gray-700);
    --text-secondary_hover: var(--gray-800);
    --text-secondary_on-brand: var(--gray-200);
    --text-tertiary: var(--gray-600);
    --text-tertiary_hover: var(--gray-700);
    --text-tertiary_on-brand: var(--gray-200);
    --text-quaternary: var(--gray-500);
    --text-quaternary_on-brand: var(--brand-300);
    --text-white: var(--white);
    --text-disabled: var(--gray-500);
    --text-placeholder: var(--gray-500);
    --text-placeholder_subtle: var(--gray-300);
    --text-brand-primary: var(--brand-900);
    --text-brand-secondary: var(--brand-700);
    --text-brand-tertiary: var(--brand-600);
    --text-brand-tertiary_alt: var(--brand-600);
    --text-error-primary: var(--error-600);
    --text-warning-primary: var(--warning-600);
    --text-success-primary: var(--success-600);
   


    /* Dinamicas Borders */
    --border-primary: var(--gray-300);
    --border-secondary: var(--gray-200);
    --border-tertiary: var(--gray-100);
    --border-disabled: var(--gray-300);
    --border-disabled_subtle: var(--gray-200);
    --border-brand: var(--brand-500);
    --border-brand_alt: var(--brand-600);
    --border-error: var(--error-500);
    --border-error_subtle: var(--error-300);

      /* Button */
    --button-primary-fg: var(--white);
    --button-primary-fg_hover: var(--white);
    --button-primary-bg: var(--brand-600);
    --button-primary-bg_hover: var(--brand-700);
    --button-secondary-fg: var(--gray-700);
    --button-secondary-fg_hover: var(--gray-800);
    --button-secondary-bg: var(--white);
    --button-secondary-bg_hover: var(--gray-50);
    --button-secondary-border: var(--gray-300);
    --button-secondary-border_hover: var(--gray-300);
    --button-secondary-color-fg: var(--brand-700);
    --button-secondary-color-fg_hover: var(--brand-800);
    --button-secondary-color-bg: var(--white);
    --button-secondary-color-bg_hover: var(--brand-50);
    --button-secondary-color-border: var(--brand-300);
    --button-secondary-color-border_hover: var(--brand-300);
    --button-tertiary-fg: var(--gray-600);
    --button-tertiary-fg_hover: var(--gray-700);
    --button-tertiary-bg_hover: var(--gray-50);
    --button-tertiary-color-fg: var(--brand-700);
    --button-tertiary-color-fg_hover: var(--brand-800);
    --button-tertiary-color-bg_hover: var(--brand-50);
    --button-primary-error-fg: var(--white);
    --button-primary-error-fg_hover: var(--white);
    --button-primary-error-bg: var(--error-600);
    --button-primary-error-bg_hover: var(--error-700);
    --button-secondary-error-fg: var(--error-700);
    --button-secondary-error-fg_hover: var(--error-800);
    --button-secondary-error-bg: var(--white);
    --button-secondary-error-bg_hover: var(--error-50);
    --button-secondary-error-border: var(--error-300);
    --button-secondary-error-border_hover: var(--error-300);
    --button-tertiary-error-fg: var(--error-700);
    --button-tertiary-error-fg_hover: var(--error-800);
    --button-tertiary-error-bg_hover: var(--error-50);

    /* Dinamicas Foreground */
    --fg-primary: var(--gray-900);
    --fg-secondary: var(--gray-700);
    --fg-secondary_hover: var(--gray-800);
    --fg-tertiary: var(--gray-600);
    --fg-tertiary_hover: var(--gray-700);
    --fg-quaternary: var(--gray-500);
    --fg-quaternary_hover: var(--gray-600);
    --fg-quinary: var(--gray-400);
    --fg-quinary_hover: var(--gray-500);
    --fg-senary: var(--gray-300);
    --fg-white: var(--white);
    --fg-disabled: var(--gray-400);
    --fg-disabled_subtle: var(--gray-300);
    --fg-brand-primary: var(--brand-600);
    --fg-brand-primary_alt: var(--brand-600);
    --fg-brand-secondary: var(--brand-500);
    --fg-error-primary: var(--error-400);
    --fg-error-secondary: var(--error-500);
    --fg-warning-primary: var(--warning-500);
    --fg-warning-secondary: var(--warning-600);
    --fg-success-primary: var(--success-400);
    --fg-success-secondary: var(--success-500);

    /* Dinamicas Backgrounds */
    --bg-primary: var(--white);
    --bg-primary_alt: var(--white);
    --bg-primary_hover: var(--gray-50);
    --bg-primary-solid: var(--gray-950);
    --bg-secondary: var(--gray-50);
    --bg-secondary_alt: var(--gray-50);
    --bg-secondary_hover: var(--gray-100);
    --bg-secondary_subtle: var(--gray-25);
    --bg-secondary-solid: var(--gray-600);
    --bg-tertiary: var(--gray-100);
    --bg-quaternary: var(--gray-200);
    --bg-active: var(--gray-50);
    --bg-disabled: var(--gray-100);
    --bg-disabled_subtle: var(--gray-50);
    --bg-overlay: var(--gray-950);
    --bg-brand-primary: var(--brand-50);
    --bg-brand-primary_alt: var(--brand-50);
    --bg-brand-secondary: var(--brand-100);
    --bg-brand-solid: var(--brand-600);
    --bg-brand-solid_hover: var(--brand-700);
    --bg-brand-section: var(--brand-800);
    --bg-brand-section_subtle: var(--brand-700);
    --bg-error-primary: var(--error-50);
    --bg-error-secondary: var(--error-100);
    --bg-error-solid: var(--error-600);
    --bg-warning-primary: var(--warning-50);
    --bg-warning-secondary: var(--warning-100);
    --bg-warning-solid: var(--warning-600);
    --bg-success-primary: var(--success-50);
    --bg-success-secondary: var(--success-100);
    --bg-success-solid: var(--success-600);


    /* Shad Cn */
    --background: 0 0% 100%;
    --foreground: 0 0% 3.9%;
    --card: 0 0% 100%;
    --card-foreground: 0 0% 3.9%;
    --popover: 0 0% 100%;
    --popover-foreground: 0 0% 3.9%;
    --primary: 0 0% 9%;
    --primary-foreground: 0 0% 98%;
    --secondary: 0 0% 96.1%;
    --secondary-foreground: 0 0% 9%;
    --muted: 0 0% 96.1%;
    --muted-foreground: 0 0% 45.1%;
    --accent: 0 0% 96.1%;
    --accent-foreground: 0 0% 9%;
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 0 0% 98%;
    --border: 0 0% 89.8%;
    --input: 0 0% 89.8%;
    --ring: 0 0% 3.9%;
    --chart-1: 12 76% 61%;
    --chart-2: 173 58% 39%;
    --chart-3: 197 37% 24%;
    --chart-4: 43 74% 66%;
    --chart-5: 27 87% 67%;
    --radius: 0.5rem;
  }

  .dark,
  :root[class~="dark"] {

    /* Cores Bases */
    --blue-mode-25: #f5f8ff;
    --blue-mode-50: #eff4ff;
    --blue-mode-100: #d1e0ff;
    --blue-mode-200: #b2ccff;
    --blue-mode-300: #84adff;
    --blue-mode-400: #528bff;
    --blue-mode-500: #2970ff;
    --blue-mode-600: #155eef;
    --blue-mode-700: #004eeb;
    --blue-mode-800: #0040c1;
    --blue-mode-900: #00359e;
    --blue-mode-950: #002266;
    --orange-mode-25: #fff9f5;      
    --orange-mode-50: #fff4ed;
    --orange-mode-100: #ffe6d5;
    --orange-mode-200: #ffd6ae;
    --orange-mode-300: #ff9c66;
    --orange-mode-400: #ff692e;
    --orange-mode-500: #ff4405;
    --orange-mode-600: #e62e05;
    --orange-mode-700: #bc1b06;
    --orange-mode-800: #97180c;
    --orange-mode-900: #771a0d;
    --orange-mode-950: #57130a;


    /* Dinamicas texto */
    --text-primary: var(--gray-50);
    --text-primary_on-brand: var(--gray-50);
    --text-secondary: var(--gray-300);
    --text-secondary_hover: var(--gray-200);
    --text-secondary_on-brand: var(--gray-300);
    --text-tertiary: var(--gray-400);
    --text-tertiary_hover: var(--gray-300);
    --text-tertiary_on-brand: var(--gray-400);
    --text-quaternary: var(--gray-400);
    --text-quaternary_on-brand: var(--gray-400);
    --text-white: var(--white);
    --text-disabled: var(--gray-500);
    --text-placeholder: var(--gray-500);
    --text-placeholder_subtle: var(--gray-700);
    --text-brand-primary: var(--gray-50);
    --text-brand-secondary: var(--gray-300);
    --text-brand-tertiary: var(--gray-400);
    --text-brand-tertiary_alt: var(--gray-50);
    --text-error-primary: var(--error-400);
    --text-warning-primary: var(--warning-400);
    --text-success-primary: var(--success-400);

    /* Button */
    --button-primary-fg: var(--white);
    --button-primary-fg_hover: var(--white);
    --button-primary-bg: var(--brand-600);
    --button-primary-bg_hover: var(--brand-700);
    --button-secondary-fg: var(--gray-300);
    --button-secondary-fg_hover: var(--gray-100);
    --button-secondary-bg: var(--gray-900);
    --button-secondary-bg_hover: var(--gray-800);
    --button-secondary-border: var(--gray-700);
    --button-secondary-border_hover: var(--gray-700);
    --button-secondary-color-fg: var(--gray-300);
    --button-secondary-color-fg_hover: var(--gray-100);
    --button-secondary-color-bg: var(--gray-900);
    --button-secondary-color-bg_hover: var(--gray-800);
    --button-secondary-color-border: var(--gray-700);
    --button-secondary-color-border_hover: var(--gray-700);
    --button-tertiary-fg: var(--gray-400);
    --button-tertiary-fg_hover: var(--gray-200);
    --button-tertiary-bg_hover: var(--gray-800);
    --button-tertiary-color-fg: var(--gray-300);
    --button-tertiary-color-fg_hover: var(--gray-100);
    --button-tertiary-color-bg_hover: var(--gray-800);
    --button-primary-error-fg: var(--white);
    --button-primary-error-fg_hover: var(--white);
    --button-primary-error-bg: var(--error-600);
    --button-primary-error-bg_hover: var(--error-700);
    --button-secondary-error-fg: var(--error-200);
    --button-secondary-error-fg_hover: var(--error-100);
    --button-secondary-error-bg: var(--error-950);
    --button-secondary-error-bg_hover: var(--error-900);
    --button-secondary-error-border: var(--error-800);
    --button-secondary-error-border_hover: var(--error-700);
    --button-tertiary-error-fg: var(--error-300);
    --button-tertiary-error-fg_hover: var(--error-200);
    --button-tertiary-error-bg_hover: var(--error-900);

    /* Dinamicas Border */
    --border-primary: var(--gray-700);
    --border-secondary: var(--gray-800);
    --border-tertiary: var(--gray-800);
    --border-disabled: var(--gray-700);
    --border-disabled_subtle: var(--gray-800);
    --border-brand: var(--brand-400);
    --border-brand_alt: var(--gray-700);
    --border-error: var(--error-400);
    --border-error_subtle: var(--error-400);

    /* Dinamicas Foreground */
    --fg-primary: var(--white);
    --fg-secondary: var(--gray-300);
    --fg-secondary_hover: var(--gray-200);
    --fg-tertiary: var(--gray-400);
    --fg-tertiary_hover: var(--gray-300);
    --fg-quaternary: var(--gray-400);
    --fg-quaternary_hover: var(--gray-300);
    --fg-quinary: var(--gray-500);
    --fg-quinary_hover: var(--gray-400);
    --fg-senary: var(--gray-600);
    --fg-white: var(--white);
    --fg-disabled: var(--gray-500);
    --fg-disabled_subtle: var(--gray-600);
    --fg-brand-primary: var(--brand-500);
    --fg-brand-primary_alt: var(--gray-300);
    --fg-brand-secondary: var(--brand-500);
    --fg-error-primary: var(--error-300);
    --fg-error-secondary: var(--error-400);
    --fg-warning-primary: var(--warning-400);
    --fg-warning-secondary: var(--warning-500);
    --fg-success-primary: var(--success-300);
    --fg-success-secondary: var(--success-400);

    /* Dinamicas Backgrounds */
    --bg-primary: var(--gray-950);
    --bg-primary_alt: var(--bg-secondary);
    --bg-primary_hover: var(--gray-800);
    --bg-primary-solid: var(--bg-secondary);
    --bg-secondary: var(--gray-900);
    --bg-secondary_alt: var(--bg-primary);
    --bg-secondary_hover: var(--gray-800);
    --bg-secondary_subtle: var(--gray-900);
    --bg-secondary-solid: var(--gray-600);
    --bg-tertiary: var(--gray-800);
    --bg-quaternary: var(--gray-700);
    --bg-active: var(--gray-800);
    --bg-disabled: var(--gray-800);
    --bg-disabled_subtle: var(--gray-900);
    --bg-overlay: var(--gray-800);
    --bg-brand-primary: var(--brand-500);
    --bg-brand-primary_alt: var(--bg-secondary);
    --bg-brand-secondary: var(--brand-600);
    --bg-brand-solid: var(--brand-600);
    --bg-brand-solid_hover: var(--brand-500);
    --bg-brand-section: var(--bg-secondary);
    --bg-brand-section_subtle: var(--bg-primary);
    --bg-error-primary: var(--error-500);
    --bg-error-secondary: var(--error-600);
    --bg-error-solid: var(--error-600);
    --bg-warning-primary: var(--warning-500);
    --bg-warning-secondary: var(--warning-600);
    --bg-warning-solid: var(--warning-600);
    --bg-success-primary: var(--success-500);
    --bg-success-secondary: var(--success-600);
    --bg-success-solid: var(--success-600);
  }

  /* Shad Cn */
  .dark {
    --background: 0 0% 3.9%;
    --foreground: 0 0% 98%;
    --card: 0 0% 3.9%;
    --card-foreground: 0 0% 98%;
    --popover: 0 0% 3.9%;
    --popover-foreground: 0 0% 98%;
    --primary: 0 0% 98%;
    --primary-foreground: 0 0% 9%;
    --secondary: 0 0% 14.9%;
    --secondary-foreground: 0 0% 98%;
    --muted: 0 0% 14.9%;
    --muted-foreground: 0 0% 63.9%;
    --accent: 0 0% 14.9%;
    --accent-foreground: 0 0% 98%;
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 0 0% 98%;
    --border: 0 0% 14.9%;
    --input: 0 0% 14.9%;
    --ring: 0 0% 83.1%;
    --chart-1: 220 70% 50%;
    --chart-2: 160 60% 45%;
    --chart-3: 30 80% 55%;
    --chart-4: 280 65% 60%;
    --chart-5: 340 75% 55%;
  }
}


@layer base {
  * {
    @apply border-border;
  }
  body {
    @apply bg-background text-foreground;
  }
}