/*
.row {
   margin-bottom: 20px;
}
*/


body {
   margin-top: 15px;
   margin-left: 20px;
   margin-right: 20px;
}

#ot-banner-background {
   width: 1450px;
   /* background-image: url(https://optiontraders.it/wp-content/uploads/2021/08/Option-Traders-Paolo-Pratesi-Giuseppe-Verardi-migliori-traders.jpg); */
/*
   background-size: cover;
   background-repeat: no-repeat;
   background-position-x: center;
   background-position-y: bottom;
   background-attachment: scroll;
   position: sticky;
   top: 0;
   z-index: 1000;
*/


}



#ot-banner {
   border-radius: 30px;
   padding-top: 10px;
   padding-left: 10px;
   padding-bottom: 10px;
   padding-right: 10px;
}

#ot-logo {
   width: 130px;
   height: 55px;
   text-align: center;
   /*background-size: contain;*/
   background-size: 70%;
   background-repeat: no-repeat;
   background-position: center;
   border-radius: 40px;
   /* Default background logo */
   background-image: url("/assets/midax-logo-blue.png");
}



#ot-logo img{
   height: 55px;
   padding-top: 5px;
   padding-right: 5px
}


#navbar-container {
   padding-top: 5px;
   border-radius: 40px;
}

#language-switcher,
#theme-switcher {
   padding-top: 15px;
}
#language-switcher {
   border-radius:  40px 0px 0px 40px;
   padding-left: 0px;
   padding-right: 0px;
}
#logout-container {
   margin-right: 10px;
   padding-top: 5px;
   padding-right: 30px;
   width: fit-content;
   border-radius:  0px 40px 40px 0px;
}

#ot-user-greeting {
   width: fit-content;
   padding-top: 10px;
   padding-left: 0px;
}

#navbar div.nav-item a.nav-link {
   border: none;
   background-image: none;
   background-color: transparent;
}
#navbar {
   border: none;
}

#navbar div.nav-item a.nav-link.disabled::after {
   content: '\1F512';
   font-size: 0.8em;
   position: relative;
   top: -3px;
   margin-left: 2px;
   display: inline-block;
   animation: pulse 10s infinite ease-in-out;
}
@keyframes pulse {
   0% {
     transform: scale(1);
   }
   1% {
      transform: scale(1.035) rotate(4deg);
   }
   2% {
      transform: scale(1.07) rotate(-4deg);
   }
   3% {
      transform: scale(1.10) rotate(4deg);
   }
   4% {
      transform: scale(1.13) rotate(-4deg);
   }
   5% {
     transform: scale(1.15);
   }
   10% {
     transform: scale(1);
   }
   100% {
      transform: scale(1);
    }
}

#ot-logout-button::before {
   font-family: "Font Awesome 5 Free";
   content: "\f007"; /* fa-user */
   font-size: medium;
   color: #e9ecef;
}


#ot-logout-button {
   width: fit-content;
   border: 2px solid transparent;
   border-radius: 100%;
   padding-top: 3px;
   padding-right: 5px;
   padding-bottom: 3px;
   padding-left: 5px;
}


#ot-logout-button {
   --color: rgb(200, 197, 197);
   --border: 2px;
   --offset: 5px;
   --vgap: 3px;
   --hgap: 5px;

   border-radius: 50%;
   cursor: pointer;
   padding-top: calc(var(--border) + var(--vgap));
   padding-right: calc(var(--border) + var(--hgap));
   padding-bottom: calc(var(--border) + var(--vgap));
   padding-left: calc(var(--border) + var(--hgap));
   border: var(--offset) solid #0000;
   --_m: radial-gradient(50% 50%, #000 calc(100% - var(--offset)),#0000 calc(100% - var(--border)));
   -webkit-mask: var(--_m);
         mask: var(--_m);
   --_g: #0000 calc(99% - var(--border)), var(--color) calc(100% - var(--border)) 99%,#0000;
   --_s: var(--offset);
   --_r: 100% 100% at;
   background:
   radial-gradient(var(--_r) 0    0   ,var(--_g)) calc(100% + var(--_s)) calc(100% + var(--_s)),
   radial-gradient(var(--_r) 100% 0   ,var(--_g)) calc(0%   - var(--_s)) calc(100% + var(--_s)),
   radial-gradient(var(--_r) 0    100%,var(--_g)) calc(100% + var(--_s)) calc(0%   - var(--_s)),
   radial-gradient(var(--_r) 100% 100%,var(--_g)) calc(0%   - var(--_s)) calc(0%   - var(--_s));
   background-size: 50% 50%;
   background-repeat: no-repeat;
   transition: .4s;
}
#ot-logout-button:hover {
   --_s: 0px;
}


#ot-footer {
   width: 1500px;
   border-top: 1px solid;
   padding: 20px;
   text-align: center;
}

#trade-plan-body {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: 15px;
}


#custom-symbol-list-menu button {
   width: 100%;
   border: none;
   text-align: start;
   padding: .25rem 1rem
}

#info-history-window,
#info-ref-date-reset,
#info-analysis-window,
#info-forecast-window,
#info-symbol_list {
   font-size: small;
   vertical-align: top;
}


#journal-table .dash-header,
#symbol-list-editor-table .dash-header,
#pairs-table .dash-header {
   white-space: normal;
   text-align: center;
   vertical-align: top;
   background-image: linear-gradient(0deg, #9cccf6, #065888e8);
   color: white;
   font-weight: bold;
   border-left-width: 0px !important;
   border-right-width: 1px !important;
}
#journal-table .dash-header,
#symbol-list-editor-table .dash-header.column-0,
#pairs-table .dash-header.column-0 {
   border-left-width: 1px !important;
}

#journal-table .dash-header,
#symbol-list-editor-table .dash-cell,
#pairs-table .dash-cell {
   min-width: 100px;
   max-width: 300px;
   width: fit-content;
   border-top-width: 0px !important;
   border-bottom-width: 1px !important;
   border-left-width: 0px !important;
   border-right-width: 1px !important;
}

#symbol-list-editor-table .dash-cell.column-0,
#pairs-table .dash-cell.column-0 {
   border-left-width: 1px !important;
}

.fa:hover {
   cursor: pointer;
}

#lt-correlation-heatmap,
#st-correlation-heatmap,
#pair-price-chart,
#pair-scatter-plot,
#pair-spread-plot {
   box-shadow: 3px 3px 5px #63676b
}

#symbol-list-editor-table td.dash-cell input.input-active {
   text-align: left
}

#progress-div {
   margin-top: 30px;
   margin-left: 30%;
   margin-right: 30%;
   text-align: center;
}


#language-dropdown {
   width: auto;
   padding-left: 0px;
}
#language-dropdown .btn-primary {
   background-image: none;
   background-color: transparent;
   border-color: transparent;
   padding-top: 0px;
   padding-left: 6px;
}
.language-flag {
   margin-right: 5px;
}
#active-language-flag {
   width: auto;
   height: fit-content;
   margin-top: 6px;
   margin-left: 2px;
   padding: 0px;
}
#language-dropdown button.dropdown-item {
   font-size: small;
}
#language-row {
   width: fit-content;
   margin-left: auto;
}


#login-form {
   width: 250px;
   margin-left: 30px;
}



.card {
   border-radius: 1.2rem;
   border-width: 0px;
}
.card-header {
   border-bottom: none;
   padding-bottom: 0px;
   background-color: transparent;
   font-weight: bold;
}

.card-header div.row {
   margin-bottom: 0px;
}
.card-header-img,
.card-header-label {
   width: fit-content;
}

.card-header-label {
   padding-left: 0px;
}


.blurred-value {
   filter: blur(1.5px);
}


div:has(> label.market-closed-info) {
   width: fit-content;
   margin-left: 8%;
   margin-top: 2px;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 4px;
   border: 2px solid darkgoldenrod;
   color: darkgoldenrod;

}

#trade-plan-market-closed-info {
   position: absolute;
   top: 120px;
   left: 150px;   
}

#ots-plus-market-closed-info {
   position: absolute;
   top: 180px;
   left: 150px;
}
#ots-hedge-market-closed-info {
   position: absolute;
   top: 210px;
   left: 150px;
}


#trade-plan-market-closed-info .form-label,
#ots-plus-market-closed-info .form-label,
#ots-hedge-market-closed-info .form-label
{
   margin-bottom: 0px;
}

.market-closed-info {
   margin-left: 5px;
   font-weight: bold;
   font-style: italic;
}

#ots-standard-data-alert,
#ots-plus-card-header-alert,
#ots-hedge-card-header-alert {
   width: fit-content;
   color: rgb(204, 40, 40);
   font-weight: bold;
   margin-left: 5%;
}

#ots-standard-data-alert{
   margin-bottom: 3px;
   margin-left: 10px;
}

#trade-details-expiration-label {
   margin-bottom: 2px;
}

.card-header-alert-hidden {
   display: none;
}
.card-header-alert-visible {
   display: inline-block;
}



.card-header-img {
   margin-left: 5px;
   margin-top: 5px;
   
}
.trade-plan-card {
   width: 342px;
   height: 220px;
   padding: 0px;
   margin-left: 10px;
   margin-right: 5px;
}

.trade-plan-card-body {
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 20px;
   padding-top: 0px;
}

.trade-plan-gauge {
   width: 340px;
   height: 300px;
   padding-bottom: 30%;
   padding-right: 10px;
}

.trade-plan-card-chart {
   width: 700px;
   height: 330px;
   padding: 0px;
   margin-left: 10px;
   margin-right: 5px;

}


.trade-plan-chart {
   width: 680px;
   height: 280px;
}

#chart-equity-sim {
   margin-left: 20px;
   width: 650px;
   height: 250px;
}


.dollar-value {
   text-align: right;
   padding-right: 5px;
}


.dollar-value::-webkit-outer-spin-button,
.dollar-value::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
}

.control-label {
   font-weight: bold;
}

.input-label {
   padding-left: 5px;
}
.slider-label {
   padding-left: 20px;
}


#ots-hedge-trade-details-tabs div.nav-item a,
#ots-plus-trade-details-tabs div.nav-item a {
   padding-left: 10px;
   padding-right: 10px;
}


#ots-hedge-trade-details-tabs div.nav-item a.active,
#ots-plus-trade-details-tabs div.nav-item a.active {
   font-weight: bold;
}

#ots-plus-trade-details-expiration,
#ots-hedge-trade-details-expiration,
#trade-details-expiration {
   display: contents;
}

#ots-plus-trade-details-expiration .btn-primary,
#ots-hedge-trade-details-expiration .btn-primary,
#trade-details-expiration .btn-primary {
   background-image: none;
   background-color: transparent;
   border-color: transparent;
   padding-top: 0px;
   padding-left: 10px;
   font-size: 0.9rem;
   align-self: baseline;
}


#ots-plus-trade-details-expiration button.dropdown-item,
#ots-hedge-trade-details-expiration button.dropdown-item,
#trade-details-expiration button.dropdown-item {
   font-size: small;
}

.trade-details-row {
   font-size: 0.9rem;
   margin-top: 20px;
   margin-bottom: 2px;
}
.trade-details-row-strike {
   font-size: 0.9rem;
   margin-bottom: 0px;
}
.trade-details-data-alert,
.trade-details-row-premium,
.trade-details-row-stop,
.trade-details-row-target-profit,
.trade-details-row-stop-trigger,
.trade-details-row-stop-loss {
   font-size: 0.9rem;
   margin-top: 0px;
}

.trade-details-label, .trade-details-value, 
.trade-details-label-strike, .trade-details-value-strike {
   width: fit-content;
   padding-left: 6px;
   padding-right: 0px;
}
.trade-details-label {
   font-weight: bold;
}

.trade-details-label-strike, .trade-details-value-strike {
   font-style: italic;
}

.trade-details-label-strike {
   padding-left: 15px;
}

.credit-debit{
   width: fit-content;
   height: fit-content;
   margin-top: 2px;
   margin-left: 3px;
   padding-left: 3px;
   padding-right: 3px;
   font-weight: bold;
   font-size: 0.8rem;
   color: white;
}
.credit {
   background-color: cadetblue;
}
.debit {
   background-color: red
}
.gtc {
   background-color: goldenrod;
}

.ots-plus-rr-target-premium-icon,
.ots-plus-rr-target-profit-icon,
.ots-plus-rr-stop-trigger-icon,
.ots-plus-rr-stop-loss-icon,
.ots-plus-vertical-target-premium-icon,
.ots-plus-vertical-target-profit-icon,
.ots-plus-vertical-stop-trigger-icon,
.ots-plus-vertical-stop-loss-icon,
.ots-hedge-vertical-target-premium-icon,
.ots-hedge-rr-target-premium-icon,
.ots-hedge-rr-target-profit-icon,
.ots-hedge-rr-stop-trigger-icon,
.ots-hedge-rr-stop-loss-icon,
.ots-hedge-time-in-force-icon
 {
   font-size: 1.2rem;
   width: fit-content;
   font-size: 0.8rem;
   padding-top: 5px;
   padding-left: 10px;
   padding-right: 0px;
   margin-left: 8px;
}

#ots-plus-rr-target-premium-label,
#ots-plus-rr-target-profit-label,
#ots-plus-rr-stop-trigger-label,
#ots-plus-rr-stop-loss-label,
#ots-plus-vertical-target-premium-label,
#ots-plus-vertical-target-profit-label,
#ots-plus-vertical-stop-trigger-label,
#ots-plus-vertical-stop-loss-label,
#ots-hedge-vertical-target-premium-label,
#ots-hedge-rr-target-premium-label,
#ots-hedge-rr-target-profit-label,
#ots-hedge-rr-stop-trigger-label,
#ots-hedge-rr-stop-loss-label {
   padding-left: 5px;
   font-weight: normal;
   font-style: italic;
}

#ots-plus-rr-target-premium,
#ots-plus-rr-target-profit,
#ots-plus-rr-stop-trigger,
#ots-plus-rr-stop-loss,
#ots-plus-vertical-target-premium,
#ots-plus-vertical-target-profit,
#ots-plus-vertical-stop-trigger,
#ots-plus-vertical-stop-loss,
#ots-hedge-rr-target-premium-label,
#ots-hedge-rr-target-profit-label,
#ots-hedge-rr-stop-trigger-label,
#ots-hedge-rr-stop-loss-label {
   padding-left: 5px;
   font-style: italic;
}


#card-body-trade-details{
   text-align: left;
   margin-left: 1.5em;
}


#card-body-equity-sim div.form-switch {
   width: fit-content;
   margin-left: auto;
   margin-right: 10px;
   margin-top: 3px;
   margin-bottom: 0px;
}

#card-body-equity-sim div.form-switch label.form-check-label {
   margin-bottom: 0px;
}




#ots-plus-body,
#ots-hedge-body {
   display: flex;
   flex-direction: column;
   gap: 10px;
}

.ots-plus-card-chart,
.ots-hedge-card-chart
 {
   width: 1400px;
   padding: 0px;
   margin-left: 10px;
   margin-right: 5px;

}

#card-ots-plus-trade-details,
#card-ots-hedge-trade-details {
   width: 370px;
   padding: 0px;
   margin-left: 10px;
   margin-right: 5px;
}
/* .ots-plus-card-risk-chart { */
#card-ots-plus-pnl,
#card-ots-hedge-pnl {
   width: 1020px;
   padding: 0px;
   margin-left: 5px;
   margin-right: 5px;
}


.ots-plus-standard-card {
   height: 450px;
}
.ots-plus-standard-chart {
   height: 350px;
}

.ots-plus-accelerator-card{
   height: 510px;
}
.ots-plus-accelerator-chart {
   height: 400px;
}


.label-short {
   color: red;
}

.label-long {
   color: teal;
}


.ots-plus-lot-size-controls-row {
   margin-top: 2px;
   margin-bottom: 2px;
   margin-right: 30px;
   justify-content: end;
}

.ots-plus-investment-label,
.ots-plus-lot-size-label
{
   width: fit-content;
   font-weight: bold;
   font-size: 0.9rem;
   padding-left: 5px;
   padding-right: 10px;
   margin-top: 3px;
   margin-left: 30px;
}

.ots-plus-lot-size-value,
.ots-hedge-lot-size-value {
   width: fit-content;
   font-size: 0.9rem;
   padding-left: 0px;
   margin-top: 3px;
}

#ots-plus-input-investment-amt {
   width: 100px;
   font-size: 0.9rem;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 2px;
   padding-bottom: 2px;
}



/*
.ots-hedge-card-body {
   padding: 10px;
}
*/
.ots-hedge-standard-card {
   height: 450px;
}
.ots-hedge-standard-chart {
   height: 350px;
}

.ots-hedge-accelerator-card {
   height: 550px;
}

.ots-hedge-accelerator-chart {
   height: 400px;
}

#card-body-ots-hedge-trade-details .trade-details-row {
   margin-top: 10px;
}

.ots-hedge-lot-size-controls-row {
   margin-top: 2px;
   margin-bottom: 2px;
   margin-left: 20px;
   margin-right: 20px;
}

.ots-hedge-control-label {
   font-weight: bold;
   font-size: 0.9rem;
   padding-left: 5px;
   padding-right: 5px;
   margin-top: 3px;
   width:fit-content;
}

.ots-hedge-coverage-label {
   margin-left: 20px;
}

#ots-hedge-input-investment-risk-amt {
   width: 70%;
}
#ots-hedge-slider-hedge-coverage {
   width: 80%;
}

#div-switch-ots-hedge-freetrade-correction {
   margin-top: 10px;
}

#div-switch-ots-hedge-freetrade-correction label{
   font-size: 0.9rem;
}


.ots-hedge-trade-details-card,
.ots-hedge-pnl-card
 {
   height: 550px;
}
.ots-hedge-pnl-chart {
   height: 400px;
}

/* Make it look like a simple text row */
.accordion-button {
   padding: 5px;
   font-weight: 600;
   text-align: left;
}

.accordion-button:not(.collapsed) {
   color: var(--bs-body-color);
}

.accordion-body {
   padding: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
}
.accordion-item {
   background-color: unset;
}

.ots-hedge-separator {
   margin-top: 5px;
   margin-bottom: 5px;
}