:root{
  --portfolio-table-dark: #deae74e3;
  --portfolio-table-light: #eed6b9;
  --strategy-table-dark: #B42476e3;
  --strategy-table-light: #F1BAD9;
}
body{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: #f7fffd;
}
body *{
    font-family: Roboto;
    line-height: 1.5;
}
.spacer{
    flex-grow: 1;
}
.heading::after{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    content: ' ';
    /* header backgrounds */
    background: -moz-radial-gradient(0% 2%, circle, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), -moz-radial-gradient(100% 100%, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), none;
    background: -webkit-radial-gradient(0% 2%, circle, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), -webkit-radial-gradient(100% 100%, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), none;
    background: -ms-radial-gradient(0% 2%, circle, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), -ms-radial-gradient(100% 100%, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), none;
    background: -o-radial-gradient(0% 2%, circle, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), -o-radial-gradient(100% 100%, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), none;
    background: radial-gradient(0% 2%, circle, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), radial-gradient(100% 100%, rgba(96, 16, 48, 0) 9px, #661133 10px, rgba(96, 16, 48, 0) 11px), none;
    background-size: 20px 20px;
}
.heading.color1{
    background-image: linear-gradient(180deg, #0cc2c4, #0cc2c4ba, #0cc2c4);
    color: #fff;
    box-shadow: inset 0 0 20px 16px #1c6263;
}
.heading.color2{
    background-image: linear-gradient(180deg, #ff8f00, #ff8f00ba, #ff8f00);
    color: #fff;
    box-shadow: inset 0 0 20px 16px #945d17;
}
.disabled{
    filter: blur(1px) opacity(0.5);
}
#filter_wr,#filter_wr .days{
    margin: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
#filter_wr .days div.selected{
    color: #fff;
    background: #66c2db;
    background-color: rgb(0 14 128 / 15%);
    background-image: linear-gradient(155deg, #66c2db, rgba(255, 255, 255, 0));
    box-shadow: inset 2px 2px 7px 1px #66c2db;
    padding: 0 26px;
}
#filter_wr .days div{
    margin: 0 5px;
    width: 40px;
    height: 44px;
    color: #333;
    background: #fff;
    border: 1px solid #66c2db;
    border-radius: 4px;
    text-transform: capitalize;
    user-select: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 26px;
}
#data_summary_wr{
    padding: 16px;
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    /*justify-content: space-evenly;*/
}

.watermark2:before{
    color: #ffff!important;
    color: #3c1e1e!important;
}

.watermark:before {
    content: 'backinzo.com';
    position: absolute;
    z-index: 999;
    padding: 1px 3px;
    right: 2px;
    top: -10px;
    font-size: 10px;
    filter: opacity(0.35);
    background: white;
    -moz-transform-origin: 100% 100%;
    -o-transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -webkit-transform: rotate(-90deg);
}

#data_summary_wr .card.red{
    color: red;
    border-color: #ef9a99;
}
#data_summary_wr .card.red ._title{
    color: red;
    border-color: #ef9a99;
    background-color: #fbebee;
    background-image: linear-gradient(180deg, rgb(255 173 167), rgba(255, 255, 255, 0));
}
#data_summary_wr .card{
    position: relative;
    padding: 10px;
    height: 100%;
    border-color: green;
    text-align: center;
    border-style: none;
    background:transparent;
}
#data_summary_wr .card > div{
    border: 1px solid;
    border-radius: 10px;
    border-color: inherit;
    overflow: hidden;
    position: relative;
    box-shadow: 3px 3px 10px 0px #cacaca;
}
#data_summary_wr .card ._title{
    padding: 5px;
    border-bottom: 1px solid;
    border-radius: 4px 4px 0 0;
    color: green;
    background-color: rgba(0, 128, 0, 0.15);
    background-image: linear-gradient(180deg, rgb(82 209 74), rgba(255, 255, 255, 0));
}
#data_summary_wr .card ._value{
    padding: 10px 5px;
}

#data_graph_wr{
    margin: 16px 0 30px;
}
#data_table_wr{
    padding: 4px;
}
#data_table_wr .data_table{
    margin: 20px 0 0 0;
    position: relative;
    /* box-shadow: 6px 8px 13px 0px #838383; */
    border-radius: 8px;
    overflow: hidden;
}
#data_table_wr .data_table .heading{
    position: relative;
    display: flex;
    justify-content: center;
    text-align: center;
    color: white;
    border: 1px solid #dddddd;
    font-weight: bolder;
}
#data_table_wr .data_table .heading .check{
    margin: auto;
    padding: 0 10px 0 30px;
}
#data_table_wr .data_table .heading .check input:checked:before{
    background-color:green;
    background-image: linear-gradient(135deg, #8BB0C2 0%, #FFF 100%);
    border-color: #85A9BB #92C2DA #92C2DA #85A9BB;
}
#data_table_wr .data_table .heading .title{
    position: relative;
    flex-grow: 1;
    padding: 10px;
}
#summary_breakup_wr .data_table .heading .title, #strategy_breakup_wr .data_table .heading .title {
    position: relative;
    flex-grow: 1;
    padding: 10px;
    text-align: center;
}
#summary_breakup_wr .accordion-button div, #strategy_breakup_wr .accordion-button div{
  width: 100%;
  text-align: center;
  color: white;
  padding: 2px; //So that logo shows complete in the accordions headers
}
#data_table_wr .data_table ._data{
    overflow-x: auto;
}
table{
    width: 100%;
    font-family: arial, sans-serif;
    border-collapse: collapse;
	overflow: auto;
}
th,tr,td{
    border: 1px solid #dddddd;
    padding: 15px 8px;
    font-size: 13px;
    text-align: center !important;
    vertical-align: inherit !important;
    text-transform: capitalize;
}
th{
    background-color: #efefef !important;
}
td{
    background: #fff;
}
tr:first-child{

}
#data_table_wr .data_table ._data tr{}
#data_table_wr .data_table ._data td{}
input[type=checkbox]{
    border: 2px solid #a565db;
}

#data_monthly_breakup_wr,#data_weekly_breakup_wr,#summary_breakup_wr, #strategy_breakup_wr, #data_charge_summary_wr{
    position: relative;
    border: 0px solid #a565db;
    border-radius: 10px;
    overflow: hidden;
    margin: 16px 10px;
    box-shadow: 6px 8px 13px 0px #d1bce3;
}
#data_monthly_breakup_wr th,#data_monthly_breakup_wr td{
    border: 1px solid #a565db;
}
#data_weekly_breakup_wr th,#data_weekly_breakup_wr td{
    border: 1px solid #65d6db;
}

#data_charge_summary_wr th,#data_charge_summary_wr td{
    border: 1px solid #65d6db;
}

#data_monthly_breakup_wr .heading,#data_weekly_breakup_wr .heading,#data_charge_summary_wr .heading{
    text-align: center;
    color: white;
    padding: 15px;
    font-weight: bolder;
    background-image: linear-gradient(180deg, rgb(174 116 222 / 89%), rgb(224 210 243));
}
#data_weekly_breakup_wr .heading{
    background-image: linear-gradient(180deg, #0c9399e3, #58bfc4);
}
#data_charge_summary_wr .heading{
    background-image: linear-gradient(180deg, #0c9399e3, #082098);
}
/* Added by Ajay */

.bold{
  font-weight: bolder;
}
.negative_col{
  color:red
}
.positive_col{
  color:rgb(82 209 74)
}


#summary_breakup_wr th,#summary_breakup_wr td{
    border: 1px solid var(--portfolio-table-dark);
}
#strategy_breakup_wr th,#strategy_breakup_wr td{
    border: 1px solid var(--strategy-table-dark);
}

#summary_breakup_wr .heading{
    background-image: linear-gradient(180deg, var(--portfolio-table-dark), var(--portfolio-table-light));
}
#strategy_breakup_wr .heading{
    background-image: linear-gradient(180deg, var(--strategy-table-dark), var(--strategy-table-light));
}
.floating-tooltip-2 {
    width: 96px;
    height: 80px;
    position: absolute;
    display: none;
    padding: 8px;
    box-sizing: border-box;
    font-size: 12px;
    color: #131722;
    background-color: rgba(255, 255, 255, 1);
    text-align: left;
    z-index: 1000;
    top: 12px;
    left: 12px;
    pointer-events: none;
    border: 1px solid rgba(0, 150, 136, 1);
    border-radius: 2px;
}

/* Style the tab */
.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    display: flex;
    justify-content: space-evenly;
}

/* Style the buttons inside the tab */
.tab button {
    flex-grow: 1;
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    transition: 0.3s;
    font-size: 15px;
    color: white;
    border-radius: 10px 10px 0 0;
    background-image: linear-gradient(180deg, #8e214f,#fe3086e3);
    background-image: linear-gradient(180deg, #1b5763,#5ed3ea);
}

/* Change background color of buttons on hover */
.tab button:hover {
    font-size: 17px;
    font-weight: bolder;
    background-image: linear-gradient(180deg, #a1496ee3, #fe3086e3);
    background-image: linear-gradient(180deg, #2692a8, #5ed3ea);
}

/* Create an active/current tablink class */
.tab button.active {
    font-size: 17px;
    font-weight: bolder;
    background-image: linear-gradient(180deg, #fe3086e3, #8e214f);
    background-image: linear-gradient(180deg, #5ed3ea, #1b5763);
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
    position: relative;
}

.accordion {
    --bs-accordion-bg: unset;
}
.accordion-button {
    color: unset;
    cursor: pointer;
}
.accordion-button:not(.collapsed) {
    background-color: unset;
    color: unset;
}
.accordion-button::after {
    background-color: white;
    border-radius: 8px;
}

.red{
    color: #dc3545;
}
.green{
    color: #28a745;
}
._data tr td:nth-child(2) {
    font-weight: bold;
}

#Slippages:focus-visible{
    outline: unset;
}
/* Made by Ajay */
#refresh{
  display: flex;
  justify-content: center;
  align-items: center;
}
#refresh-icon{
  margin: 0 5px;
  width: 40px;
  height: 44px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 26px;
  transition: all .1s ease-in-out;

}
#refresh-icon:hover{
  transform: scale(1.1);

}
#data_weekly_breakup_wr .heading::before,
#data_monthly_breakup_wr .heading::before,
#summary_breakup_wr .heading::before,
#strategy_breakup_wr .heading::before{
  content: '';
  background:url('Backinzo72.png');
  position: absolute;
  top:10px;
  left:10px;
  width: 130px;
  height:36px;
  background-size: cover;
}