@import "tailwindcss";

:root {
  --primary: #41644A;
  --primaryLight: #ffffff;
  --primaryLight2: #4b7455;
  --primaryLight3: #dae9de;
  --dashBoardBg: #ffffff;
  --mainViewBg: #edeaeb;
  --highlightBg1: #edeaeb;
  --menuTextCol: #98a0a8;
  --menuTextColActive: #41644A;
  --menuBgColActive: #edeaeb;
  --menuTextHoverCol: #e7e7e7; 
  
  --greyTextCol: #98a0a8;
  --lightGreyCol: #e1e1e1;
  --compBgCol: #ffffff; 

  --avatarBgCol: #41644A;
  --avatarTextCol: #ffffff;


  --profileMenuModalBg: #ffffff;
  --profileMenuModalTextCol: #98a0a8;
  --profileMenuModalTextColActive: #2d2d2d;
  --profileMenuModalBgColActive: #edeaeb;



  --sendForSignTextCol: #ffffff;
  --sendForSignBgCol: #d02f56;
  
  --sendForSignDropDownText: #000000;
  --sendForSignDropDownBg: #ffffff;
  --sendForSignDropDownHover: #e7e7e7;


  --loaderBg: #ffffff;

  --modalBg: #ffffff;

  --hideModalBg: #2d2d2d;

  --processStepOneTextHead: #000000;

  --modalSubmitBG:#1919d7;
  --modalSubmitBGHover:#395ee1;
}


/* Sortable CSS */
.sortable-ghost {
  opacity: 0.5;
  transform: scale(1.05);
  transition: all 0.3s;
}

.dropped-item {
  touch-action: none;
}

canvas {
  touch-action: none;
  -ms-touch-action: none; /* For older IE/Edge */
  pointer-events: auto;
}

@keyframes textColorChange {
  0%, 100% {
    color: white;
  }
  50% {
    color: #41644A; /* Tailwind blue-500 */
  }
}
.animate-text {
  animation: textColorChange 2s infinite ease-in-out;
}

@layer utilities {
      /* Hide scrollbar for Chrome, Safari and Opera */
      .no-scrollbar::-webkit-scrollbar {
          display: none;
      }
     /* Hide scrollbar for IE, Edge and Firefox */
      .no-scrollbar {
          -ms-overflow-style: none;  /* IE and Edge */
          scrollbar-width: none;  /* Firefox */
    }
  }




  /* Loader CSS */