/* .single_chart{
    width: 100%; height:75vh; box-shadow: rgba(0, 0, 0, 0.25) 10px 10px 17px 11px;
   } */
.chart_container{
    display: flex;
    justify-content: space-between;
    /* padding: 1em;
    background: #101828; */
    flex-wrap: wrap;
}

.chart_div_and_heading{
    width: 48%;

}

       
.single_chart {
  width: 100%;
  height: 50vh;       /* default for desktop */
  min-height: 300px;  /* ensures visibility on small mobiles */
  max-height: 750px;  /* prevents overly tall charts on big screens */
  border-radius: 10px;
}

.text_div_container{
   display: flex;
   justify-content: center;
   background: #1e2939;

}

.text_container{
  width: 70%; 
  padding: 1em;
}


.head_straddle_chart{

    border-radius: 11px 13px 0px 0px;
    border: 0.1px solid #ffffff12;
    padding: 5px;

}








@media (max-width: 1200px) {
  .single_chart {
   width: 100%;
  }
  .chart_div_and_heading{
    width: 100%;
    margin-bottom: 1em;

}

}
@media (max-width: 768px) {
  .single_chart {
    height: 55vh;      /* shrink on tablets/mobiles */
    max-height: 450px;
  }
  
}

@media (max-width: 480px) {
  .single_chart {
    height: 45vh;
    max-height: 350px;
  }

  .text_container{
  width: 85%; 
  padding: 1em;
}

  /* .chart_div_and_heading{
    width: 100%;
    margin-bottom: 1em;
} */


}





.bgcolor{

    background: #2d2d2d;
}

.head_text{
    color: #ffffffc9;
    font-family: sans-serif;
    letter-spacing: 0.5px;
}
.strike_sel_inp{
    text-align: center;
    background: #1e1e1e;
    color: white;
}

.header_cont{
    height: 20vh;
}




.multiple_inputs{
   background: #101828; padding: 1em; border-top: 1px solid #ffffff26; display: flex; justify-content: center; gap: 1rem;
}



/* 
    color: white;
    font-family: sans-serif;
    text-align: center;
    background: #031227;
    padding: 10px;
} */