:root {
  --bodycolor: #FFFFFF;
  --textcolor: #000000;
  --textcolorlight: #4A4A4A;
  --themecolor: #ff4f00;
  --themecolordark: #8b2e02;
  --themelight: rgba(255,79,0, 0.33);
  --tabscolor: #696969;
  --footercolor: #F3F3F3;
  --bordercolor: #D1D1D1;
  --borderdark: #A9A9A9;
  --grayborder: #AEAEAE;
  --inputborder: #D1D1D1;
  --placeholder: #C8C8C8;
  --borderlight: #D1D1D1;
  --blackcolor: #000000;
  --darkcolor: #1B1A1F;
  --blacklight: #141414;
  --darkborder: #A9A9A9;
  --redcolor: #DC4453;
  --orangecolor: #FD7E14;
  --whitecolor: #FFFFFF;
  --white94: rgba(255, 255, 255, 0.94);
  --disabledcolor: #B7B7B7;
  --activebgColor: #F3F3F3;
  --lightgraybg: #F7F7F7;
  --lightgreen: #EAFBEC;
  --tableHeadingTr: #F3F3F3;
  --darkGreyBg: #CBCBCB;
  --categorycolor: #2B2A2F;
  --bodylightcolor: #FFFFFF;
  --themeextralight: rgba(255,79,0 / 13%);
  --white:#FFFFFF;
}

.dark-mode {
  --bodycolor: #1B1A1F;
  --textcolor: #BBBABC;
  --textcolorlight: #C7C7C7;
  --themecolor: #ff4f00;
  --themecolordark: #8b2e02;
  --themelight: rgba(255,79,0, 0.33);
  --tabscolor: #696969;
  --footercolor: #000000;
  --bordercolor: #525157;
  --borderdark: #D9D9D9;
  --grayborder: #AEAEAE;
  --inputborder: #525157;
  --placeholder: #C8C8C8;
  --borderlight: #525157;
  --blackcolor: #FFFFFF;
  --darkcolor: #FFFFFF;
  --blacklight: #141414;
  --darkborder: #C7C7C7;
  --redcolor: #DC4453;
  --orangecolor: #FD7E14;
  --whitecolor: #000000;
  --white94: rgba(0, 0, 0, 0.94);
  --disabledcolor: #B7B7B7;
  --activebgColor: #000000;
  --lightgraybg: #000000;
  --lightgreen: #EAFBEC;
  --tableHeadingTr: #141414;
  --darkGreyBg: #CBCBCB;
  --categorycolor: #2B2A2F;
  --bodylightcolor: #27262A;
  --themeextralight: rgba(255,79,0 / 13%);
  --white:#FFFFFF;
}

  .ready-to-trade{
    background-color: var(--themecolor);
  
  }

.ready-to-trade h2,p{
    color:var(--white)
}

  .ready-to-trade a:first-child{
   background-color: var(--activebgColor);
   color:var(--blackcolor)
  }
  
  .ready-to-trade a:nth-child(2){
    background-color: var(--blackcolor);
    color:var(--themecolor)
  }

  .ready-to-trade a:nth-child(2):hover, .ready-to-trade a:first-child:hover{
    background-color: var(--lightgreen);
    animation: shake 0.5s ease; /* Apply the animation */
    color:var(--themecolor)
}

@keyframes shake {
  0% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  50% { transform: translateX(5px); }
  75% { transform: translateX(-5px); }
  100% { transform: translateX(0); }
}