: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;
}

  .trading-world-content p{
    color:var(--textcolor)
  }
.trading-world-displayer{
  background-color:var(--bodylightcolor) ;
}

.trading-world-displayer h5,i{
  color:var(--themecolor)
}

.trading-world-displayer p{
  color:var(--blackcolor)
}

.trading-word-item-inner-content{
  background-color: var(--bodylightcolor)
}

.trading-word-item-inner-content:hover{
 
  transform: translateX(40px);
  background-color: var(--themecolor);
}




.trading-word-item-inner-content h2,.trading-word-item-inner-content i{
  color:var(--blackcolor);
}


/* Initially hide all content */
.tab-pane {
  display: none;

}

/* Show content when it has the 'show' class */
.tab-pane.show {
  display: block;
  border-style: solid;
  border-width: 0 0 2px 0; /* Set bottom border width */
  border-image: linear-gradient(to right, var(--themecolor),  transparent); /* Gradient converted to image */
  border-image-slice: 10; /* Adjust this value as needed */
  
}


/* Specific styles for each content */
/* Initially hide all content */
#content-1,
#content-2,
#content-3,
#content-4 {
  transition: opacity 0.5s ease, max-height 0.5s ease;
  opacity: 0;
  visibility: hidden;
  max-height: 0;
}

/* Show content when it has the 'show' class */
#content-1.show,
#content-2.show,
#content-3.show,
#content-4.show {
  opacity: 1;
  visibility: visible;
  max-height: 1000px;
  max-height: auto; /* Adjust this value to fit the content */
}




.faqs-sec .faqs-sec-content {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease, visibility 0.5s ease, max-height 0.5s ease;
  max-height: 0;
  overflow: hidden;
}

/* Specific styles for each faq-viewer-content pair */
#faq-viewer-1:hover + #content-1,
#content-1:hover {
  opacity: 1;
  visibility: visible;
  max-height: 1000px; /* Adjust this value to fit the content */
}

#faq-viewer-2:hover + #content-2,
#content-2:hover {
  opacity: 1;
  visibility: visible;
  max-height: 1000px; /* Adjust this value to fit the content */
}

#faq-viewer-3:hover + #content-3,
#content-3:hover {
  opacity: 1;
  visibility: visible;
  max-height: 1000px; /* Adjust this value to fit the content */
}

#faq-viewer-4:hover + #content-4,
#content-4:hover {
  opacity: 1;
  visibility: visible;
  max-height: 1000px; /* Adjust this value to fit the content */
}



.faqs-sec .faqs-sec-bg{
  background-color: rgba(255,79,0, 0.33)!important;
}
.faqs-sec  .faqs-sec-faq-viewer h2{
  color:var(--darkcolor);
}

.faqs-sec  .faqs-sec-faq-viewer p{
  color: var(--textcolor);
}
p{
  color:var(--blackcolor) !important
}
.faqs-sec  .faqs-sec-faq-viewer i{
  color: var(--themecolor);
}

.faqs-sec .faqs-sec-content .faqs-sec-content-1{
  color: var(--textcolor);
}
.faqs-sec .faqs-sec-content .faqs-sec-content-2{
  color: var(--themecolor);
  font-family: 'Montserrat' !important;
}

.faqs-second-content h1{
  color: var(--darkcolor);
  letter-spacing: 1px;
}

.faqs-second-content span{
  color: var(--themecolor);
}

.faqs-second-content p{
  color: var(--textcolor);
}

.faqs-second-content a{
  font-weight: 700 !important;
  color: var(--white);
  background-color: var(--themecolor);
  letter-spacing: 1px;
}

.faqs-sec-content .faqs-sec-member{
  background-color: var(--themecolor);
  color: var(--blackcolor);
}

.faqs-second-content a {
  /* Define the initial state */
  transition: color 0.3s ease;
}

.faqs-second-content a:hover {
  /* Define the hover state */
  background-color: var(--themecolordark);
  color: var(--white);
  animation: shake 0.5s ease; /* Apply the animation */
}

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

.faqs-second-content .border{
  border-right: 1px solid var(--themecolor);
  margin-left: 5px;
  margin-right: 6px;
}

.faqs-second-content .tags{
  color: var(--blackcolor);
}