/*VARIABILI*/

/*IMPORTA CSS*/
@import url("var.css");
@import url("menu.css");
@import url("header.css");
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');
html,body{height:100%;font-family:"poppins",sans-serif}
h4{font-weight: 600;}
/*HTML: Generico*/
div.left_menu{width: 11.25rem;position:fixed;left:0;height:100%;}
div.body_container{padding-left:11.25rem;}
.text-black{color:#222;font-weight: 600;}
.input-search:focus,.btn.btn-primary:focus{box-shadow:var(--input-shadow);}
.btn-primary:hover,.btn.btn-primary:focus{background-color:#222;}
.filtri_rec .active{border:none;}
.filtri_rec {border: 1px solid #eee;border-radius: 45px;font-size:16px;}
.filtri_rec{display: block;width:100%;}
.filtri_rec:after{content:" ";display:block;clear: both;}
.filtri_rec li{float:left;width:33.333333%;text-align: center;}
ul.filtri_rec{padding-left: 0;}
.filtri_rec li {font-weight: 500;padding: 10px 18px;border: 0;border-bottom: 0;border-radius: 3rem;list-style: none;}
.filtri_rec span {color: #969ba0;}
.filtri_rec li{cursor:pointer;}
.filtri_rec li.active, .filtri_rec li:hover{color:#fff;background:var(--color);}
.filtri_rec li.active span, .filtri_rec li:hover span{color:#fff;}
.filter_icon {position: absolute;left: -15px;}
.card {margin-bottom: 1.875rem;background-color: #fff;transition: all .5s ease-in-out;position: relative;border: 0 solid transparent;border-radius: 1.75rem;box-shadow: 0 5px 5px 0 rgb(82 63 105 / 5%);height: calc(100% - 30px);padding:20px;}
/*HTML: scroll bar*/
/* width */
::-webkit-scrollbar {width: 5px;}
/* Track */
::-webkit-scrollbar-track {background: #f1f1f1;}
/* Handle */
::-webkit-scrollbar-thumb {background: #888;}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {background: #555;}
/*BODY: Generico*/
.content_body{background:var(--bk_body);width:100%;height:100%;}
.content_fluid{padding-top: 20px;padding-right: 40px;padding-left: 40px;background:var(--bk_body)}
.btn-primary{background:var(--color);border-color:var(--color);}
.btn {padding: .938rem 2.5rem;border-radius: 45px;font-weight: 400;font-size: 1.2rem;}
/*DASH: filtri*/
.title_container{margin-bottom:1.5rem;}
.title_container h1{text-transform:capitalize;font-size:35px;font-weight: 600;font-family: 'Poppins', sans-serif;color:#222;}
.filter_period,.filter_stock{position:relative;color:#fff;cursor:pointer; /* padding: .5rem 2.5rem; */ font-weight: 400;font-size: 1rem;}
.filter_period .row,.filter_stock .row{height:62px;background:var(--color);border-radius:45px;-moz-border-radius:45px;-webkit-border-radius:45px;/* padding:1rem; */}
.filter_period .row:hover,.filter_stock .row:hover{background: #222;color:#fff;}
.filter_period svg,.filter_stock svg{width:20px;height:20px;}
.filter_period p,.filter_stock p{font-size: 20px;margin:0;font-weight: 500;margin: 0 -1rem 0 0;}
.filterarea,.stockarea{overflow-y:hidden;display:none;position: absolute;width:278;height:288;background: #fff;position: absolute;top: 100%;right: 100%;margin:10px -200px 0 0;z-index: 1000;min-width: 10rem;padding:0;font-size: .875rem;color: #969ba0;text-align: left;list-style: none;background-clip: padding-box;border: 1px solid rgba(0,0,0,.15);border-radius: .75rem;box-shadow: var(--shadow-elevation-medium);}
.filterarea .filterarea_container,.stockarea .filterarea_container{/* overflow-y: scroll; */height:288px;}
ul.filter_list{padding:0;}
.filter_list li{padding:10 0;cursor:pointer;width:100%;margin:auto;list-style: none;font-size: 30px;color:#222;font-weight: 700;text-align: center;display:block;border-bottom: 1px solid rgb(99, 99, 99);}
.filter_list li:hover{background:var(--bk_body);}
.filter_year{text-align: center;}
/*DASH: sommario*/
.boxsummary .card-body{padding:0;}
.sommario .icon svg{width:40px;height:50px;position: absolute;top:40%;left:50%;margin:-20px 0 0 -20px;}
.bi-piggy-bank-fill{color:var(--yellow)}
.bi-currency-exchange{color:var(--blue)}
.bi-credit-card-2-back-fill{color:var(--red)}
.bi-graph-up-arrow{color:var(--green)}
.invoice-num{position:relative;margin-bottom: 20px;font-size:25px;font-weight: 700;}
.invoice-num span{position: absolute;font-size:16px;bottom:-15px;color:#858686;text-transform: capitalize;font-weight: 400;}
.sommario .icon{position:relative;background: var(--bk_body);;border-radius:var(--cerchio);-moz-border-radius:var(--cerchio);-webkit-border-radius:var(--cerchio);width:70px;height:70px;}
p.mb-0.invoice-num1{font-size:14px;}
p.mb-0.invoice-num1 span{font-size: var(--bs-body-font-size);}
/*DASH: grafici*/
.card.c_casse{padding:20px 10px;}
.card.c_casse .card-body{padding:0;}
.card-header{background:transparent;border: none;}
.currentChart{margin-bottom:30px;}
.chart-content{text-transform: capitalize;color:#a5a3a3;font-weight: 400;font-size:16px;text-align:left;padding: 0 10px;}
.chart-content h5{color:#222;font-weight: 600;font-size:18px;}
div#chart_sommario {margin:0 auto 30px;width:95%;display:block;}
#timelinesaldo .apexcharts-series path{stroke:#4371c9;}
#timelineinvestimenti .apexcharts-series path{stroke:#ff8736;}
#timelinesaldo .apexcharts-marker {fill:#4371c9;}
#timelineinvestimenti .apexcharts-marker{fill:#ff8736;}
#timelinesaldo .apexcharts-tooltip-marker{background-color:#4371c9!important;}
#timelineinvestimenti .apexcharts-tooltip-marker{background-color:#ff8736!important;}
span#tgrafico{text-transform: capitalize;}
/*DASH: ultime transazioni*/
.recent_transaction .card-body,.listholdstock .card-body{height: 500px;overflow-y: scroll;}
.recent_transaction svg{width:60;height:60px;}
.tab-pane .row,.elenco_transazioni .row,.stock.row{font-size:20px;border:1px solid #dfdcdc;border-radius:45px;-moz-border-radius:45px;-webkit-border-radius:45px;padding: 10px;margin:10px 0;transition: all .3s ease-in-out;text-align:center;}
.tab-pane .row:hover,.elenco_transazioni .row:hover,.stock.row:hover{border-color:var(--bk_body);background: var(--bk_body);transition: all .3s ease-in-out;}
.delete svg{cursor:pointer;}
.etichette{border: 2px solid #222;font-size:18px;display:block;padding:5px;color:#222;width: 150px;margin:auto;border-radius: 45px;-moz-border-radius: 45px;-webkit-border-radius: 45px;font-weight: 600;text-transform: capitalize;}
/*ENTRATE/USCITE: casse*/
.elenco_casse{position:relative;width:100%;overflow-x: scroll;overflow-y: unset;height:250px;margin-bottom: 30px;}
.casse_container{background: transparent;position:relative;overflow-y:unset;height:200px;max-width:inherit;}  
.cassa_singola{width:350px;float:left;}
.cassa_bk{padding-left:15px;position: relative;}
.dtotali svg{width:16px;height:16px;}
.row.entrate,.row.uscite{overflow: hidden;}
/* width */
.casse_container::-webkit-scrollbar,.casse_container::-webkit-scrollbar-thumb,.casse_container::-webkit-scrollbar-track  {border-radius: 45px;-moz-border-radius: 45px;-webkit-border-radius: 45px; width: 8px;border: none;background: transparent;}
.casse_container::-webkit-scrollbar-track {background-image: url("/img/GvV1R30.png");background-repeat: repeat-y;background-size: contain;}    
.elenco_casse::-webkit-scrollbar,.elenco_casse::-webkit-scrollbar-thumb,.elenco_casse::-webkit-scrollbar-track  {border-radius: 45px;-moz-border-radius: 45px;-webkit-border-radius: 45px; width: 8px;height:4px;border: none;background: transparent;}
.elenco_casse::-webkit-scrollbar-track {background:var(--black);background-repeat: repeat-x;background-size:10px;}  
/* Track */
.casse_container::-webkit-scrollbar-button,.casse_container::-webkit-scrollbar-track-piece,.casse_container::-webkit-scrollbar-corner,.casse_container::-webkit-resizer {display: none;}
.elenco_casse::-webkit-scrollbar-button,.elenco_casse::-webkit-scrollbar-track-piece,.elenco_casse::-webkit-scrollbar-corner,.elenco_casse::-webkit-resizer {display: none;}
/* Handle */
.casse_container::-webkit-scrollbar-thumb {width:10px;background: rgb(20, 233, 91);}
.elenco_casse::-webkit-scrollbar-thumb {width:10px;background: rgb(20, 233, 91);}
/* Handle on hover */
.casse_container::-webkit-scrollbar-thumb:hover {background: rgb(20, 233, 91);}
.elenco_casse::-webkit-scrollbar-thumb:hover {background: rgb(20, 233, 91);}
.cassa_bk img{width:100%;border-radius:1.25rem;-moz-border-radius:1.25rem;-webkit-border-radius:1.25rem;}
.cassa_singola .card_info{position: absolute;top:0;width:90%;padding: 40px 5%;}
.cassa_singola span.fs-12{font-size:20px;text-transform: uppercase;font-weight: 700;display: block;margin-top:-10px;}
/*ENTRATE/USCITE: donut*/
.tipi.row{margin: 50px 0 30px;}
.svg-item {width: 100%;font-size: 18px;margin: 0 auto;animation: donutfade 1s;}
.donut-ring {stroke: #e5e5e5;}
.donut-segment {transform-origin: center;}
.donut-segment-1{animation: donut1 3s;}
.donut-segment-2{animation: donut2 3s;}
.donut-segment-3{animation: donut3 3s;}
.donut-segment-4{animation: donut4 3s;}
.donut-segment-5{animation: donut5 3s;}
.donut-segment-6{animation: donut6 3s;}
.donut-segment-7{animation: donut7 3s;}
.donut-segment-8{animation: donut8 3s;}
@keyframes donutfade {0% {opacity: .2;}100% {opacity: 1;}}
@keyframes donutfadelong {0% {opacity: 0;}100% {opacity: 1;}}
.donut-percent {animation: donutfadelong 1s;}
.donut-data {font-size: 0.12em;line-height: 1;transform: translateY(0.5em);text-align: center;text-anchor: middle;color:#666;fill: #666;animation: donutfadelong 1s;}
.donut-text {font-family: Arial, Helvetica, sans-serif;fill: #222;}
.donut-label {font-size: 0.28em;font-weight: 700;line-height: 1;fill: #000;transform: translateY(0.25em);}
.donut-percent {font-size: 0.4em;line-height: 1;transform: translateY(0.5em);font-weight: bold;}
.tipi h5{text-transform: capitalize;}
.tipi span{color:#969ba0;}
/*ADD_TRANSAZIONE:elenco*/
.filtri_tabella input{height: 38px;margin-top: 8px;margin-bottom: 8px;border-radius: 8px;}
.filtri_tabella input:focus{border-color:var(--color);}
.elenco_transazioni .edit{border:none;}
.elenco_transazioni .edit svg{cursor:pointer;color:#ccc;width:20px;height: 20px;}
.elenco_transazioni .edit svg:hover{color:#222;}
.row.tabella_transazioni .card-body {overflow-y: scroll;max-height: 1000px;}
.tabella_transazioni{padding-bottom:50px;display:block;}
.tabella_transazioni svg{width:50px;height:50px;}
/*ADD_TRANSAZIONE: paginazione*/
.paginazione{margin-top:0;display:block;}
span.prev,span.next,span.paginate_button{position:relative;cursor:pointer;color:var(--color);border-radius: 45px;padding: 0 25px;line-height: 50px;display: inline-block;font-size: 18px;height: 50px;transition: all .5s ease-in-out;}
span.prev,span.next{border:1px solid var(--color);margin: 0 10px;}
span.paginate_button{background: var(--bk_color);margin: 5;}
.dataTables_info{text-align: left;}
.dataTables_paginate{text-align: right;}
span.paginate_button.current,span.paginate_button:hover,span.prev:hover,span.next:hover{background:var(--color);color:#fff;transition: all .5s ease-in-out;}
span.paginate_button span{position:absolute;width:50px;height:50px;left:50%;top:50%;margin:-25px 0 0 -25px;text-align: center;}
/*ADD_TRANSAZIONE:input per aggiungere nuova transazione*/
.add_transazione.card{min-height:250px;height:auto;padding-top:2rem;}
.add_remove{display:block;margin-top:50px;position: relative;}
.add_remove svg{cursor:pointer; width:60px; height:60px;color:var(--color);position: absolute;left:50%;top:50%;margin:-20px 0 0 -30px;}
.add_remove svg:hover{color:#222;}
.transazione_container svg,.list_casse svg,.list_entrate svg,.list_uscite svg,.removerule svg{width:40px;height:40px;color:var(--color);cursor:pointer;}
.transazione_container .row{margin-bottom:20px;position: relative;}
.deltrans{position:static;}
.transazione_container select{text-transform: capitalize;}
.op{transition: all .5s ease-in-out;display:block;position:absolute;background: var(--bk_body);padding: .375rem .75rem;font-size: 1rem;font-weight: 800;color: #212529;border-radius: .25rem;cursor: pointer;bottom: 0;border: 1px solid #ced4da;border-right: none;}
.op:hover{transition: all .5s ease-in-out;background: var(--bk_body_hover);}
.transazione_container input#importo{text-align:right;}
.salva{padding-top:30px;padding-bottom: 30px;}
.salva button{float:right;margin-top:20px;}
.elenco_transazioni .editable,.elenco_transazioni .editable:hover{background: var(--edit);}
.inputerror{background: var(--bk_color);}
/*PORTFOLIO:elenco dello stock attivo*/
.totale_investimenti h1{font-size:25px;}
.totale_investimenti span svg{width:20px;height:20px;position: relative;bottom:2px;}
.totale_investimenti span{font-size:20px;text-align: left;display:block;position:relative;bottom:15px;}
.totale_investimenti .plus{color:var(--green);}
.totale_investimenti .minus{color:var(--red);}
.status{font-weight:700; background:#000;width:50px;height:50px;border-radius: 200px;-moz-border-radius: 200px;-webkit-border-radius:200px;color:#fff;text-transform: capitalize;text-align: center;font-size:30px;}
.status.l{background:var(--green);}
.status.s{background:var(--red);}
.stock h5{font-size:25px;font-weight: 600;text-transform: uppercase;}
.stock .prezzo,.stock .qty,.stock .totale,.stock .differenza,.stock .differenza_perc{position:relative;}
.stock span,.stock span.campname{font-weight:600;color:#b4b4b4;font-size:12px;display:block;margin-top:-15px;text-transform: capitalize;}
.stock span.campname{margin-top: -6px;width: 100%;text-align: center;}
.stock p{text-align: center;font-weight: 500;font-size:18px;margin:0;}
.differenza_perc p{font-size:14px;}
.liststock,.listholdstock{overflow-y: scroll;height:500px;}
.liststock .menu svg,.listholdstock .menu svg{cursor: pointer;}
.stock.row{position:relative;}
.stock.row .menu,.wmenu,.removerule{position:absolute;top:50%;margin-top:-8px;right:0;}
.menustock,.infostock{overflow:hidden;display:none;position: absolute;width:128;height: 150px;background: #fff;position: absolute;top: 100%;right: 100%;margin:10px -30px 0 0;z-index: 1000;min-width: 10rem;font-size: .875rem;color: #969ba0;text-align: left;list-style: none;background-clip: padding-box;border: 1px solid rgba(0,0,0,.15);border-radius: .75rem;box-shadow: var(--shadow-elevation-medium);}
.menustock ul li,.infostock ul li{cursor:pointer;padding:10px 0;list-style: none;text-align: center;font-size:20px;}
.menustock ul li:hover,.meninfostockustock ul li:hover,.infostock ul li:hover{background: var(--bk_body);}
.menustock ul li:first-child,.infostock ul li:first-child{border-bottom:1px solid #222}
.menustock ul li:last-child,.infostock ul li:last-child{border-top:1px solid #222}
.menustock ul,.infostock ul {padding-left: 0;}
.stock .margine,.stock .commissione{display:none;z-index: 1;}
.extrainfo span.extraspan{margin-top: -7px;cursor: pointer;position: absolute;}
.extrainfo span.extraspan svg{pointer-events: none;width: 12px;transform: rotate(-90deg);-webkit-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transition-duration: 1s;-moz-transition-duration: 0.5s;-o-transition-duration: 0.5s;transition-duration: 0.5s;-webkit-transition-property: -webkit-transform;-moz-transition-property: -moz-transform;-o-transition-property: -o-transform;transition-property: transform;}
.extrainfo span.extraspan svg.active{transform: rotate(0deg);-webkit-transform: rotate(0deg);-ms-transform: rotate(0deg);}
/*PORTFOLIO: grafico stock attivo*/
div#piechart {padding-top: 50px;}
.editrow{background: var(--edit)!important;}
.stock.row .prezzo,.stock.row .buyprice,.stock.row .sellprice{position:relative;}
.stock.row .prezzo span.pprezzo,.stock.row .buyprice span,.stock.row .sellprice span{position: absolute;top:50%;right:0;color:#222;font-size:18px;font-weight: 400;}
.watching .form-wrapper .input-group .input-group-prepend .input-group-text {background: #eee;border: 0;font-size: 20px;font-weight: 500;width: 210px;color: #342e59;height: 75px;border-radius: 3rem;margin-right: -50px;z-index: 1;position: relative;justify-content: space-around;}
.watching .form-group {margin-bottom: 12px;}
.watching .form-wrapper .input-group .form-control {box-shadow:none;font-size: 24px;height: 75px;text-align: right;border-left: 0;z-index: 0;color: #342e59;border-top-right-radius: 3rem;border-bottom-right-radius: 3rem;}
.watching .form-wrapper .input-group .form-control:hover,.watching .form-wrapper .input-group .form-control:focus{border-color:var(--color);}
.rounded {border-radius: 1.75rem!important;}
.btn-success {color: #fff;background-color: #68e365;border-color: #68e365;}
.btn-danger {color: #fff;background-color: #f72b50;border-color: #f72b50;}
/*PORTFOLIO: stock in lista*/
.watch_container{overflow-y: scroll;height:480px;}
.watch_container .instock{width:30px;height:30px;text-align: center;text-transform: uppercase;font-weight: 800;background-color: var(--blue);color:#fff;line-height: 30px;border-radius: var(--cerchio);animation: blinker 1s linear infinite;}
@keyframes blinker {50% {opacity: 0;}}
.watch_container h2{font-size: 1.5rem;}
.watch_stock{position:relative;}
.watching .card-header{padding:20px 0;}
.watching .add_remove{margin-top:0;}
.watching .add_remove svg{position:relative;top:0;}
.watch_stock {cursor:pointer;padding: 15px 20px;border-radius: 15px;margin-right: 0;margin-left: 0;z-index: 1;margin-top:1.5rem;}
.bg-gradient-1{background: var(--sfondo1);}
.bg-gradient-2{background: var(--sfondo2);}
.bg-gradient-3{background: var(--sfondo3);}
.bg-gradient-4{background: var(--sfondo4);}
.bg-gradient-5{background: var(--sfondo5);}
.bg-gradient-6{background: var(--sfondo6);}
.bg-gradient-7{background: var(--sfondo7);}
.bg-gradient-8{background: var(--sfondo8);}
.bg-gradient-9{background: var(--sfondo9);}
.bg-gradient-10{background: var(--sfondo10);}
.watch_stock .openstock{cursor:pointer;position: relative;}
.watch_stock .infostock{overflow: hidden;height:50px;}
.stockname {background:var(--bk_body);border: 1px solid var(--bk_body);border-radius: 45px;padding: 10px 20px;text-align: center;font-size: 25px;font-weight: 700;}
/*PORTFOLIO: whatch list*/
.watch_stock #stockname{text-transform: uppercase;}
.watch_stock h4{text-transform: capitalize;font-size: 1.3rem;}
.buy_stock .stockname span{text-transform: uppercase;}
/*PORTFOLIO: add stock to hold*/
.bstock a.btn{padding:.938rem 2rem;}
/*PORTFOLIO: popup aggiungi stock*/
.add_background{display:none;position:fixed;width:100%;height:100%;top:0;left:0;background: var(--bk_color);z-index: 10;}
.add_popup{position: absolute;width:700px;left:50%;margin-left:-350px;top:10%;background: #fff;padding:1rem 2rem;border-radius:45px;box-shadow: var(--shadow-elevation-medium);}
.presell h3,.presell p{text-align:center;}
.presell h3 span{font-weight:700;text-transform: uppercase;}
/*STAT: titolo con filtri*/
.filter_stock .row{background:#fff;border:1px solid #eee;color:#222;}
.statistic .filter_period,.statistic .filter_stock{padding:0;width:98%;text-align:center;}
ul.filter_list {overflow-y: scroll;height: 288px;}
ul.filter_list li{text-transform: uppercase;}
ul.filter_list span{display:block;color:rgb(151, 151, 151);font-size:20px;margin-top:-15px;text-transform: capitalize;}
.guadagno{width:300px;margin:auto;text-align: center;}
.guadagno:after{content:"Guadagno/Capital Gain";color:#969ba0;font-size:18px;margin-top:-15px;}
p.sscelto{position:relative;/* padding-left:15px; */}
p.sscelto.selected{text-align:center;text-transform: uppercase;font-weight: 700;margin-top:-.4rem;margin-bottom:-.4rem;}
p.sscelto span{font-size:14px;display:block;text-transform: capitalize;font-weight: 400;margin-top:-10px;}
/*STAT: grafico istrogramma negativo*/
.plusloss .filtri_rec li{width:25%;}
#gaintime,#success{width:100%;height:400px;}
/*STAT: grafico tasso di vittoria*/
.leggenda{width:90%;margin:50px auto 0;}
.leggenda ul{padding:0;margin:0;font-size:20px;text-align:center;}
.leggenda ul strong{font-size:25px;margin-left:15px;}
.leggenda ul span{font-weight:400;color:#969ba0;margin-left:2px;text-transform: capitalize;}
.leggenda ul li{list-style: none;float:left;width:50%;text-align: left;}
/*STAT: elenco transazioni*/
.row.titolostat{z-index:3;position:relative;padding:30px 0 0;min-height:65px;border-bottom:2px solid #000;}
.titolostat h5{text-align:center;font-weight: 700;font-size:18px;}
.menustock.liststat{height:100px;}
.liststat .stock span{position:absolute;}
.list_stat_gainloss .stock p,.stock.row .buyprice span, .stock.row .sellprice span{font-size:16px;}
/*IMPOSTAZIONI: profilo*/
.photo_content{margin-bottom:20px;}
.cover_photo{min-height: 250px;width: 100%;background-color: #222};
.profile_info{position:relative;}
.account_img{width:100px;height:100px;border-radius:100%;background: var(--bk_body);margin-left: 20px;margin-top: -50px;}
.profile_info h4{margin-bottom:0px;}
/*IMPOSTAZIONI: dati account*/
.account .card-body p{font-size:20px;padding-top:10px;}
.account .card-body .row{margin-bottom:50px;}
#savea{float:right}
/*IMPOSTAZIONI: movimenti*/
.movimenti .add_remove{margin:10px auto 40px;height:30px;}
.movimenti .add_remove svg{width:80px;height:80px;}
.movimenti .card-body .row{margin:10px 0;}
.getcolor{position:relative;}
.picker,.colorpicker ul div {background: #f6f6f6;cursor:pointer;border:2px solid #222;border-radius: 5px;width: 36px;height: 36px;cursor: pointer;-webkit-transition: all linear .2s;-moz-transition: all linear .2s;-ms-transition: all linear .2s;-o-transition: all linear .2s;transition: all linear .2s;}
.picker:hover,.colorpicker ul div:hover { transform: scale(1.1);z-index:100; }
.colorpicker{display:none;z-index:100;position:absolute;top:150%;left:0;width:210px;height: 250px;background: #fff;border-radius:15px;box-shadow:var(--shadow-elevation-high)}
.colorpicker ul{padding:10px;margin:0;}
.colorpicker ul li{list-style: none;}
.colorpicker ul div{float:left;margin:5px;border-width: 1px;}
/*IMPOSTAZIONI: regole*/
.hidetext{display:none;}
.moreinfo{margin: 25px auto 50px;display: block;}
.form-switch .form-check-input{width: 60px;height: 30px;}
.form-check-label span{float: right;display: block;padding: 6px 0 0 20px;}
.intro_regole .row{margin:20px 0;}
.intro_regole p{font-size:20px;}
.intro_regole input#erules{width:100%;border:none;border-bottom:2px solid var(--color);background: transparent;height:50px;font-size:20px;}
.intro_regole input#erules:focus{background-color: var(--edit);}
.rules .row{margin:20px 0;position:relative;}
.rules .row h5{font-size:16px;}
.regole .add_remove svg{position:relative;}
.regole{padding-bottom:50px;}
.form-check-input:checked{background-color: var(--color);border-color: var(--color);}
.confirm{min-height:70px;padding-top:40px;}
.movimenti #salva{position:absolute;bottom:10px;right:50px;}
.arules{cursor:pointer;}
.updaterules button{float:right;}
/*LOGIN: pagina di accesso*/
.page-content{position:relative;width:100%;height:100%;min-height:100%;background:url("/img/bk_log_tradesapp.webp");background-size: cover;}
.page-content:before{background: var(--bk_login); content:" ";display: block;width: 100%;height:100%;}
.loginform{position: absolute;top:50%;margin-top:-200px;left:0;width:100%;}
.logo img{width:80px;height:80px;}
/*BACKTEST:intro*/
.backtest_intro p{font-size:20px;}
.backtest_intro #drop-zone {transition: all .5s ease-in-out;cursor:pointer;width: 100%;max-width: 600px;height: 200px;border: 2px dashed #ccc;border-radius: 10px;display: flex;align-items: center;justify-content: center;font-size: 20px;color: #aaa;margin: auto;margin-top: 50px;padding: 0 100px;text-align: center;}
.backtest_intro #drop-zone:hover{background-color: #e9e9e9;}
.backtest_intro #drop-zone.dragover {background-color: #f0f8ff;border-color: #333;color: #333;}
.backtest_intro #file-input {display: none;}
.backtest_intro #message{text-align: center;width: 80%;margin: 50px auto;padding: 20px;color: #fff;border-radius: 10px;}
.backtest_intro #message.error{background-color: var(--red);}
.backtest_intro #message.success{background-color: green;}
.backtest_grafico .card{margin-bottom:25px;height:auto;}
.backtest_grafico .invoice-num{font-size:30px;margin-bottom:0;}
.backtest_grafico .card p.mb-0.invoice-num1 span{font-size:20px;}
.backtest_grafico .icon svg{width:40px;height:50px;position: absolute;top:40%;left:50%;margin:-20px 0 0 -20px;}
.backtest_grafico .icon {position: relative;background: var(--bk_body);border-radius: var(--cerchio);-moz-border-radius: var(--cerchio);-webkit-border-radius: var(--cerchio);width: 70px;height: 70px;}


#timelinestock .apexcharts-series path{stroke:var(--color);}
.backtest_intro  #loading-indicator{font-size:50px;text-align: center;}
/*BACKTEST: scelta strategia*/
.body_strategia_anno{width: 600px;margin: auto;}
.backtest_segli_strategia{display:none;}
.body_strategia .checkbox-wrapper *,.setup_strategy .checkbox-wrapper *  {-webkit-tap-highlight-color: transparent;outline: none;margin:50px auto 80px;text-align: center;}
.body_strategia .checkbox-wrapper h4,.setup_strategy .checkbox-wrapper h4{margin-bottom:-30px;}
.body_strategia input[type="checkbox"],.setup_strategy input[type="checkbox"] {display: none;}
.body_strategia label,.setup_strategy label {--size: 50px;--shadow: calc(var(--size) * .07) calc(var(--size) * .1);position: relative;display: block;width: var(--size);height: var(--size);margin: 0 auto;background-color: #f72414;border-radius: 50%;box-shadow: 0 var(--shadow) #ffbeb8;cursor: pointer;transition: 0.2s ease transform, 0.2s ease background-color,0.2s ease box-shadow;overflow: hidden;z-index: 1;}
.body_strategia label:before,.setup_strategy label:before {content: "";position: absolute;top: 50%;right: 0;left: 0;width: calc(var(--size) * .7);height: calc(var(--size) * .7);margin: 0 auto;background-color: #fff;transform: translateY(-50%);border-radius: 50%;box-shadow: inset 0 var(--shadow) #ffbeb8;transition: 0.2s ease width, 0.2s ease height;}
.body_strategia label:hover:before,.setup_strategy label:hover:before {width: calc(var(--size) * .55);height: calc(var(--size) * .55);box-shadow: inset 0 var(--shadow) #ff9d96;}
.body_strategia label:active,.setup_strategy label:active {transform: scale(0.9);}
.body_strategia .tick_mark,.setup_strategy .tick_mark {position: absolute;top: -1px;right: 0;left: calc(var(--size) * -.05);width: calc(var(--size) * .6);height: calc(var(--size) * .6);margin: 0 auto;margin-left: calc(var(--size) * .14);transform: rotateZ(-40deg);}
.body_strategia .tick_mark:before,.body_strategia .tick_mark:after,.setup_strategy .tick_mark:before,.setup_strategy .tick_mark:after {content: "";position: absolute;background-color: #fff;border-radius: 2px;opacity: 0;transition: 0.2s ease transform, 0.2s ease opacity;}
.body_strategia .tick_mark:before,.setup_strategy .tick_mark:before {left: 0;bottom: 0;width: calc(var(--size) * .1);height: calc(var(--size) * .3);box-shadow: -2px 0 5px rgba(0, 0, 0, 0.23);transform: translateY(calc(var(--size) * -.68));}
.body_strategia .tick_mark:after,.setup_strategy .tick_mark:after  {left: 0;bottom: 0;width: 100%;height: calc(var(--size) * .1);box-shadow: 0 3px 5px rgba(0, 0, 0, 0.23);transform: translateX(calc(var(--size) * .78));}
.body_strategia input[type="checkbox"]:checked + label,.setup_strategy input[type="checkbox"]:checked + label {background-color: #07d410;box-shadow: 0 var(--shadow) #92ff97;}
.body_strategia input[type="checkbox"]:checked + label:before,.setup_strategy input[type="checkbox"]:checked + label:before {width: 0;height: 0;}
.body_strategia input[type="checkbox"]:checked + label .tick_mark:before,.body_strategia input[type="checkbox"]:checked + label .tick_mark:after,
.setup_strategy input[type="checkbox"]:checked + label .tick_mark:before,.setup_strategy input[type="checkbox"]:checked + label .tick_mark:after  {transform: translate(0);opacity: 1;}
/*BACKTEST: setup strategia*/
.setup_strategy{margin-bottom:50px;display:none;}
.strategy_core .row {margin: 20px 0 30px;}
.strategy_core .row .col-2{font-size:20px;text-align: right;}
.strategy_core hr{width: 90%;margin: auto;display: block;margin-bottom: 20px;background: #9f9f9f;height: 2px;border-radius: 200px;}
.setup_strategy label {--size:25px;}
.setup_strategy .checkbox-wrapper * {margin:10px auto 20px;}
.setup_strategy .checkbox-wrapper{text-align:center;}
.setup_strategy .tick_mark{top:-8px;}
.setup_strategy .row .col-12.col-lg-6.col-xxl-4{display:none;}
.setup_strategy #message2{text-align: center;width: 80%;margin: 50px auto;padding: 20px;color: #fff;border-radius: 10px;}
.setup_strategy #message2.error{background-color: var(--red);}
.setup_strategy #message2.success{background-color: green;}
/*BACKTEST: risultati strategia*/
.result_indicator{margin-bottom:50px;font-size: 20px;line-height: 30px;margin-bottom:100px;}
.result_indicator h4 {font-size: 30px;border-bottom: 3px solid #e7e7e7;padding-bottom: 10px;width: 98%;margin-left: 10px;margin-bottom: 20px;}
.result_strategy {display: none;}
.result_strategy .text_indicator{text-align: right;}
.result_indicator span{font-size: 20px;}
.gainresult h1 {font-weight: 800;text-align: center;font-size:40px;}
.gainresult h1 span{display:block;font-size:25px;line-height:30px;font-weight: normal;}
.gainresult h1 #backtst_trans{font-size:18px;}



/*RESPONSIVE*/
@media (max-width:1600px){
    /*MOVIMENTI*/
    .deltrans{position: absolute;top:0;right:0%;}
    /*INVESTIMENTI*/
    /*.totale_investimenti{margin:0 -8%;}*/
    .totale_investimenti h1{font-size:21px;}
    .totale_investimenti span{font-size:18px;}
    .differenza_perc{margin: 0 -3%;}
    .differenza_perc p{font-size:14px;}
    .watch_stock h4,.watch_stock p{display:inline;}
}
@media (min-width:1400px) and (max-width:1600px){
    /*IVESTIMENTI*/
    .stock h5,.stock span{display:inline-block;}
    .status{margin:auto;}
    .stock h5{margin-right:15px;}
    .stock span{font-size:16px;}
    .stock p,.stock.row .prezzo span{position: static;display: inline;}
    .stock.row .prezzo, .stock.row .buyprice, .stock.row .sellprice,.stock .qty{margin-top:10px;margin-bottom:10px;text-align: center;}
}
@media only screen and (max-width:1440px){
    /*DASH*/
    .filtri_rec {font-size:14px;}
    /*INVESTIMENTI*/
    div#success{width:500px;margin:auto;display:block;}
    .list_stat_gainloss div.buyprice p,.list_stat_gainloss div.sellprice p{display: inline;}
    .list_stat_gainloss div.buyprice span,.list_stat_gainloss .stock.row .sellprice span{position:static!important;display: inline;}
    /*BACKTEST*/
    .backtest_grafico .card p.mb-0.invoice-num1 span{font-size:18px;}
}
@media (max-width:1400px){
    .row.titolostat{display:none;}
    .list_stat_gainloss div:before{color:#000;font-weight:700;display:block;}
    .list_stat_gainloss .data:before{content:"Data: ";}
    .list_stat_gainloss .buyprice:before{content:"Buy: ";}
    .list_stat_gainloss .sellprice:before{content:"Sell: ";}
    .list_stat_gainloss .qty:before{content:"Qty: ";}
    .list_stat_gainloss .diff:before{content:"gain/loss: ";}
    .list_stat_gainloss .differenza_perc:before{content:"Var: ";}
    /*IMPOSTAZIONI*/
    .card.casse{height:auto;}
    .card.uscite,.card.entrate{height:calc(70% - 30px);}
}
@media only screen and (min-width:1281px) and (max-width:1440px){
    /*DASH*/
    .filter_period p, .filter_stock p{font-size: 18px;}
    /*MOVIMENTI*/
    .elenco_transazioni .row{font-size:14px;}
}
@media only screen and (min-width:1200px) and (max-width:1280px){
    /*DASH*/
    .filter_period p, .filter_stock p{font-size: 16px;}
    .recent_transaction .row span,.recent_transaction .row{font-size:16px;}
    .recent_transaction svg{width:40;height:40px;}
}
@media (min-width:1200px){
    /*MOVIMENTI*/
    .elenco_casse{position:relative;height: 1120px;overflow: visible;margin-bottom: 0;}
    .casse_container{background: transparent;position:relative;overflow-y:scroll;height: 100%;direction:rtl;max-width:100%;}
    .elenco_casse:after{content: "";height: 200px;width: 100%;z-index: 1;position: absolute;left: 0;bottom: -10px;background: linear-gradient(180deg,rgba(30,87,153,0) 0,rgba(166,188,213,0) 33%,hsla(0,0%,97.6%,.43) 53%,#f6f6f6 79%);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#001e5799",endColorstr="#f9f9f9",GradientType=0);}
    .cassa_singola{width:100%;position:relative;margin-bottom:30px;}
    .cassa_bk{padding-left:35px;width:100%;position:relative;right:0;direction: initial;}
}

@media only screen and (max-width:1199px){
    /*DASH*/
    .recent_transaction .row span,.recent_transaction .row{text-align: center;}
    .recent_transaction .col-lg-12,.recent_transaction .col-lg-6,.recent_transaction .col-lg-4{margin-top:10px;}
    /*INVESTIMENTI*/
    .totale_investimenti h1{font-size:25px;}
    .totale_investimenti span{font-size:20px;}
    .stock p{font-size:16px;}
    #gain,#loss{width:500px;margin:auto;display:block;}
    .card.uscite,.card.entrate{height:calc(75% - 30px);}
}
@media only screen and (max-width:1024px){
    /*DASH*/
    div.body_container{padding-left:6.5rem;}
    div.left_menu{width:6.5rem;z-index: 2;}
    div.card.smb{padding:20px 10px;}
    /*MOVIMENTI*/
    .deltrans{right:3%;}
}
@media only screen and (max-width:992px){
    /*DASH*/
    .dataTables_info,.dataTables_paginate{text-align: center;}
    /*INVESTIMENTI*/
    .stock h5,.stock span{display:inline-block;}
    .status{margin:auto;}
    .stock h5{margin-right:15px;}
    .stock span{font-size:16px;}
    .stock p,.stock.row .prezzo span.pprezzo{position: static;display: inline;}
    .stock.row .prezzo, .stock.row .buyprice, .stock.row .sellprice,.stock .qty{margin-top:10px;margin-bottom:10px;text-align: center;}
    .row.extrainfo{padding-top: 30px;}
    .extrainfo span.extraspan{margin-top: -20px;}
    /*IMPOSTAZIONI*/
    .account_img{width:80px;height:80px;margin-left:0;}
    .card.uscite,.card.entrate{height:auto;}
    .rules .col-lg-6{margin-bottom:20px;}
    .rules .card-body .row.align-items-center{margin-bottom:40px;}
    .rules .col-lg-5{margin-bottom:20px;}
    .removerule{top:-10;}
}
@media only screen and (max-width:768px){
    /*DASH*/
    div.body_container{padding-left:0;}
    /*div.left_menu{display:none;width:0;}*/
    /*INVESTIMENTI*/
    .add_popup{width:95%;left:50%;margin-left:-47.5%;}
    .list_stat_gainloss h4{text-align: center;}
}
@media only screen and (min-width:577px) and (max-width:768px){
    /*DASH + BACKTEST*/
    .sommario .icon,.backtest_grafico .icon{width:50px;height:50px;}
    .sommario .icon svg,.backtest_grafico .icon svg{width:30px;height:30px;top:50%;left:50%;margin:-15px 0 0 -15px}
    .invoice-num{font-size:20px;}

}
@media only screen and (max-width:576px){
    /*DASH*/
    .content_fluid{padding:20px 10px;}
    .filter_period, .filter_stock{padding:0 10px;}
    .filter_icon{left:0;}
    div.card.smb{padding:10px 10px;}
    div.card.smb h2.invoice-num,p.mb-0.invoice-num1{padding-left: 30px;font-size: 23px;}
    div.card.smb p.mb-0.invoice-num1 span.d-inline.d-sm-none.d-lg-inline{font-size:12px;}
    div.sommario .col-12.col-sm-6.col-xxxl-3 {margin-bottom: -15px;}
    .title_container h1{text-align: center;}
    .filterarea, .stockarea{width:100%;right:0;left:0;}
    .card.timeline{padding:20px 10px;}
    .card.timeline .card-body{padding:1rem 0;}
    /*MOVIMENTI*/
    .row.tabella_transazioni .card{height:auto;}
    /*INVESTIMENTI*/
    .totale_investimenti h1,.totale_investimenti span{text-align: center;}
    .holding h4{text-align: center;}
    .buy_stock .card-body{padding:0;}
    .watching .form-wrapper .input-group .input-group-prepend .input-group-text{width:150px;font-size:16px}
    .watching .form-wrapper .input-group .form-control{font-size:18px;}
    .filter_stock{margin-bottom:20px;}
    div#success{width:100%;height:auto;}
    .leggenda ul{font-size:16px;}
    .leggenda ul li{float:none;width:100%;}
    #gain,#loss{width:100%;}
    .list_stat_gainloss .stock p, .stock.row .buyprice span, .stock.row .sellprice span{font-size:18px;}
    .list_stat_gainloss div:before{display:inline;}
    .bstock a.btn {padding: .938rem 1rem;}
    /*IMPOSTAZIONI*/
    .account_img{position:relative;left:50%;margin-left:-40px;}
    .profile_info{text-align:center;}
    #erules{margin-bottom:20px;}

    /*BACKTEST*/
    .backtest_intro #drop-zone{width:80%;}
    .setup_strategy .card, .result_strategy .card{padding:20px 0px;}
}