@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Roboto:wght@400;500;700&display=swap");

:root {
  /* color */

  --fnt-clr1: #050f24;
  --active-td: #00c260;
  --inactive-td: #b41616;

  /* background-color */
  --sidebar-inner-bg: #28a745;
  --sidebar-ul-inner-bg: #41406c;
  --text-color01: #fff;
  --active-nav-sub: #35ba5b;
  --nav-bg: #374241;
  --nab-bg: rgba(255, 255, 255);
  --main-bg: #f2f2f2;
  --btn-prmry: #28a745;
  /* --btn-prmry: linear-gradient(90.23deg, #62B363 0.2%, #48A24B 99.8%); */
  --loader-bg: rgba(255, 255, 255, 0.5);
  --card-usr-bg: aliceblue;
  --slctd-nav: #eaeaea;
  --kanban-bg1: #6c757d;
  --kanban-bg2: #007bff;
  --kanban-bg3: #17a2b8;
  --kanban-bg4: #28a745;
  --sidebr-bg: #2a3f54;
  --card1-bg: #f1befe;
  --card2-bg: #97a5d4;
  --card3-bg: #ffca46;
  --card4-bg: #e59e7e;
  --card5-bg: #c5e2c4;
  --card6-bg: #d4d4d4;

  /* border */
  --nav-border: #d9e0e6;
  /* hover */
  --btn-prmry-hvr: #00c1a2;
  --sidebr-hovr: #64748b;
  --sidebr-drpdwm: rgb(255, 255, 255);
}

.primary-lg {
  border-radius: 10px;
  background-color: var(--btn-prmry);
  border: none;
  padding: 10px 20px;
  color: var(--main-bg);
}
.tablet-btn {
  border-radius: 30px;
  background-color: var(--btn-prmry);
  border: none;
  padding: 10px 20px;
  color: var(--main-bg);
}
.edge-btn {
  border-radius: 0px;
  background-color: var(--btn-prmry);
  border: none;
  padding: 10px 20px;
  color: var(--main-bg);
}
.bordr-btn {
  border: 1px solid var(--btn-prmry);
  padding: 10px 20px;
  color: var(--btn-prmry);
}
/* animation */