:root{
  --color-950:  #000000; 
  --color-900:  #1d1c1c; 
  --color-800:  #111111;
  --color-700:  #1A1A1A;
  --color-600:  #262626;
  --color-500:  #333333;
  --color-400:  #4D4D4D;
  --color-300:  #666666;
  --color-200:  #808080;
  --color-100:  #999999;
  --color-50: #f5f5f5;
}
.red-theme {
  --color-950:  #2B0000;
  --color-900:  #400000;
  --color-800:  #660000;
  --color-700:  #800000;
  --color-600:  #A00000;
  --color-500:  #C40000;
  --color-400:  #E01010;
  --color-300:  #F24A4A;
  --color-200:  #F9A3A3;
  --color-100:  #fafafa;
  --color-50: #d7dfe0;
}
.green-theme{
  --color-950:  #052E16;
  --color-900:  #093019;
  --color-800:  #084C24;
  --color-700:  #0B6B32;
  --color-600:  #0E8A40;
  --color-500:  #12A84E;
  --color-400:  #2DC76B;
  --color-300:  #0E8A40;
  --color-200:  #8FF3AD;
  --color-100:  #C4FCD1;
  --color-50: #EAFEEB;
} 
.blue-theme {
  --color-950:  #011e38;
  --color-900:  #04203A;
  --color-800:  #063051;
  --color-700:  #0A4A73;
  --color-600:  #0E6696;
  --color-500:  #1382B9;
  --color-400:  #1A9EDF;
  --color-300:  #4CB5F5;
  --color-200:  #82D2FB;
  --color-100:  #BAEFFF;
  --color-50: #d7dfe0;
}
.pink-theme {
  --color-950:  #330016;
  --color-900:  #4A0020;
  --color-800:  #66002B;
  --color-700:  #80003D;
  --color-600:  #B0005A;
  --color-500:  #D63384;
  --color-400:  #E65C9C;
  --color-300:  #F08BB6;
  --color-200:  #F8BED3;
  --color-100:  #FFE6EE;
  --color-50: #d7dfe0;
}
.brown-theme {
  --color-950:  #2B1B0E;
  --color-900:  #3B2613;
  --color-800:  #4B3117;
  --color-700:  #5C3D1C;
  --color-600:  #7A5222;
  --color-500:  #99662C;
  --color-400:  #B97B38;
  --color-300:  #D89A55;
  --color-200:  #EBCB8B;
  --color-100:  #F6EBD0;
  --color-50: #faf6ed;
}

:root{
  --control-radius: 8px;
  --base-color: var(--color-900);
  --container-color: var(--color-800);
  --surface-color:var(--color-700);
  --border-color: var(--color-700);
  --disabled-color: var(--color-500);
  --muted-color: var(--color-400);
  --primary-color: var(--color-50);
  --heading-color: var(--color-100);
  --link-color: var(--color-100);
  --active-link-color: var(--color-300);
  --p-tabs-active-bar-background: var(--color-800);
  --p-tabs-tab-active-border-color: var(--color-800);
  --p-tabs-tab-active-background: var(--color-800);
}