@import './fonts.css';

/* src/Theme.css*/
:root {
  --primary-color: #31598B;
  --secondary-color: #31A9C3;
  --primary-color-30: rgb(49, 89, 139, 0.3);
  --secondary-color-30: rgb(49, 169, 195, 0.3);
  --text-color: #1B4B62;
  --secondary-text-color: #1B4B62;
  --third-text-color: #777777;
  --text-color-onColor: #ffffff;
  --background-color: #ffffff;
  --background-color-solid: #e9e9e9;
  --card-color: #F6F7F9;
  --panel-color: #f0f3f7;
  --secondary-panel-color: #ffffff;
  --tab-color: #D9F1FB;
  --secondary-card-color: #ffffff;
  --font-family: Inter, sans-serif;
  --font-size: 16px;
  --border-color: #050505;
  --secondary-border-color: #a3a3a3;
  --footer-top: #304050;
  --footer-middle: #45586B;
  --footer-bottom: #304050;
  --heading-muted: #1B4B62;

  --card-color-1: #FEE2E2;
  /* soft red */
  --card-color-2: #FEF3C7;
  /* warm yellow */
  --card-color-3: #DCFCE7;
  /* light green */
  --card-color-4: #DBEAFE;
  /* light blue */
  --card-color-5: #EDE9FE;
  /* soft purple */
  --card-color-6: #FFE4E6;
  /* rose */
  --card-color-7: #FFEDD5;
  /* orange */
  --card-color-8: #D1FAE5;
  /* teal */
  --card-color-9: #E0E7FF;
  /* indigo */
  --card-color-10: #F3F4F6;
  /* neutral gray */
}

[data-theme='dark'] {
  --primary-color: #293545;
  --secondary-color: #2b8a9f;
  --primary-color-30: rgb(41, 53, 69, 0.3);
  --secondary-color-30: rgb(43, 138, 159, 0.3);
  --text-color: #b0b2b6;
  --text-color-onColor: #f3f6fa;
  --secondary-text-color: #e7e7e7;
  --third-text-color: #afafaf;
  --background-color: #171c27;
  --background-color-solid: #232834;
  --card-color: #363b47;
  --panel-color: #50575f;
  --secondary-panel-color: #36393f;
  --tab-color: #3f474b;
  --secondary-card-color: #ffffff;
  --font-family: Inter, sans-serif;
  --font-size: 16px;
  --border-color: #f0f3f7;
  --secondary-border-color: #838383;
  --footer-top: #1e2933;
  --footer-middle: #2a3541;
  --footer-bottom: #1b232c;
  --heading-muted: #346d88;
}