/** Add css rules here for your application. */
@import url('https://fonts.googleapis.com/css?family=Muli:300,400,700');
html * {
font-family: Segoe UI,"Muli", sans-serif !important;
/* scroll-behavior: smooth; */
--buy-color :#53B987;
--sell-color :#EB4D5C;
--new-buy-color : #336eb6;
--new-sell-color : #ef4258;
--blue-buy-color : #4DA2E8;
--red-sell-color: #DA3F3C;
}
::-webkit-scrollbar { width: 8px; height: 8px;}
/* Track */#2070D8
::-webkit-scrollbar-track {background: transparent; }
/* Handle */
::-webkit-scrollbar-thumb {background: #555; width: 8px; height: 8px;border-radius:4px}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {background: #555; width: 6px; height: 2px;}
::-webkit-scrollbar-mouse:hover {background: #555; width: 6px; height: 2px;}
body {
margin: 0;
-ms-user-select:none;
overflow: hidden;
}
body.light {
background-color: white;
--INPUT-COLOR :#000;
color: #000;
--FONT-COLOR :#000;
}
body.dark {
background-color: #18191d;
color:#ddd;
--INPUT-COLOR :#fff;
--FONT-COLOR :#ddd;
}
.dark .theme-background{
background-color: #18191d;
border: 1px solid #2a2b31;
border-radius: 4px;
}
.light .theme-background{
background-color: #fff;
border: 1px solid #ccc;
margin-top:-1px;
}
ul {
padding: 0;
margin: 0;
}
a {
outline: none;
text-decoration: none;
}
td {
font-size: 14px;
}
input[type="radio"]:checked{
position: absolute;
left: -9999px;
}
input[type="radio"]:not(:checked ) {
position: absolute;
left: -9999px;
}
input[type="radio"]:checked+label, input[type="radio"]:not(:checked ) +label
{
position: relative;
padding-left: 28px;
cursor: pointer;
display: inline-block;
padding-right: 10px;
}
input[type="radio"]:checked+label:before, input[type="radio"]:not(:checked
) +label:before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 14px;
height: 14px;
border: 1px solid #2070D8;
border-radius: 100%;
background: transparent;
}
input[type="radio"]:checked+label:after, input[type="radio"]:not(:checked
) +label:after {
content: '';
width: 10px;
height: 10px;
background: #2070D8;
position: absolute;
top: 3px;
left: 3px;
border-radius: 100%;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
}
input[type="radio"]:not(:checked ) +label:after {
opacity: 0;
-webkit-transform: scale(0);
transform: scale(0);
}
input[type="radio"]:checked+label:after {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
select {
outline: none !important;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
background-repeat: no-repeat;
background-size: 9px auto;
background-position: right 3px center;
padding-right: 1em;
background-image:
url('images/drop-down-arrow.svg');
padding-right: 15px !important;
}
select::-ms-expand {
display: none;
}
input:FOCUS, select:FOCUS, button:FOCUS{
-webkit-box-shadow: 0px 0px 3px 0px #2070D8;
-moz-box-shadow: 0px 0px 3px 0px #2070D8;
box-shadow: 0px 0px 3px 0px #2070D8;
}
.logo-container{
width: 45px;
height: 45px;
box-sizing: border-box;
border-radius: 4px;
}
.chart-grouping {
background-color: transparent;
color: #2070D8;
background-image:
url('data:image/svg+xml;charset=utf-8, ');
}
.dark select option{
background-color: #232428;
color: #d3d5d6;
text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
}
.hint, [data-hint] {
position: relative;
}
.hint:before, .hint:after, [data-hint]:before, [data-hint]:after {
position: absolute;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
visibility: hidden;
opacity: 0;
z-index: 1000000;
pointer-events: none;
-webkit-transition: .3s ease;
-moz-transition: .3s ease;
transition: .3s ease;
transition-delay: 0.1s;
}
.hint:hover:before, .hint:hover:after, .hint:focus:before, .hint:focus:after,
[data-hint]:hover:before, [data-hint]:hover:after, [data-hint]:focus:before,
[data-hint]:focus:after {
visibility: visible;
opacity: 1
}
.hint:before, [data-hint]:before {
content: '';
position: absolute;
background: transparent;
border: 6px solid transparent;
z-index: 1000001
}
.hint:after, [data-hint]:after {
content: attr(data-hint);
background: #383838;
color: #fff;
text-shadow: 0 -1px 0 #000;
padding: 8px 10px;
font-size: 13px;
line-height: 12px;
white-space: nowrap;
box-shadow: 4px 4px 8px rgba(0, 0, 0, .3)
}
.hint--top:before {
border-top-color: #383838
}
.hint--bottom:before {
border-bottom-color: #383838
}
.hint--left:before {
border-left-color: #383838
}
.hint--right:before {
border-right-color: #383838
}
.hint--top:before {
margin-bottom: -12px
}
.hint--top:after {
margin-left: -18px
}
.hint--top:before, .hint--top:after {
bottom: 100%;
left: 50%
}
.hint--top:hover:after, .hint--top:hover:before, .hint--top:focus:after,
.hint--top:focus:before {
-webkit-transform: translateY(-8px);
-moz-transform: translateY(-8px);
transform: translateY(-8px)
}
.hint--bottom:before {
margin-top: -12px
}
.hint--bottom:after {
margin-left: -18px
}
.hint--bottom:before, .hint--bottom:after {
top: 100%;
left: 50%
}
.hint--bottom:hover:after, .hint--bottom:hover:before, .hint--bottom:focus:after,
.hint--bottom:focus:before {
-webkit-transform: translateY(8px);
-moz-transform: translateY(8px);
transform: translateY(8px)
}
.hint--right:before {
margin-left: -12px;
margin-bottom: -6px
}
.hint--right:after {
margin-bottom: -14px
}
.hint--right:before, .hint--right:after {
left: 100%;
bottom: 50%
}
.hint--right:hover:after, .hint--right:hover:before, .hint--right:focus:after,
.hint--right:focus:before {
-webkit-transform: translateX(8px);
-moz-transform: translateX(8px);
transform: translateX(8px)
}
.hint--left:before {
margin-right: -12px;
margin-bottom: -6px
}
.hint--left:after {
margin-bottom: -14px
}
.hint--left:before, .hint--left:after {
right: 100%;
bottom: 50%
}
.hint--left:hover:after, .hint--left:hover:before, .hint--left:focus:after,
.hint--left:focus:before {
-webkit-transform: translateX(-8px);
-moz-transform: translateX(-8px);
transform: translateX(-8px)
}
.hint--error:after {
background-color: #b34e4d;
text-shadow: 0 -1px 0 #592726
}
.hint--error.hint--top:before {
border-top-color: #b34e4d
}
.hint--error.hint--bottom:before {
border-bottom-color: #b34e4d
}
.hint--error.hint--left:before {
border-left-color: #b34e4d
}
.hint--error.hint--right:before {
border-right-color: #b34e4d
}
.hint--warning:after {
background-color: #c09854;
text-shadow: 0 -1px 0 #6c5328
}
.hint--warning.hint--top:before {
border-top-color: #c09854
}
.hint--warning.hint--bottom:before {
border-bottom-color: #c09854
}
.hint--warning.hint--left:before {
border-left-color: #c09854
}
.hint--warning.hint--right:before {
border-right-color: #c09854
}
.hint--info:after {
background-color: #929393;
text-shadow: 0 -1px 0 #193b4d
}
.hint--info.hint--top:before {
border-top-color: #929393;
}
.hint--info.hint--bottom:before {
border-bottom-color: #929393;
}
.hint--info.hint--left:before {
border-left-color: #929393;
}
.hint--info.hint--right:before {
border-right-color: #929393;
}
.hint--success:after {
background-color: #458746;
text-shadow: 0 -1px 0 #1a321a
}
.hint--success.hint--top:before {
border-top-color: #458746
}
.hint--success.hint--bottom:before {
border-bottom-color: #458746
}
.hint--success.hint--left:before {
border-left-color: #458746
}
.hint--success.hint--right:before {
border-right-color: #458746
}
.hint--always:after, .hint--always:before {
opacity: 1;
visibility: visible
}
.hint--always.hint--top:after, .hint--always.hint--top:before {
-webkit-transform: translateY(-8px);
-moz-transform: translateY(-8px);
transform: translateY(-8px)
}
.hint--always.hint--bottom:after, .hint--always.hint--bottom:before {
-webkit-transform: translateY(8px);
-moz-transform: translateY(8px);
transform: translateY(8px)
}
.hint--always.hint--left:after, .hint--always.hint--left:before {
-webkit-transform: translateX(-8px);
-moz-transform: translateX(-8px);
transform: translateX(-8px)
}
.hint--always.hint--right:after, .hint--always.hint--right:before {
-webkit-transform: translateX(8px);
-moz-transform: translateX(8px);
transform: translateX(8px)
}
.hint--rounded:after {
border-radius: 4px
}
.hint--bounce:before, .hint--bounce:after {
-webkit-transition: opacity .3s ease, visibility .3s ease,
-webkit-transform .3s cubic-bezier(0.71, 1.7, .77, 1.24);
-moz-transition: opacity .3s ease, visibility .3s ease, -moz-transform
.3s cubic-bezier(0.71, 1.7, .77, 1.24);
transition: opacity .3s ease, visibility .3s ease, transform .3s
cubic-bezier(0.71, 1.7, .77, 1.24)
}
/* -- Radio button ---*/
.wait-box .progess-bar {
height: 120px;
background-image: url(/images/loading.svg);
background-repeat: no-repeat;
width: 120px;
}
.top-menu-table, .trade-menu-table{
width: calc(100% - 150px);
height: 100%;
}
.trade-menu-table a{
padding: 0 10px;
white-space: nowrap;
display: block;
text-align: center;
color: var(--FONT-COLOR);
text-decoration: none;
font-size: 15px;
line-height: 56px;
height: 100%;
border-bottom: 5px solid transparent;
}
.trade-menu-table a.selected{
border-bottom: 5px solid #2070D8;
}
#menuHeader, .menuHeader {
height: 58px;
}
.dark #menuHeader {
box-shadow: none;
background-image:none;
}
.header-text{
font-size: 18px;
font-weight: bold;
display: inline-block;
}
.header-text .tooltip{
display: inline-block;
width: 16px;
height: 16px;
margin-left: 10px;
background-color: #2070D8;
padding: 4px;
border-radius: 50%;
font-size: 14px;
color: white;
position:relative;
text-align: center;
cursor: pointer;
}
.flex-container {
display: flex;
align-items: stretch;
position: relative;
height:calc(100% - 60px);
/* padding: 9px 0; */
}
#left {
width: 64px;
margin-bottom: 5px;
}
.tool-bar {
height: 100%;
/* opacity: 0.1; */
border-radius: 4px;
/* background-image: linear-gradient(40deg, #00b0ff, #00bfa5); */
margin: 0 9px 0 auto;
background-color: #dddddd;
position: relative;
}
.collapseArrow {
display: block;
z-index: 100;
top: 50%;
left: 55px;
width: 8px;
height: 30px;
border-radius: 0 5.5px 5.5px 0;
background-color: #2a2b31;
transform: translateY(-50%);
text-decoration: none;
font-weight: bold;
text-align: center;
line-height: 26px;
position: fixed; /* Ensure it's fixed on the left */
}
.collapseArrow svg {
stroke: #ccc;
vertical-align: middle;
border-radius: 5.5px 0 0 5.5px;
transform: rotate(0deg); /* Initially point to the right */
transition: transform 0.3s; /* Smooth transition */
}
.collapseArrow .arrow-rotate svg {
transform: rotate(-90deg); /* Rotate to point left when collapsed */
}
.light .custom-dialog .custom-dialog-header .tool-bar {
border: none;
background-color: #dfdddd;
}
.dark .custom-dialog .custom-dialog-header .tool-bar {
border: none;
background-color: #23242a;
}
.light .tool-bar{
background-color: #ffffff;
border: #ccc 1px solid;
}
.dark .tool-bar {
background: #2a2b31;
}
#chart-area {
background-color: #fff;
border-radius: 4px;
flex-grow: 2;
color: white;
width: calc(100% - 450px);
margin-right: 9px;
margin-bottom: 6px;
position: relative;
}
.dark #chart-area {
background: #18191d;
}
#side-bar {
margin: 0 9px;
width: 350px;
position: relative;
transition: width .38s;
z-index:6;
background-color: #ffffff;
box-sizing: border-box;
transition-timing-function: ease-in-out;
padding-top:0;
}
.light #side-bar{
border-left: 2px solid #edeff2;
}
.dark #side-bar {
/* margin: 0 9px; */
background-color: #121212;
position: relative;
transition: width .38s;
}
#side-bar.collapsed {
width: 0;
padding-right: 0;
}
#side-bar .content{
height: 58px;
display: flex;
overflow: hidden;
align-items: center;
justify-content: space-between;
}
/*
#side-bar .content{
height: 100%;
padding: 5px;
box-sizing: border-box;
background-color: #fff;
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
}
*/
#side-bar .handle {
position: absolute;
display: block;
top: 50%;
left: 0px;
width: 8px;
height: 30px;
/* border-radius: 5.5px 0 0 5.5px; */
background-color: #18191d;
transform: translateY(-50%);
text-decoration: none;
font-weight: bold;
text-align: center;
line-height: 26px;
}
#side-bar .handle svg {
stroke: #ccc;
vertical-align: middle;
transform: rotate(180deg);
}
#side-bar.collapsed .handle svg {
transform: rotate(0deg);
}
.menu-panel{
display: flex;
position: absolute;
left: 430px;
align-items: center;
height: 100%;
justify-content: space-between;
right: 0;
background-color: #fff;
}
.dark .menu-panel{
background-color: #18191d;
}
.Main-menu, .Right-menu {
padding: 0 10px;
color: #333;
text-decoration: none;
font-size: 12px;
}
.Main-menu{
padding: 0 7px;
white-space: nowrap;
display: block;
text-align: center;
}
.dark .Main-menu, .Right-menu {
color: #ddd;
}
.light .Right-menu {
color: #5b5c60;
}
.Right-menu {
display: inline-block;
width: 30px;
/* height: 30px; */
}
.Right-menu .user{
width: 35px;
height: 35px;
background-color: #2070D8;
color: #fff;
text-align: center;
border-radius: 50%;
line-height: 35px;
}
@media only screen and (max-width: 650px) {
body{
overflow: auto;
}
.simplebar-placeholder{
display: none;
}
/* .flex-container {
display: block;
} */
/* .flex-container #left {
width: auto;
height: 57px;;
} */
/* .flex-container .chart-area {
height: calc(100vh - 142px);
margin: 9px;
} */
/* @supports (-webkit-appearance:none) {
.os-android .flex-container .chart-area{
height: calc(100vh - 198px);
}
} */
#menuHeader .symbol_search{
display: none;
}
/* #side-bar {
height: calc(100vh - 58px);
} */
.flex-container #side-bar {
position: absolute;
z-index: 11;
top: 0;
right: 0;
bottom: 0;
background-color: #fff;
margin: 0;
width: 96vw;
}
.flex-container #side-bar.collapsed {
width: 0;
}
.flex-container #side-bar .handle {
left: -11px;
}
/* .flex-container>div {
display: block;
width: auto;
} */
/* .tool-bar ul>li {
float: left;
margin: 0 5px;
} */
.mobile-hide{
display: none;
}
}
.tool-bar ul {
padding: 4px 0;
list-style: none;
margin: 0;
}
.tool-bar a {
text-align: center;
text-decoration: none;
cursor: pointer;
margin: 14px auto;
display: block;
width: 28px;
height: 28px;
color: #333;
}
.custom-dialog .tool-bar a{
margin: 0px 5px;
}
.dark .tool-bar a {
color: #ddd;
}
.tool-bar a:HOVER svg {
fill: #2070D8;
color: #2070D8;
}
.tool-popup {
padding: 5px 0px;
background-color: white;
border-radius: 5px;
border: 1px solid #ccc;
z-index: 100;
}
.dark .tool-popup{
background-color: #18191c;
border: 1px solid #31343c;
box-shadow: 2px 3.5px 24px 0 rgba(0, 0, 0, 0.14);
}
.tool-popup.tool-tip::after{
content: '';
position: absolute;
width: 12px;
height: 12px;
top: -14px;
left: 50%;
border: 1px solid #ccc;
transform: translate(-50%,50%) rotate(45deg);
z-index: 10;
background-color: white;
border-width: 1px 0 0 1px !important;
}
.dark .tool-popup.tool-tip::after{
border: 1px solid #31343c;
background-color: #18191c;
}
.tool-popup.tool-tip a{
color: #0088ff;
}
.tool-popup .gwt-MenuBar-vertical {
background: transparent;
color: #333;
}
.dark .tool-popup .gwt-MenuBar-vertical {
color: #d3d5d6;
}
.tool-popup .gwt-MenuBar .gwt-MenuItem {
font-size: 14px;
cursor: pointer;
padding: 5px 25px 5px 10px;
}
.tool-popup .gwt-MenuBar .gwt-MenuItem-selected {
background: rgba(216, 240, 250, .6);
}
.dark .tool-popup .gwt-MenuBar .gwt-MenuItem-selected {
background: #232428;
}
.tool-item {
display: inline-block;
font-size: 14px;
/* font-family: arial; */
vertical-align: top;
padding: 2px 8px
}
.Main-menu img {
vertical-align: middle;
display: none;
}
.Main-menu i {
vertical-align: middle;
display: flex;
fill: white;
width: 35px;
height: 20px;
text-align: center;
margin: auto;
margin-bottom: 5px;
align-items: center;
justify-content: center;
}
.Main-menu:hover{color:#69aaff}
.chart-menu {
margin: 0;
list-style: none;
max-height: 500px;
overflow: auto;
}
.chart-menu li a {
color: #d3d5d6;
display: block;
padding: 3px 10px;
position: relative;
outline: 0;
height:28px;
}
.layout-menu li{
display: inline;
float: left;
}
.layout-menu li a {
display: inline-block;
padding: 3px 1px;
}
.chart-menu li hr{
margin: 1px 8px;
border: 0;
border-bottom: 1px solid #ccc;
}
.chart-menu li a {
color: var(--FONT-COLOR);
cursor: pointer;
}
.chart-menu svg {
fill: currentColor;
}
.chart-menu li a:HOVER {
background-color: rgba(216, 240, 250, 0.6);
}
.dark .chart-menu li a:HOVER {
background-color: #232428;
}
@media only screen and (max-width: 450px) {
.Main-menu img {
display: inline;
}
.Main-menu span {
display: none;
}
}
.gwt-DialogBox {
width: 400px;
}
.btn-primary, .gwt-Button {
background: #14488E;
color: white;
padding: 6px 25px;
margin-bottom: 0;
font-size: 12px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
text-transform: uppercase;
letter-spacing: 0.8px;
font-weight: 500;
}
.btn-primary[disabled], .gwt-Button[disabled] {
opacity: 0.4;
}
.btn-large {
padding: 12px 12px;
}
.btn-primary:hover {
color: white;
text-decoration: none;
}
.dark .btn-secondary {
background-color:#1E1E1E;
color: #B8BCC3;
border: 1px solid #1E1E1E;
box-sizing: border-box;
}
.light .btn-secondary {
background-color:#EDEFF2;
color: #6C6C6C;
border: 1px solid #EDEFF2;
box-sizing: border-box;
}
.light .btn-secondary:hover{background-color:#eaeaea}
.dialogVPanel {
margin: 5px;
}
select, input {
padding: 2px 5px;
border: 1px solid #ccc;
background-color: #ffffff;
border-radius: 4px;
outline: none;
box-sizing: border-box;
}
.dark select, .dark input, .dark textarea{
border: 1px solid #25272c;
background-color: #25272c;
color:#ddd;
}
input:disabled {
opacity: 0.7;
}
.color-box {
display: block;;
cursor: pointer;
width: fit-content;
}
.color-box div {
width: 24px;
height: 24px;
/* border: 1px solid #ccc; */
border-radius: 4px;
}
.user-popup {
padding: 5px 0px;
background-color: white;
border-radius: 5px;
border: 1px solid #ccc;
z-index: 100;
}
.dark .user-popup{
background-color: #18191c;
border: 1px solid #31343c
}
.color-panel {
border-spacing: 5px;
}
.color-panel span {
width: 24px;
height: 24px;
/* border: 1px solid #333; */
cursor: pointer;
display: block;
border-radius: 4px;
box-sizing: border-box;
}
.color-panel a {
font-size: 12px;
cursor: pointer;
}
.dark .color-panel a {
color: #d3d5d6;
}
.custom-dialog {
background-color: #dfdddd;
border: 1px solid #9597a1;
border-radius: 5px;
border: 1px solid #cdcdcd;
z-index: 12;
}
.dark .custom-dialog{
background-color: #23242a;
border: 1px solid #28292e;
box-shadow: 2px 0 16px 0 rgba(0, 0, 0, 0.24);
}
.custom-dialog .custom-dialog-header {
height: 40px;
background-color: #dfdddd;
font-size: 17px;
vertical-align: middle;
color: #000;
font-weight: bold;
border-radius: 5px 5px 0 0px;
box-sizing: border-box;
border-bottom: 1px solid #cdcdcd;
cursor: move;
display: flex;
justify-content: space-between;
}
.dark .custom-dialog .custom-dialog-header {
background-color: #23242a;
border-bottom: 1px solid #1e1f23;
color:var(--FONT-COLOR);
box-shadow: 0px 1px 0 0 #292a31;
display: flex;
justify-content: space-between;
}
/* .custom-dialog .custom-dialog-header .caption {
padding: 8px;
display: inline-block;
padding-left: 20px;
} */
.custom-dialog .custom-dialog-header .close-buton {
display: inline-block;
float: right;
background: url(/images/close.svg) no-repeat;
width: 16px;
height: 16px;
cursor: pointer;
background-position: 4px 4px;
}
.custom-dialog .footer {
/* background-color: #dfdddd; */
border-radius: 0px 0px 5px 5px;
border-top: 1px solid #cdcdcd;
}
.dark .custom-dialog .footer {
/* background-color:#23242a;
background-color: #23242a; */
border-top: 1px solid #1e1f23;
color: #9f9fa0;
box-shadow: 0px 1px 0 0 #292a31;
}
.custom-dialog .content-panel{
background-color: #fff;
border-radius: 4px;
border: 1px solid #ccc;
margin: 12px;
color: #68696a;
}
.dark .custom-dialog .content-panel{
background-color: #18191d;
border: 1px solid #2a2b31;
color: var(--FONT-COLOR);
}
.custom-dialog .footer table {
margin: auto;
}
.custom-dialog .footer td {
padding: 10px;
}
.custom-dialog .message-box {
padding: 20px;
text-align: center;
min-width: 250px;
max-width: 350px;
color: #4a5668;
font-size: 16px;
}
.message-box li {
text-align: left;
}
.search-box {
width: 100%;
table-layout: fixed;
border: 1px solid #ccc;
background: #fafafa;
border-radius: 4px;
}
.light .search-box {
background: #ffffff;
}
.search-box.with-focus{
border: 1px solid #2070D8;
}
.dark .search-box{
background-color: #23242a;
border: 1px solid #28292e;
}
.search-box input {
border: none;
outline: none;
width: 100%;
padding: 5px 10px;
box-sizing: border-box;
background-color: transparent;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.search-box img {
height: 24px;
width: 24px;
vertical-align: middle;
padding: 0 4px;
}
.custom-dialog .message-box {
padding: 20px;
text-align: center;
min-width: 250px;
max-width: 350px;
color: #9f9fa0;
font-size: 16px;
}
.light .custom-dialog .message-box{
color: #333;
}
.message-box li {
text-align: left;
}
.loading {
width: 100%;
background: url(images/loading.svg) no-repeat center;
height: 40px;
}
.ind-list li {
color: var(--FONT-COLOR);;
display: block;
padding: 3px;
position: relative;
outline: 0;
cursor: pointer;
font-size: 14px;
}
.ind-list li:HOVER {
background-color: rgba(216, 240, 250, 0.6);
}
.dark .ind-list li:HOVER {
background-color: rgba(0, 0, 0, 0.6);
}
.ind-list li.selected {
background-color: #2070D8;
color: white;
}
.param-table, .param-table input, .param-table select {
font-size: 14px;
max-width: 220px;
}
.dark .param-table td{
color:var(--FONT-COLOR);
}
.gwt-PopupPanelGlass {
background-color: #000;
opacity: 0.7;
filter: alpha(opacity = 30);
z-index: 3;
}
.highcharts-container {
border-radius: 4px;
}
.tpchart {
position: relative;
outline: none;
overflow: hidden;
box-sizing: border-box;
background-color: white;
float: left;
width: 100%;
height: 100%;
}
.two-chart .stock-chart, .three-chart .stock-chart, .four-chart .stock-chart{
border: 1px solid #ccc;
box-sizing: border-box;
}
.two-chart .tpchart.active .stock-chart, .three-chart .tpchart.active .stock-chart , .four-chart .tpchart.active .stock-chart {
border: 1px solid #2070D8;
}
.dark .tpchart {
color: #131722;
background-color: #18191d;
}
.two-chart.hor-layout .one{
width: 50%;
height: 100%;
padding: 0px 5px 0px 0px;
}
.two-chart.hor-layout .two{
width: 50%;
height: 100%;
padding: 0px 0px 0px 5px;
}
.two-chart.ver-layout .one{
width: 100%;
height: 50%;
padding: 0px 0px 5px;
}
.two-chart.ver-layout .two{
width: 100%;
height: 50%;
padding: 5px 0px 0px;
}
.three-chart.hor-layout .one{
width: 33.33%;
height: 100%;
padding: 0px 5px 0px 0px;
}
.three-chart.hor-layout .two{
width: 33.33%;
height: 100%;
padding: 0px 5px;
}
.three-chart.hor-layout .three{
width: 33.33%;
height: 100%;
padding: 0px 0px 0px 5px;
}
.three-chart.ver-layout .one{
height: 33.33%;
width: 100%;
padding: 0px 0px 5px;
}
.three-chart.ver-layout .two{
height: 33.33%;
width: 100%;
padding: 5px 0px;
}
.three-chart.ver-layout .three{
height: 33.33%;
width: 100%;
padding: 5px 0px 0px;
}
.three-chart.top-layout .one{
height: 50%;
width: 100%;
padding: 0px 0px 5px;
}
.three-chart.top-layout .two{
height: 50%;
width: 50%;
padding: 5px 5px 0px 0px;
}
.three-chart.top-layout .three{
height: 50%;
width: 50%;
padding: 5px 0px 0px 5px;
}
.three-chart.left-layout .one{
height: 100%;
width: 50%;
padding: 0px 5px 0px 0px;
}
.three-chart.left-layout .two{
height: 50%;
width: 50%;
padding: 0px 0px 5px 5px;
}
.three-chart.left-layout .three{
height: 50%;
width: 50%;
padding: 5px 0px 0px 5px;
}
.four-chart .one{
height: 50%;
width: 50%;
padding: 0px 5px 5px 0px;;
}
.four-chart .two{
height: 50%;
width: 50%;
padding: 0px 0px 5px 5px;
}
.four-chart .three {
height: 50%;
width: 50%;
padding: 5px 5px 0px 0px;
}
.four-chart .four{
height: 50%;
width: 50%;
padding: 5px 0px 0px 5px;
}
#chart-area .maxChart{
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
padding: 0;
width: 100%;
height: 100%;
z-index: 10;
}
.shape-setting {
position: absolute;
top: -20px;
left: 50%;
transform: translateX(-50%);
}
.right-float {
position: absolute;
right: 70px;
bottom: 30px;
border: 1px solid transparent;
border-radius: 50%;
width: 28px;
height: 28px;
color: #758696;
z-index: 4;
box-shadow: 0 1px 4px 0 rgba(117, 134, 150);
padding: 4px;
box-sizing: border-box;
}
.symbolLbl {
position: absolute;
left: 0px;
font-size: 11px;
z-index: 10;
color: #333;
background-color: rgb(255, 255, 255, 0.4);
padding: 0px 8px;
border-radius: 0px;
margin-right: 50px;
margin-top: 0px;
z-index: 2;
}
.symbolLbl td {
font-size: 12px;
vertical-align: top;
line-height: 22px;
padding: 0 3px;
}
.dark .symbolLbl {
background-color: rgb(28, 28, 28, 0.4);
color: #ddd;
}
.symbolLbl span {
/* white-space: nowrap;
float:left; */
}
.symbolLbl select {
background-color: transparent;
width: 60px;
}
.symbolLbl .setting {
display: inline-block;
width: 18px;
height: 18px;
color: #333;
vertical-align: middle;
cursor: pointer;
padding: 0 2px;
}
.chart-close{
width: 20px;
height: 20px;
position: absolute;
color: #aaa;
right: 5px;
z-index: 4;
margin-right: 10px;
margin-top: 5px;
cursor: pointer;
display: none;
}
.chart-max{
right: 25px;
}
.two-chart .chart-close, .three-chart .chart-close, .four-chart .chart-close{
display: block;
}
.dark .symbolLbl .setting {
color: #84898c;
}
.tool-setting-panel {
position: absolute;
height: 26px;
left: 50%;
transform: translateX(-50%);
z-index: 12;
color: #333;
top: 30px;
width: auto;
opacity:0;
box-shadow: 0 2px 4px 0 rgba(107, 121, 136, .4);
border-radius: 1px;
transition: opacity .18s;
border-color: #e6eaef;
background-color: #fff;
}
.tool-setting-panel table {
height: 100%;
border-collapse: collapse;
}
.tool-setting-panel td {
border-left: 1px solid #6666;
border-right: 1px solid #6666;
vertical-align: middle;
line-height: 33px;
}
.tool-setting-panel .setting {
padding: 0 4px;
display: block;
width: 24px;
height: 24px;
cursor: pointer;
}
.tool-setting-panel .tool-cell {
background-color: #ccc;
color: #333;
}
.tool-setting-panel .setting svg{
touch-action:none;
}
.dark .tool-setting-panel {
color: white;
box-shadow: 0 2px 4px 0 #000;
background-color: #1C2030;
}
.selected svg {
fill: currentColor;
color: #2070D8;
}
svg .drawing-tool {
cursor: pointer;
shape-rendering: auto;
}
svg .handle {
fill: currentColor;
stroke: #000;
stroke-width: 1;
shape-rendering: auto;
}
.dark svg .handle {
stroke: white;
}
svg .drawing-tool:hover .handle {
visibility: visible;
}
svg .drawing-tool.selected .handle {
stroke-width: 2;
}
.touch-device svg .drawing-tool .handle {
r:10;
}
svg .drawing-tool.selected .has-text rect {
stroke-width: 1;
stroke-dasharray: 5 2;
stroke: #000;
}
.stroke-width-selecion {
display: block;
padding: 2px 8px;
border: 1px solid #ccc;
background-color: #fafafa;
border-radius: 4px;
outline: none;
width: 50px;
background-image:
url("data:image/svg+xml;charset=utf-8, \
");
background-repeat: no-repeat;
background-size: 9px auto;
background-position: right 3px center;
}
.stoke-width-table {
width: 66px;
cursor: pointer;
}
.percent {
background: url("/images/percent.svg") #fafafa center right no-repeat;
background-position: center right;
background-size: 30% 60%;
width: 50px !important;
text-align: right;
padding-right: 16px;
}
.right-align{
text-align: right;
padding-right: 15px;
}
.wright-align{
text-align: right;
}
.wleft-align{
text-align: left;
}
.percent-full{
background: url("/images/percent.svg") #fafafa center right no-repeat;
background-position: center right;
background-size: 10% 50%;
padding-right: 25px;
}
.leftMenu{
width: 100%;
table-layout: fixed;
padding: 15px, 0;
}
.leftMenu td {
font-size: 15px;
cursor: pointer;
padding: 10px;
color: var(--FONT-COLOR);
vertical-align: middle;
}
.light .leftMenu td{
color:#333;
}
.leftMenu .selected td{
background-color: #DFF3F3;
}
.dark .leftMenu .selected td {
background-color: rgba(0,0,0 ,0.6);
}
.Pref-Table td{
border-bottom: 1px solid #ccc;
vertical-align: top;
padding: 5px;
}
.Pref-Table a{
width: 24px;
height: 24px;
cursor: pointer;
display: inline-block;
}
.account{
display: flex;
flex-flow: column;
display: -webkit-flex; /* Safari */
-webkit-flex-direction:column; /* Safari 6.1+ */
height: 100%;
}
.account-left{
position: absolute;
left: 0;
top: 0;
width: 44px;
height: 100%;
background-color: #23242a;
overflow: hidden;
white-space: nowrap;
white-space: nowrap;
z-index: 10;
border-radius: 0 8px 0px 0;
border: 1px solid #2a2b31;
transition: width .2s ease;
}
.account-left:HOVER, .account-left.expand{
width:250px;
max-width: 100%;
transition: width .2s ease;
}
.light .account-left{
background-color: #ffffff;
border: 1px solid #ccc;
}
.light .account-left:HOVER{
background-color: #fff;
border: 1px solid #ccc;
}
.account-right{
margin-left: 60px;
height: 100%;
}
.account-background {
background-color: #23242a;
}
.light .account-background {
background-color: #DDDDDD;
}
.light .account-right{
background-color: #ffffff;
}
@media only screen and (max-width: 768px){
.account-left {
position: static;
height:auto;
width: 100%;
border-bottom: 1px solid #2070D8;
border-right: 0;
}
.account-right{
margin-left:0;
height: 100%
}
}
.sideMenu {
margin-top: 15px;
/* padding: 10px; */
}
.sideMenu li {
display: list-item;
list-style: none;
font-size: 15px;
color: currentColor;
cursor: pointer;
/* margin: 4px 0; */
/* border: 1px solid currentColor; */
/* padding: 5px 0;*/
padding-right: 10px;
}
.sideMenu li >span{
line-height: 28px;
vertical-align: text-bottom;
}
.sideMenu li.selected {
color: white;
font-weight: bold;
background-color: #2070D8;
}
.sideMenu li.selected > i > svg{
color:white;
}
@media only screen and (max-width: 768px) {
.sideMenu {
padding: 0px;
}
.sideMenu li {
display: inline-block;
padding: 5px 10px;
margin: 0 8px;
border: 0;
}
}
.custom-form .link {
color: #0097a7;
cursor: pointer;
text-decoration: none;
padding: 5px 0;
display: block;
}
.custom-form input[type="text"], .custom-form input[type="password"]{
width: 100%;
height: 33px;
font-size: 16px;
/* color: #4a5668;
line-height: 44px;
border: 1px solid #d7dbde;
border-radius: 4px;
padding-left: 15px;
padding-right: 15px; */
outline: none!important;
-webkit-appearance: none!important;
-moz-appearance: none;
box-sizing: border-box;
appearance: none;
margin-bottom: 10px;
/* line-height: 18px;
background-color: #f5f3f3; */
}
.symbol_search {
border-radius: 4px;
position: relative;
width: 300px;
border: 1px solid #e0dfdf;
box-sizing: border-box;
}
.dark .symbol_search {
border: 1px solid #28292e;
}
.dark .symbol_search {
border: 1px solid #28292e;
}
.symbol_search.with-focus{
border:1px solid #2070D8;
}
.serach_left {
position: relative;
height: 29px;
float: left;
width: 55px;
display: inline-block;
line-height: 30px;
}
.market {
height: 29px;
margin: 0;
padding-left: 5px;
overflow: hidden;
border-radius: 4px 0 0 4px;
font-size: 14px;
padding-right: 7px;
background-color: #ffffff;
box-shadow: 1px 0 0 0 #e0dfdf;
}
.dark .market{
border-right: 1px solid #1a1b1f;
background-color: #28292e;
color: #ddd;
box-shadow: 1px 0 0 0 #1a1b1f;
}
.market_select {
position: absolute;
display: block;
top: 0px;
left: 0;
height: 29px;
width: auto;
font-family: arial,sans-serif;
outline: 0;
margin: 0;
padding: 0;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
visibility: visible;
border: 0;
line-height: 35px;
}
.serach_fill {
position: relative;
height: 29px;
overflow: hidden;
border-radius: 0 4px 4px 0;
background: #ffffff;
}
.dark .serach_fill {
background: #1c1d21;
}
.serach_input {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
line-height: 15px;
padding: 6px 10px 6px 0;
margin: 0;
border: 0;
height: 33px;
font-family: arial,sans-serif;
font-size: 15px;
background: 0 0;
outline: 0;
-webkit-appearance: none;
box-shadow: none;
text-indent: 8px;
box-sizing: border-box;
background: url(http://beta.definedge.com/images/magnifying-glass.svg) no-repeat;
background-position: center right;
background-size: 20px;
}
.dark .serach_input {
color: white;
}
.symbol_search .search-box{
height: 100%;
background-color: transparent;
border: 0;
}
.symbol_search .search-box input{
height: 100%;
background-color: transparent;
}
.symbol_search.expandable-search .search-box input{
background-image: url(/images/magnifying-glass.svg);
background-repeat: no-repeat;
background-size: 14px;
background-position: 5px center;
padding-left: 30px;
text-transform: uppercase;
}
.symbol_search .search-box input:focus{
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.symbol_search.expandable-search{
width: auto;
visibility: visible;
display: flex;
margin-right: 5px;
}
.symbol_search.expandable-search .serach_fill{
width: 30px;
-webkit-transition: width .55s ease;
-moz-transition: width .55s ease;
-ms-transition: width .55s ease;
-o-transition: width .55s ease;
transition: width .55s ease;
}
.symbol_search.expandable-search.with-focus .serach_fill, .symbol_search.expandable-search:HOVER .serach_fill{
width: 180px ;
}
.symbol_search.expandable-search .close-td{
display: none;
}
.symbol_search.expandable-search.with-focus .close-td, .symbol_search.expandable-search:HOVER .close-td{
display: table-cell;
}
.symbolLbl .gwt-DisclosurePanel .header table{
border-spacing: 0;
margin-left: -3px;
}
.symbolLbl .gwt-DisclosurePanel .header td{
line-height: 16px;
}
.symbol-search-list{
display:flex;
justify-content: space-between;
padding: 0 8px;
}
.symbol-search-list .exchange{
font-size: 75%;
background-color: #333;
padding: 2px 5px;
min-width: 25px;
text-align: center;
border-radius: 3px;
}
.light .symbol-search-list .exchange{
background-color: #ccc;
}
.dark .watch-list .stockdetail .ws-btn{background-color: #69727b;}
.light .watch-list .stockdetail .ws-btn{background-color: #6c7379;}
.light .symbolLbl .gwt-DisclosurePanel a{
color:#333;
height: 20px;
}
.dark .symbolLbl .gwt-DisclosurePanel a{
color:#84898c;
height: 20px;
}
.custom-table{
border-collapse: collapse;
/* border-radius: 4px; */
overflow: hidden;
}
.light .custom-table{
margin-top: -1px;
}
.custom-table .selected-grp{
background-color: #433E36;
}
.light .custom-table .selected-grp{
background-color: #FEE4B9;
}
.custom-table td {
border: 1px solid #27282D;
border-collapse: collapse;
color: var(--FONT-COLOR);
}
.light .custom-table td {
border: 1px solid #ccc;
color:#333;
}
.custom-table a{
width: 20px;
height: 20px;
cursor: pointer;
display: inline-block;
}
.table-header {
background-color: #31323A;
color: currentColor !important;
}
.light .table-header {
background-color: #fff;
}
.light .scrip-border{
border : none !important;
}
.light .table-header {
background-color: #fff;
outline: 1px #ccc solid;
margin-left: 1px;
margin-right: 1px;
}
.back-testing-result{
min-height: calc(100% - 220px);
height: 450px;
margin-bottom: 5px;
}
.gwt-DateBox {
padding: 2px 4px;
border: 1px solid #ccc;
border-top: 1px solid #999;
font-size: 100%;
box-sizing: border-box;
width: 100%;
max-width: 160px;
}
.gwt-DateBox input {
width: 8em;
}
.dateBoxFormatError {
background: #ffcccc;
}
.dateBoxPopup {
z-index:1000;
}
.gwt-DatePicker {
border: 1px solid #ccc;
border-top:1px solid #999;
cursor: default;
}
.gwt-DatePicker td,
.datePickerMonthSelector td:focus {
outline: none;
}
.datePickerDays {
width: 100%;
background: white;
}
.datePickerDay,
.datePickerWeekdayLabel,
.datePickerWeekendLabel {
font-size: 85%;
text-align: center;
padding: 4px;
outline: none;
font-weight:bold;
color:#333;
border-right: 1px solid #EDEDED;
border-bottom: 1px solid #EDEDED;
}
.datePickerWeekdayLabel,
.datePickerWeekendLabel {
background: #fff;
padding: 0px 4px 2px;
cursor: default;
color:#666;
font-size:70%;
font-weight:normal;
}
.datePickerDay {
padding: 4px 7px;
cursor: hand;
cursor: pointer;
}
.datePickerDayIsWeekend {
background: #f7f7f7;
}
.datePickerDayIsFiller {
color: #999;
font-weight:normal;
}
.datePickerDayIsValue {
background: #d7dfe8;
}
.datePickerDayIsDisabled {
color: #AAAAAA;
font-style: italic;
}
.datePickerDayIsHighlighted {
background: #F0E68C;
}
.datePickerDayIsValueAndHighlighted {
background: #d7dfe8;
}
.datePickerDayIsToday {
padding: 3px;
color: #fff;
background: #333;
/* background: url(images/hborder.png) repeat-x 0px -2607px; */
}
.datePickerMonthSelector {
width: 100%;
padding: 1px 0 5px 0;
background: #fff;
}
td.datePickerMonth,
td.datePickerYear {
text-align: center;
vertical-align: middle;
white-space: nowrap;
font-size: 100%;
font-weight: bold;
color: #333;
}
.datePickerPreviousButton,
.datePickerNextButton,
.datePickerPreviousYearButton,
.datePickerNextYearButton {
font-size: 120%;
line-height: 1em;
color: #3a6aad;
cursor: hand;
cursor: pointer;
font-weight: bold;
padding: 0px 4px;
outline: none;
}
.data-grid th{
white-space: normal !important;
font-weight: normal !important;
outline: none !important;
text-shadow: none;
color: var(--FONT-COLOR);
padding: 10px 5px;
font-size: 14px;
overflow: hidden;
text-overflow: ellipsis;
}
.dark .data-grid th{
background-color: #31323A !important;
}
.data-grid td{
padding: 2px;
vertical-align: text-top;
}
.dark .data-grid td{
background-color: #31323A !important;
border-color: #31323A !important;
color: var(--FONT-COLOR) !important;
}
.data-grid td{
padding: 5px ;
vertical-align: text-top;
border-bottom-color: #ccc;
border-color: #ccc !important;
border-width: 1px;
overflow: visible;
vertical-align: middle;
}
.dark .data-grid td{
background-color: #1c1d21 !important;
border-color: #31323A !important;
border-bottom-color: #27282D !important;
border-width: 1px
}
.data-grid .stockdetail{
padding-left: 3px;
position: relative;
}
.data-grid .badges{
display: flex;
gap: 6px;
z-index: -2;
}
.data-grid .badges .sector, .data-grid .badges .segment, .data-grid .badges .mkt-cap{
color: #6F7277;
padding: 0 8px;
border-radius: 10px;
font-size: 11px;
padding-bottom: 2px;
}
.data-grid .badges .sector{
border:1px solid #cccccc;
}
.data-grid .badges .segment{
border:1px solid #cccccc;
}
.data-grid .badges .mkt-cap{
border:1px solid #cccccc;
}
.dark .data-grid .badges .sector{
border:1px solid #31323a;
}
.dark .data-grid .badges .segment{
border:1px solid #31323a;
}
.dark .data-grid .badges .mkt-cap{
border:1px solid #31323a;
}
.dark .data-grid .disabled td{
color: #58595C !important;
}
.data-grid .selected td{
background-color: #433E36!important;
color: white !important;
border-color: transparent !important;
}
.light .data-grid .selected td{
background-color: #ffffff!important;
color: black !important;
border-color: transparent !important;
}
.data-grid .footer{
text-align: right;
}
.buy-button{
display: block;
background-color: #53B987;
border-radius: 20px;
padding: 5px 10px;
color: white;
margin-right: 5px;
}
.sell-button{
display: block;
background-color: #EB4D5C;
border-radius: 20px;
padding: 5px 10px;
color: white;
margin-right: 10px;
}
.matrix-trend{
width: 100%;
border: 1px solid #fafafa;
padding: 10px;
}
.ws-status-indicator{
width: 20px;
height: 20px;
margin: auto;
border-radius: 50%;
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
}
.ws-status-indicator.green{
background-color: green;
}
.ws-status-indicator.red{
background-color: red;
animation: blink 1s infinite;
}
@keyframes blink{
0%{opacity: 1;}
50%{opacity: .25;}
100%{opacity: 1;}
}
.gwt-TabLayoutPanel {
}
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTabs {
}
.gwt-TabLayoutPanelContentContainer {
border-color: #2070D8;
border-style: solid;
border-width: 2px 0 0 0
}
.gwt-TabLayoutPanel .gwt-TabLayoutPanelContent {
border-color: transparent;
border-style: solid;
border-width: 1px;
overflow: hidden;
padding: 6px;
}
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab {
margin-left: 10px;
padding: 6px;
cursor: pointer;
cursor: hand;
color: #333;
font-weight: 500;
text-align: center;
background: transparent;
border-radius: 4px 4px 0 0;
}
.dark .gwt-TabLayoutPanel .gwt-TabLayoutPanelTab{
color:#828181;
}
.dark .gwt-TabLayoutPanel .gwt-TabLayoutPanelTab{
color: #828181;
}
.gwt-TabLayoutPanel .gwt-TabLayoutPanelTab-selected {
cursor: default;
background: #2070D8;
color: white !important;
}
.sector-widget{
border: 1px solid #999;
padding: 8px;
border-radius:6px;
color: #333;
}
.sector-widget div{
font-size: 13px;
line-height: 19px;
}
.sector-widget div > b{
font-size: 14px;
}
.buyButton, .sellButton{
/* display: none; */
cursor: pointer;
color: white;
border: 0;
border-radius: 4px;
padding: 3px 14px;
font-size: 12px;
}
.buyButton{
background-color: var(--new-buy-color);
}
.sellButton{
background-color: var(--new-sell-color);
}
.symbolLbl:HOVER .buyButton, .symbolLbl:HOVER .sellButton{
/* display:block; */
}
.scrip-report{
color: #056162;
font-size: 14px;
background: #fff;
overflow-x: hidden;
}
.report-header{
background-color: #E6FFEE;
padding: 8px 20px;
font-size: 18px;
color: #056162;
border-radius: 18px;
margin: 12px 0;
}
.gsb{
display: flex; justify-content: space-between;
}
.gsb div{
padding: 8px;
border-left: 3px solid #336eb6;
}
.gsb-com{
display: flex; margin-top: 5px;
}
.gsb-com div{
padding: 8px;
border-left: 3px solid #336eb6;
}
.pivot-table{
border-collapse: collapse;
}
.pivot-table td{
border: 1px solid #056162;
text-align: center;
}
.gwt-CheckBox{
position: relative;
padding-left: 15px;
margin-bottom: 5px;
cursor: pointer;
font-size: 14px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.gwt-CheckBox input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.gwt-CheckBox label {
position: absolute;
top: 0;
left: 0;
height: 15px;
width: 15px;
background-color: #eee;
border: 1px solid #2196F3;
cursor: pointer;
min-width: 15px;
}
/* On mouse-over, add a grey background color */
.gwt-CheckBox:hover input ~ .checkmark {
background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.gwt-CheckBox input:checked ~ label {
background-color: #2196F3;
}
.dark .checkbox-bg input:checked ~ label {
background-color: #0b6dd4;
border: 1px solid #0b6dd4;
}
.dark .checkbox-bg label {
background-color: #25272c;
border: 1px solid #0b6dd4;
}
.checkbox-bg label {
border-radius: 3px;
}
/* Create the checkmark/indicator (hidden when not checked) */
.gwt-CheckBox label:after {
content: "";
position: absolute;
display: none;
}
/* Show the checkmark when checked */
.gwt-CheckBox input:checked ~ label:after {
display: block;
}
/* Style the checkmark/indicator */
.gwt-CheckBox label:after {
left: 5px;
top: 0px;
width: 3px;
height: 10px;
border: solid white;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.chart-controller{
border-radius: 4px;
position: relative;
width: 230px;
border: 1px solid #28292e;
box-sizing: border-box;
height: 38px;
margin-left: 15px;
cursor: pointer;
table-layout: fixed;
}
.chart-controller td{
border-right: 0px solid #444;
padding: 0 5px;
user-select: none;
background-color: #23242a;
}
.light .watch-list .search-symbol{background: #EDEFF2;}
.light .chart-controller{
color: #5b5c60;
border: 1px solid #ccc;
}
.light .chart-controller td{
border-right: 0px solid #ccc;
background-color: #ffffff;
}
.chart-controller .group{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: bold;
}
.chart-controller .scrip{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.d-sector-dummy{
position: absolute;
z-index: -10;
top:0;
left: 0;
visibility: hidden;
}
.sector-widget{
width: 330px;
height: 190px;
}
.seasonality-index{
border-top: 2px solid #6f7277;
}
.watch-list{
height: calc(100% - 60px);
display: flex;
flex-direction: column;
overflow: hidden;
}
.watch-list .search-symbol{display: flex;
padding: 8px 10px ;
background: #1E1E1E;}
.watch-list a{
color: #828181;
}
.watch-list .stocklist{
height: 100%;
padding: 10px 5px 10px 10px;
border-radius: 6px;
overflow-y: auto;
}
.light .watch-list .stocklist{
background-color: #fff;
}
.stocklist .stockdetail{
border-bottom: 1px solid #1E1E1E;
padding: 4px 0;
}
.light .stocklist .stockdetail{
border-bottom: 1px solid #EDEFF2;
}
.light .buy-sell-popup .popupContent{background: #ffffff;}
.light .buy-sell-popup .content-panel .order-widget{background: #ffffff;}
.light .buy-sell-popup .margin-table{background: #EDEFF2;}
.light .order-tab a{border-bottom: 2px solid #EDEFF2; color: #000;}
.light .buy-sell-popup .content-panel input[type="radio"]:checked+label{color: #000;}
.light .buy-sell-popup .content-panel input[type="radio"]:not(:checked ) +label{color: #000;}
.light .buy-sell-popup .content-panel td{color: #000;}
.stockdetail .first td{
font-size: 12px;
text-transform: uppercase;
}
.stockdetail .second td {
font-size: 11px;
padding-bottom: 5px;
color: #6C6C6C;
}
.stockdetail .priceUp{
text-align: right;
color: var(--blue-buy-color);
}
.stockdetail .priceDown{
text-align: right;
color: var(--red-sell-color);
}
.stockdetail .detail td{
width: 25%;
font-size: 13px;
white-space: nowrap;
text-align: left;
}
.stockdetail .detail td:nth-child(even){
text-align: right;
}
.stockdetail .bidPanel .header, .stockdetail .askPanel .header{
background-color: #23242a;
}
.light .stockdetail .bidPanel .header,.light .stockdetail .askPanel .header{
background-color: #dddddd;
}
.stockdetail .bidPanel .header td, .stockdetail .askPanel .header td{
padding: 6px;
}
.stockdetail .bidPanel td:FIRST-CHILD{
font-size: 13px;
text-align: left;
padding: 6px;
}
.stockdetail .bidPanel td:nth-child(2){
text-align: right;
font-size: 13px;
}
.stockdetail .askPanel td{
font-size: 13px;
text-align: left;
}
.stockdetail .askPanel td:nth-child(2){
text-align: right;
padding: 6px;
}
.stockdetail .bidPanel .graph{
position: absolute;
height: 100%;
background-color: #53B98744;
right: 1px;
z-index: 0;
border-radius: 4px 0 0 4px;
}
.stockdetail .bidPanel .qty{
font-size: 13px;
z-index: 2;
position: absolute;
top: 0;
right: 5px;
line-height: 25px;
color: var(--buy-color);
}
.stockdetail .askPanel .qty{
padding-right: 6px;
font-size: 13px;
z-index: 2;
position: absolute;
top: 0;
left: 5px;
line-height: 25px;
color: var(--sell-color);
}
.stockdetail .askPanel .graph{
position: absolute;
height: 100%;
background-color: #EB4D5C44;
left: 1px;
z-index: 0;
border-radius: 0 4px 4px 0;
}
.stockdetail .buy{
background-color: var(--new-buy-color);
width: 90%;
margin: 5px auto;
display: block;
}
.stockdetail .sell{
background-color: var(--new-sell-color);
width: 90%;
margin: 5px auto;
display: block;
}
.floating-view{
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
background-color: #fff;
width: 380px;
position: fixed;
top: 0;
bottom: 0;
right: -100%;
z-index: 10;
webkit-transition: right .3s ease-out;
transition: right .3s ease-out;
color: var(--FONT-COLOR);
background-color: #23242a;
}
.light .floating-view {
background-color: #fff;
box-shadow: 0px 0px 10px 5px #ddd;
}
.floating-view.reveal{
right: 0;
}
#reveal-panel #close a{
float: right;
display: block;
width: 20px;
height: 20px;
margin: 5px;
cursor: pointer;
color: #828181;
}
.floating-view .close {
float: right;
display: block;
width: 20px;
height: 20px;
margin: 5px;
cursor: pointer;
color: #828181;
}
.order-widget{
display: flex;
padding: 0 30px 20px 30px;
height: 100%;
box-sizing: border-box;
flex-direction: column;
font-size: 14px;
}
.content-panel .order-widget{
padding: 10px 0px;
min-width: 500px;
}
.order-widget .symbol{
font-size: 16px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
letter-spacing: normal;
text-align: left;
color: var(--INPUT-COLOR);
}
.order-widget .price{
font-size: 16px;
font-weight: 500;
font-stretch: normal;
font-style: normal;
color: var(--INPUT-COLOR);
}
.order-widget .nse , .order-widget .bse{
font-size: 12px;
border-radius: 8px;
padding: 2px 5px;
margin: 0 8px 0 0;
cursor: pointer;
}
.order-widget .nse.selected, .order-widget .bse.selected{
background-color: #9f9fa0;
color: #333;
}
.light .order-widget .nse.selected, .order-widget .bse.selected{
background-color: #9f9fa075;
}
.order-widget .percentChange{
font-size: 13px;
padding-top: 6px;
}
.order-widget .percentChange.up{
color: var(--buy-color);
}
.order-widget .percentChange.down{
color: var(--sell-color);
}
.order-widget .bid, .order-widget .ask{
text-align: right;
padding-top: 5px;
font-size: 13px;
}
.order-widget .order-sucess{
width: 70px;
height: 70px;
background-color: #253931;
margin: auto;
/* opacity: 0.1; */
padding: 15px;
box-sizing: border-box;
border-radius: 50%;
}
.order-widget .transaction-type{
background-color: #34353c;
margin-left: -30px;
margin-right: -30px;
height: 38px;
margin-top: 10px;
}
.light .order-widget .transaction-type{
background-color: #ccc;
color: #000;
}
.transaction-type .buy-type, .transaction-type .sell-type{
width: 100%;
display: block;
height: 100%;
color: currentColor;
text-align: center;
line-height: 38px;
font-size: 14px;
font-weight: 600;
}
.transaction-type .buy-type.selected{
background-color: var(--new-buy-color);
color: var(--INPUT-COLOR);;
}
.light .transaction-type .buy-type.selected{
background-color: var(--new-buy-color);
color: #fff;
}
.transaction-type .sell-type.selected{
background-color: var(--new-sell-color);
color: var(--INPUT-COLOR);
}
.light .transaction-type .sell-type.selected{
background-color: var(--new-sell-color);
color: #fff;
}
.order-widget .buy-order,.order-widget .sell-order{
padding: 12px;
border: 0;
border-radius: 4px;
color: #fff;
font-size: 14px;
cursor: pointer;
}
.order-widget .buy-order{
background-color: var(--new-buy-color);
}
.order-widget .sell-order{
background-color: var(--new-sell-color);
}
.order-widget .product-type{
margin-left: -3px;
width:306px;
margin-top: 5px;
table-layout: fixed;
}
.order-widget .price-ele{
color: #4DA2E8;
font-size: 16px;
line-height: 20px;
}
.order-widget .change-ele{
color: #6C6C6C;
font-size: 14px;
line-height: 17px;
}
.round-button{
font-size: 14px;
color: white;
padding: 5px 20px;
display: inline-block;
border-radius: 20px
}
.dark .high-light{
color: #fff;
}
.orange{
color: #fb8c0e;
}
.green{
color: #53b987;
}
.red{
color: #eb4d5c;
}
.red .tooltip {
display: inline-block;
width: 12px;
height: 12px;
margin-left: 10px;
background-color: #eb4d5c;
padding: 4px;
border-radius: 50%;
font-size: 12px;
color: white;
position: relative;
text-align: center;
text-transform: lowercase;
}
.right-text{
text-align: right;;
}
.prd-type input[type="radio"]:checked+label, .prd-type input[type="radio"]:not(:checked ) +label {
position: relative;
padding-left: 0;
cursor: pointer;
display: inline-block;
padding-right: 0px;
text-align: center;
display: block;
line-height: 30px;
text-align: center;
color: var(--INPUT-COLOR);;
/* z-index: -1; */
font-size: 13px;
}
.light .prd-type input[type="radio"]:checked+label{
color: #fff;
}
.prd-type input[type="radio"]:checked+label:before, .prd-type input[type="radio"]:not(:checked ) +label:before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 30px;
/* border: 1px solid #1c1d21; */
border-radius: 3px;
background: transparent;
border: 2px solid #494b52;
padding: 4px 0;
box-sizing: border-box;
z-index: -1;
}
.light .prd-type input[type="radio"]:not(:checked ) +label:before{
border: 1px solid #ccc;
}
.prd-type input[type="radio"]:not(:checked ) +label:after {
opacity: 0;
-webkit-transform: scale(0);
transform: scale(0);
}
.prd-type input[type="radio"]:checked+label:after, .prd-type input[type="radio"]:not(:checked ) +label:after {
content: '';
width: 100%;
height: 30px;
background: #ffffff;
position: absolute;
top: 0;
left: 0;
border-radius: 3px;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
border: 2px solid #2070D8;
display: block;
box-sizing: border-box;
/* color: var(--INPUT-COLOR); */
z-index: -1;
}
.prd-type input[type="radio"]:checked+label:after, .prd-type input[type="radio"]:not(:checked ) +label:after {
background: #2070D8;
}
.price-details div{
padding-bottom: 6px;
}
.spinner-box{
border: 1px solid #ccc;
}
.spinner-box input{
width: 100% !important;
border-width: 0 !important;
border-radius:4px;
text-align: right;
padding-right: 6px;
}
.spinner-box a{
height: 50%;
cursor: pointer;
visibility: hidden;
outline: none;
color: currentColor;
}
.spinner-box:HOVER a{
visibility: visible;
}
.spinner-box.disabled:HOVER a{
visibility: hidden;
}
.spinner-box a svg{
display: block;
}
.spinner-box input:FOCUS {
outline: none;
border: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.spinner-box a input:FOCUS {
visibility: visible;
}
.spinner-box:focus-within {
box-shadow: 0px 0px 3px 0px #2070D8;;
outline: none;
box-sizing: border-box;
border-radius:2px;
}
.spinner-box.disabled:focus-within {
outline: none;
border: 1px solid #ccc;
}
.spinner-box.disabled, .spinner-box.disabled input{
background-color: #efefef;
}
/*New GTT Order Widget*/
.buy-sell-popup .content-panel .gtt-order-widget{
min-width: 400px!important;
}
.spinner-width-ltp{
width: 275px!important;
}
/*Gtt Order Widget end */
.order-widget .spinner-box{
border: 1px solid #494b52;
height: 35px;
border-radius: 3px;
background-color: #1c1d21 !important;
margin-bottom: 6px;
}
.buy-sell-popup .order-widget .spinner-box{
border: 1px solid #494b52;
height: 35px;
border-radius: 3px;
background-color: #121212 !important;
margin-bottom: 6px;
}
.light .order-widget .spinner-box{
border: 1px solid #ccc;
background-color: #fff !important;
}
.order-widget .spinner-box td{
padding-top: 0;
}
.order-widget .spinner-box input{
background-color: #1c1d21 ;
height:100%;
color: var(--INPUT-COLOR);
padding-top: 0;
}
.light .order-widget .spinner-box input{
background-color: #fff !important;
}
.light .buy-sell-popup .order-widget .spinner-box input{
background-color: #fff !important;
color: var(--INPUT-COLOR);
padding-top: 0;
}
.popup-notification-down{
position: fixed;
right: 20px;
max-width: 250px;
bottom: -300px;
background-color: #25272c;
color: #9f9fa0;
z-index: 999999;
width: 250px;
border: 1px solid #9f9fa0;
-webkit-transition: all 0.1s ease;
transition: all 0.2s ease;
}
.popup-notification-down .message{
position:absolute;
top:20px;
left: 10px
}
.popup-notification-down .close{
display: block;
width: 20px;
height: 20px;
margin: 5px;
cursor: pointer;
color: currentColor;
}
.buy-box{
width: 30px;
height: 30px;
padding: 4px 11px;
background-color: #465646;
text-align: center;
color: #53b987;
font-size: 14px;
font-weight: bold;
line-height: 23px;
box-sizing: border-box;
border-radius: 4px;
}
.light .buy-box{
background-color: #b6ffb6;
}
.sell-box{
width: 30px;
height: 30px;
padding: 4px 11px;
background-color: #46262C;
text-align: center;
color: #eb4d5c;
font-size: 14px;
font-weight: bold;
line-height: 23px;
box-sizing: border-box;
border-radius: 4px;
}
.light .sell-box{
background-color: #f3d9de;
}
.order-detail td{
padding: 7px 0;
font-size: 13px;
}
.order-detail td:nth-child(2){
padding-right: 8px;
}
.watch-list .search-symbol .gwt-ListBox{height: 30px; min-width: 140px;margin-top: 0; background: #121212; padding: 0 0px 0px 10px;}
.watchlist-btn{
background-color: #121212;
border: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
cursor: pointer;
vertical-align: middle;
padding: 5px;
margin-left: 5px;
width: 30px;
text-align: center;
box-sizing: border-box;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
}
.watchlist-btn svg{width:14px!important}
.light .watchlist-btn{
background-color: #fff;
border: 1px solid #ccc;
}
.light .watch-list .symbol_search .search-box{background-color: #ffffff;}
.light .watch-list .symbol_search .search-box input{background-color: #ffffff !important;}
.str-over{
display: none;
position: absolute;
top: 1px;
left: 45px;
padding: 8px 0px
}
.stockdetail .row:HOVER .str-over {
display:block;
}
.stockdetail .ws-btn{
color: #fff;
padding: 5px!important;
margin-bottom: 0;
font-size: 11px !important;
line-height: 12px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
text-transform: uppercase;
background-color: #58595d;
margin: 0 2px;
height: 24px !important;
width: 35px!important;
cursor: pointer;
}
.stockdetail .ws-btn.buy-btn{
background-color: var(--new-buy-color) !important;
font-size: 12px!important;
color: #fff;
font-weight: 500;
cursor: pointer;
}
.stockdetail .ws-btn.sell-btn{
background-color: var(--new-sell-color) !important;
font-size: 12px!important;
color: #fff;
font-weight: 500;
}
.stockdetail .ws-btn.pos-btn{
background-color: #53B987 !important;
font-size: 12px!important;
color: #fff;
font-weight: 500;
}
.stockdetail .btn-over{
display: inline-block;
visibility: hidden;
margin-left: 5px;
}
.stockdetail:HOVER .btn-over{
visibility: visible;
}
.indices {
cursor: pointer;
width: 50%;
}
.indices i{
width: 14px;
height: 14px;
display: inline-block;
margin-left: 10px;
}
.indices p {
text-align: center;
margin: 3px 0;
font-size: 13px;
text-transform: uppercase;
}
.indices p span {
font-size: 12px;
margin: 0 5px;
}
.indices .priceUp{
color: var(--buy-color);
}
.indices .priceDown{
color: var(--sell-color);;
}
.mkt-ana-menu select{
background-color: #18191d;
padding: 5px;
border-radius: 0;
min-width: 80px;
font-size: 14px
}
.light .mkt-ana-menu select{
background-color: #fff;
}
.marketanalytic {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
/* border: 1px solid #23242a; */
}
.marketanalytic td {
padding: 10px;
font-weight: normal;
font-size: 14px;
}
.marketanalytic tr:nth-child(even) {
background-color: #2a2b31;
}
.light .marketanalytic tr:nth-child(even) {
background-color: #fff;
}
.marketanalytic .header td{
color:#fff;
font-weight: 500;
font-size: 15px;
}
.light .marketanalytic .header td{
color:#000;
}
/*--------------------------------------news---------------------------------------*/
.news{
margin : 0px;
padding : 0px;
text-align: left;
}
.dark .news-button{
margin-left : 10px;
height : 100%;
background: #2a2b31;
color: #828181;
padding: 4px 20px;
margin-bottom: 0;
font-size: 16px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
}
.dark .news-button-focus{
margin-left : 10px;
height : 100%;
background: #2070D8;
color: #fff;
padding: 4px 20px;
margin-bottom: 0;
font-size: 16px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
}
.dark .news-table-header {
background-color: #31323A;
border-top-left-radius : 5px;
border-top-right-radius : 5px;
color: white;
padding : 15px 20px;
font-weight: bold;
}
.newsalign{
display: grid;
grid-template-columns : 1fr 3fr;
}
.dark .news_serach_fill {
position: relative;
height: 35px;
overflow: hidden;
border-radius: 0 4px 4px 0;
background: #f4f3f3;
}
.news-time-label{
padding:0;
}
.dark .news-category{
background: #2a2b31;
border : 2px #2a2b31;
border-radius : 2px;
color: #828181;
margin-left: 10px;
padding: 1px 5px;
font-size: 12px;
text-align:center;
}
.dark .news-main{
border-bottom: 1px solid #25262b;
margin : 0px;
padding : 15px;
text-align: left;
}
.dark .news-title{
padding: 10px 20px 10px 0;
color: #fff;
width: 69%;
}
.dark .news-details{
padding:0 20px 10px 0px;
color: #fff;
float: left;
width: 100%;
}
.news ::-webkit-scrollbar {
width: 5px;
}
.dark .news ::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px #2a2b31;
border-radius: 10px;
}
/* Handle */
.dark .news ::-webkit-scrollbar-thumb {
background: #31323A;
border-radius: 10px;
}
.dark .news-symbol{
padding: 10px 0;
color: #fff;
width: auto;
}
.news-main::after{ content: "";
clear: both;
display: table;}
.dark .news-main h5{ color: #000; font-size: 18px;}
.news-main .news-symbol,.news-title{
float: left;
text-align: left;
}
.news-main .news-title{ width: auto;}
.news-title a{color:#fff}
.news-main .news-symbol span{padding-right: 15px; text-decoration: underline; font-weight: 600;}
/* light theme */
.light .news-button{
margin-left : 10px;
height : 100%;
background: #f4f3f3;
color: #000;
padding: 4px 20px;
margin-bottom: 0;
font-size: 16px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
}
.light .news-button-focus{
margin-left : 10px;
height : 100%;
background: #2070D8;
color: #fff;
padding: 4px 20px;
margin-bottom: 0;
font-size: 16px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
}
.light .news-table-header {
background-color: #f1f1f1;
border-top-left-radius : 5px;
border-top-right-radius : 5px;
color: black;
padding : 15px 20px;
font-weight: bold;
}
.light .news_serach_fill {
position: relative;
height: 35px;
overflow: hidden;
border-radius: 0 4px 4px 0;
background: #f4f3f3;
}
.light .news-category{
background: #f1f1f1;
border : 2px #2a2b31;
border-radius : 2px;
color: black;
margin-left: 10px;
padding: 1px 5px;
font-size: 12px;
text-align:center;
}
.light .news-main{
border-bottom: 1px solid #c5c5c5;
margin : 0px;
padding : 15px;
text-align: left;
}
.light .news-title{
padding: 10px 20px 10px 0;
color: black;
width: 69%;
}
.light .news-details{
padding:0 20px 10px 0px;
color: black;
float: left;
width: 100%;
}
.light .news ::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px #f1f1f1;
border-radius: 10px;
}
/* Handle */
.light .news ::-webkit-scrollbar-thumb {
background: #f1f1f1;
border-radius: 10px;
}
.light .news-symbol{
padding: 10px 0;
color: black;
width: auto;
}
.light .news-main h5{ color: #000; font-size: 18px;}
.light .news-title a{color:black}
.light .news-main .news-symbol span{padding-right: 15px; text-decoration: underline; font-weight: 500;}
#news-alert{
position: absolute;
width: 18px;
height: 18px;
background: var(--sell-color);
right: 4px;
bottom: 4px;
border-radius: 50%;
color: white;
text-align: center;
font-size: 10px;
line-height: 18px;
}
.light .news-main .news-symbol span{padding-right: 15px; text-decoration: underline; font-weight: 500;}
/* GTT */
.order-widget .gtt-product-type{
margin-left: 0px;
width:100%;
margin-top: 5px;
table-layout: fixed;
}
.gtt-radio-btn{
padding: 5px 10px 5px 0px;
display: block;
}
.spinner-box-ltp{
text-align: center !important;
background-color : #31323A !important;
}
.light .spinner-box-ltp {
background-color: #ccc !important;
}
.stop-Loss-Label{
margin-top: 25px;
padding: 1px;
color : #fff;
}
.light .stop-Loss-Label{
color : #333;
}
.add-scrollbar-gtt {
overflow-y: auto;
}
.dashboard-panel{
height: 100%;
display: flex;
flex-direction: column;
overflow-y: auto;
padding: 5px;
}
.dashboard-panel .indices-panel{
width: 100%;
display: flex;
flex: 140px 0 0;
}
.dashboard-panel .indices-panel .logo-box{
flex-basis: 220px;
flex-grow: 0;
flex-shrink: 0;
text-align: center;
}
.indices-panel .logo-box svg{
color: #fff;
margin: 10px 0 12px 0;
}
.light .indices-panel .logo-box svg{
color: #333;
margin: 10px 0 12px 0;
}
.indices-panel .logo-box p {
padding: 0;
margin: 0;
font-size: 15px;
}
.dashboard-panel .indices-panel .indices-section{
display: flex;
height: 100%;
width: 100%;
flex: 1;
}
.dashboard-panel .indices-box{
width: 20%;
border-radius: 7px;
padding: 15px;
margin: 10px;
background: #2C2D33;
}
.light .dashboard-panel .indices-box{
background: #fff;
border: #ccc 1px solid;
}
.indices-box .indi-info {
display: flex;
margin-top: 10px;
}
.indices-box .indi-info.up {
color: #339966;
}
.indices-box .indi-info.down {
color: #EB4D5C;
}
.indices-box .indi-info .up-arrow {
margin-right: 10px;
color: #339966;
}
.indices-box .indi-info .down-arrow {
margin-right: 10px;
color: #EB4D5C;
}
.down-arrow svg{
transform: rotate(180deg);
}
.dark-theme .indices-box .indi-info .m-value h5 {
color: #fff;
}
.indices-box .indi-info .m-value h5 {
font-size: 15px;
font-weight: 600;
color: #000;
margin: 0;
padding: 0;
margin-bottom: 5px;
line-height: 15px;
}
.dark .indices-box .indi-info .m-value h5 {
color: #fff;
}
.indices-box .indi-info .m-value h6{
font-size: 13px;
margin: 0;
padding: 0;
line-height: 20px;
font-weight: 500;
color: currentColor;
}
.indices-box .indi-info .m-value h6 span {
display: inline-block;
min-width: 60px;
}
.dashboard-panel .row{
display:flex;
flex: 1;
min-height: 350px;
}
.row .dashlet-container{
width: 33%;
margin: 10px;
}
.dashlet-container .dashlet{
width: 100%;
height: 100%;
display:flex;
flex-direction: column;
background: #18191D;
/* padding: 1px; */
border-radius: 7px;
}
.light .dashlet-container .dashlet{
background: #fff;
border: #ccc 1px solid;
}
.dashlet .dashlet-header{
background: #2C2D33;
color: #000;
font-weight:500;
flex: 36px 0 0;
border-radius: 7px 7px 0 0;
padding: 8px 15px;
box-sizing: border-box;
}
.dark .dashlet .dashlet-header{
color: #ddd;
}
.light .dashlet .dashlet-header{
background: #f1f1f1;
}
.dashlet .dashlet-content{
width: 100%;
overflow: auto;
flex: 1;
}
.table-grid {
border-collapse: collapse;
width: 100%;
}
.table-grid .header {
background: #F1F1F1;
color: #333333;
font-weight: bold;
}
.dark .table-grid .header {
background: #2C2D33;
color: #ddd;
}
.dark .table-grid tr {
border-bottom: 1px solid #383940;
}
.table-grid tr {
border-bottom: 1px solid #ddd;
}
.table-grid td {
padding: 7px 10px;
font-size: 12px;
}
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.bulbue-boxs {
display: flex;
width: 100%;
}
.bulbue-boxs-new {
display: flex;
width: 100%;
height:100%;
}
.bulbue-boxs-new .bulbue-new {
width: 50%;
height:50%;
display: flex;
align-items: center;
justify-content: space-around;
}
.bulbue-boxs .bulbue {
display: flex;
align-items: center;
justify-content: space-around;
}
.bulbue-boxs .bulbue {
width: 100%;
}
.indi-lavel {
width: 100%;
border-radius: 7px;
padding: 10px;
margin: 15px;
padding: 1px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.bulbue-boxs .bulbue .bulbue-chart {
text-align: center;
}
.bulbue-boxs .bulbue .bulbue-info p {
color: var(--FONT-COLOR);
font-size: 12px;
font-weight: 600;
margin: 0;
line-height: 22px;
display: flex;
}
.bulbue-boxs .bulbue {
display: flex;
align-items: center;
justify-content: space-around;
}
.bulbue-boxs .bulbue {
width: 100%;
border-radius: 7px;
}
.indi-lavel .bul-label {
background: #339966;
}
.indi-lavel .bue-label, .bul-label {
font-size: 13px;
background: #339966;
border-radius: 7px 0 0 7px;
padding: 10px;
display: flex;
align-items: center;
margin-right: 15px;
color: #fff;
text-transform: uppercase;
width: 100%;
}
.indi-lavel .lavel-tag {
border-right: 1px solid #f1f1f1;
padding: 0 10px 0px 10px;
width: 72%;
}
.dark .indi-lavel .lavel-tag {
border-right: 1px solid #383940;
}
.indi-lavel .lavel-tag p {
color: var(--FONT-COLOR);
font-size: 11px;
font-weight: 500;
text-align: right;
margin: 0;
line-height: 20px;
}
.indi-lavel .bue-label {
background: #EB4D5C;
}
/* SIP*/
.sip{
margin: 0px;
box-sizing: border-box;
}
.sip-tab{
display: flex;
border: 1px #828181 solid;
margin : 0 10px;
border-radius: 50px;
text-decoration: none;
font-size: 14px;
font-weight: 500;
color: #828181;
text-align: center;
width: 100%;
height: 40px;
}
.sip-tab a{
text-align: center;
display: inline-block;
padding: 8px 0;
text-decoration: none;
font-size: 14px;
font-weight: 500;
color: #828181;
text-align: center;
width: 100%;
margin : 2px;
}
/*
.sip-tab a::selection {
color: #2a2b31;
text-shadow: none;
font-weight: 500;
background: #2070D8;
border-radius: 50px;
height: 40px;
}
*/
a.sip-anchor-active{
border-radius: 50px;
color: #fff;
background-color: #2070D8;
}
a.sip-anchor-inactive{
color: #828181;
}
.add-scrip-btn{
color: #2070D8;
text-decoration: none;
margin: 10px 0px;
display: inline-block;
border: none;
background: none;
outline: inherit;
cursor: pointer;
}
.add-scrip-btn:hover{
color: #fff;
text-decoration: none;
}
.add-scrip-btn:focus{
box-shadow:inherit;
text-decoration: none;
}
.sip .tab-panel{
display: block;
width: 100%;
height: 75%;
padding: 15px;
overflow-y:auto;
}
.sip .row:before,.sip .row:after{
display: table;
content: " ";
}
.sip .row:after{
clear: both;
}
.sip .row-title{
font-size: 13px;
font-weight: 500;
color: #757475!important;
text-transform: uppercase;
margin-bottom: 10px;
}
.sip .col-6{
position: relative;
min-height: 1px;
padding-right: 10px;
padding-left: 10px;
width: 50%;
float: left;
}
.sip .widget1 {
display: flex;
align-items: center;
position: relative;
border-bottom: 1px solid #505258;
padding: 10px 10px !important;
}
.sip .col1{
width:auto;
float: left;
}
.sip .col-md-5{
position: relative;
min-height: 1px;
padding-right: 10px;
padding-left: 10px;
float: left;
width: 41.66666667%;
}
.sip .col-12{
position: relative;
width : 100%;
min-height: 1px;
padding-right: 10px;
padding-left: 10px;
}
.sip para, .sip p{
font-size: 12px;
font-weight: 600;
color: #fff;
margin-bottom: 0px !important;
line-height: 24px;
margin: 0 !important;
}
.sip .form-control{
border: 1px solid #505258;
color: #fff;
display: block;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.sip .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
background-color: #18191d;
border: 1px solid #2e2f34;
opacity: 1;
}
.sip .text-muted {
font-size: 11px;
font-weight: 400;
color: #757475;
}
.sip .pull-right {
float: right !important;
}
.sip .status{
font-size: 12px;
font-weight: 500;
color: #757475!important;
}
span.row-title-para{
padding-left: 10px;
}
.sip button.btn-active,a.btn-active{
color: #fff;
text-shadow: none;
font-weight: 500;
background: #2070D8;
border-radius: 50px;
border-bottom: none;
display: inline-block;
padding: 8px 12px;
min-width: 100px;
text-align: center;
border: 1px solid transparent;
}
.sip button.btn-active{
color: #fff;
text-shadow: none;
font-weight: 500;
background: #2070D8;
border-radius: 5px;
border-bottom: none;
display: inline-block;
padding: 8px 12px;
min-width: 100px;
text-align: center;
border: 1px solid transparent;
margin: 0px 10px;
}
.sip label{
color: #828181;
font-weight: 400;
font-size: 12px;
display: block;
max-width: 100%;
margin-bottom: 10px;
}
.sip .box1{
width: 95%;
}
.sip .widget2 {
display: flex;
align-items: center;
position: relative;
}
.sip .form-group{
display: block;
margin-bottom: 0px;
}
.sip .form-group input{
padding: 0;
height: initial;
width: initial;
margin-bottom: 0;
display: none;
cursor: pointer;
}
.sip .abtn{
color: #2070D8;
text-decoration: none;
margin-bottom: 10px;
display: inline-block;
}
/*
.sip .form-group label:before {
content: '';
-webkit-appearance: none;
background-color: transparent;
border: 1px solid #828181;
border-radius: 4px;
padding: 10px;
display: inline-block;
position: relative;
vertical-align: middle;
cursor: pointer;
margin-right: 5px;
}
/*
.sip .form-group:after{
display: table;
content: " ";
}
*/
/*
.sip .form-group input:checked + label:after {
content: '';
display: block;
position: absolute;
top: 2px;
left: 7px;
width: 6px;
height: 14px;
border: solid #2070D8;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
*/
.sip ::-webkit-scrollbar {
width: 14px;
}
.dark .sip ::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px #2a2b31;
border-radius: 5px;
}
/* Handle */
.dark .sip ::-webkit-scrollbar-thumb {
background: #23c2e4;
border-radius: 5px;
}
.sip .green-amt {
font-size: 16px!important;
color: #30b54d!important;
line-height: 39px;
}
.sip .big-amt {
font-size: 16px!important;
font-weight: 600;
color: #fff;
}
.sip .sip-name{
position: relative;
width : 100%;
min-height: 1px;
float: left;
}
/* backtesting */
.backtesting{
box-sizing: border-box;
}
.backtesting .theme-background{
padding: 10px;
}
.light .backtesting .theme-background{
border: 1px solid #ccc;
margin-top:-1px;
}
.backtesting .form-control
{
width: 130px;
border: 1px solid #ccc;
background-color: #fafafa;
color: var(--FONT-COLOR);;
border-radius: 4px;
padding: 5px;
height: 28px;
display: inline-block;
}
.backtesting .form-box
{
border-radius: 4px;
padding: 5px;
height: 28px;
display: inline-block;
}
.dark .backtesting .form-control{ border: 1px solid #25272c; background-color: #25272c; }
.backtesting .backtesting-box { vertical-align: top; align-items: center;}
.backtesting .align-elements { vertical-align: top; display: flex; flex-wrap:wrap; align-items: center;}
.backtesting .formfield{ margin:10px 10px 0px 10px; display: inline-block;}
.backtesting label{ padding-right: 5px; width: 100%;width: 85px; display: inline-block; font-size: 14px;}
.backtesting .pull-right { float: right !important; }
.backtesting .mt-10 { margin-top: 10px; }
.backtesting .w-auto{width: auto!important; padding-left: 20px !important; padding-right: 5px !important;}
.backtesting .w-auto-label{width: auto!important; padding-left: 10px !important; padding-right: 5px !important;}
.backtesting .w-label{padding-left: 2px !important; padding-right: 5px !important;}
.backtesting .percent-allocation{
background: url("/images/percent.svg") #fafafa center right no-repeat;
background-position: center right;
background-size: 10% 50%;
border-radius: 4px;
border-top-right-radius : 0px;
border-bottom-right-radius : 0px;
height: 28px!important;
width: 130px!important;
padding: 5px 18px 5px 5px;
display: inline-block;
text-align: right;
}
.backtesting .non-percent{
border-radius: 4px;
border-top-right-radius : 0px;
border-bottom-right-radius : 0px;
height: 28px!important;
width: 130px!important;
padding: 5px 10px 5px 5px;
display: inline-block;
text-align: right;
}
.dark .backtesting .percent-allocation{ border: 1px solid #25272c; background-color: #25272c; color: #9f9fa0; }
.or-inputs{position: relative;display: inline-block; margin-bottom: 0!important;margin-right: 25px;}
.or-inputs .info-text{position: absolute; top: 0; background: #dddddd; border-top-right-radius:4px ; border-bottom-right-radius:4px ; font-weight: bold; cursor: pointer;}
/* .light .or-inputs .info-text{
background: #fff;
border-top: 1px #ccc solid;
border-bottom: 1px #ccc solid;
border-right: 1px #ccc solid;
height : 26px;
} */
.tooltip {position: relative!important; display: inline-block;}
.tooltip em a{text-decoration: none; color: #828181; padding: 0px 12px;
display: block;
line-height: 27px;
height: 28px;}
.light em a {text-decoration: none; color: #333;}
.tooltiptext {width:150px; min-width: 130px; background: #dddddd; color: #6f7277; text-align: center; border-radius: 6px; padding: 5px; right: 20px; font-size: 11px; line-height: normal; display: none; position: absolute; z-index: 1;}
.light .tooltiptext{background: #fff; border: 1px #ccc solid;}
.dark .or-inputs .info-text{ background: #1f2025;}
.dark .tooltiptext { background: #131417; color: #6f7277; }
.backtesting .market-box{position: relative;}
.backtesting .scan-btn { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: start; }
.backtesting .lsb-Entry { margin-right: 5px; display: flex; flex-wrap:wrap; left: 50px; align-items: center; }
@media only screen and (max-width: 450px) {
.backtesting .align-elements { vertical-align: top; display: inline-block;}
.backtesting .tooltiptext {min-width: 100px; width: 120px;}
}
.backtesting .or-box .form-control {border-top-right-radius: 0!important; border-bottom-right-radius: 0!important; text-align: right; padding-right: 25px!important;}
.backtesting .or-box{position: relative; display: flex; flex-wrap: wrap; align-items: stretch; width: 100%;}
.backtesting .input-box {display: flex; margin-right: 10px; width: 31.33333333%;align-items: center;}
/* New Symbol Search widget */
.new_symbol_search {
border-radius: 4px;
position: relative;
width: 250px;
border: 1px solid #e0dfdf;
box-sizing: border-box;
}
.dark .new_symbol_search {
border: 1px solid #28292e;
}
.dark .new_symbol_search {
border: 1px solid #28292e;
}
.new_symbol_search.with-focus {
border: 1px solid #2070D8;
}
.new_symbol_search .search-box {
height: 100%;
background-color: transparent;
border: 0;
}
.new_symbol_search .search-box input {
height: 100%;
background-color: transparent;
}
.new_symbol_search.expandable-search .search-box input {
background-image: url(/images/magnifying-glass.svg);
background-repeat: no-repeat;
background-size: 20px;
background-position: 5px center;
padding-left: 30px;
}
.new_symbol_search .search-box input:focus {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.new_symbol_search.expandable-search {
width: auto;
visibility: visible;
flex: 1;
display: flex;
margin-right: 10px;
}
.new_symbol_search.expandable-search .new_search_fill {
width: 35px;
-webkit-transition: width .55s ease;
-moz-transition: width .55s ease;
-ms-transition: width .55s ease;
-o-transition: width .55s ease;
transition: width .55s ease;
}
.new_symbol_search.expandable-search.with-focus .new_search_fill,
.new_symbol_search.expandable-search:HOVER .new_search_fill {
width: 180px;
}
.new_symbol_search.expandable-search .close-td {
display: none;
}
.new_symbol_search.expandable-search.with-focus .close-td,
.new_symbol_search.expandable-search:HOVER .close-td {
display: table-cell;
}
.new_search_left {
position: relative;
height: 28px;
float: left;
width: 85px;
display: inline-block;
line-height: 28px;
}
.new_market {
height: 28px;
margin: 0;
padding-left: 5px;
overflow: hidden;
border-radius: 4px 0 0 4px;
font-size: 14px;
padding-right: 7px;
background-color: #fff;
box-shadow: 1px 0 0 0 #e0dfdf;
display: flex;
}
.dark .new_market{
border-right: 1px solid #1a1b1f;
background-color: #28292e;
color: var(--FONT-COLOR);
box-shadow: 1px 0 0 0 #1a1b1f;
}
.new_search_fill {
position: relative;
height: 28px;
overflow: hidden;
border-radius: 0 4px 4px 0;
background: #f4f3f3;
}
.dark .new_search_fill {
background: #1c1d21;
}
.new_symbol_search.expandable-search .new_search_fill{
width: 35px;
-webkit-transition: width .55s ease;
-moz-transition: width .55s ease;
-ms-transition: width .55s ease;
-o-transition: width .55s ease;
transition: width .55s ease;
}
.new_symbol_search.expandable-search.with-focus .new_search_fill, .new_symbol_search.expandable-search:HOVER .new_search_fill{
width: 185px ;
}
.new_market_select {
position: absolute;
display: block;
top: 0px;
left: 0;
height: 28px;
width: auto;
font-family: arial,sans-serif;
outline: 0;
margin: 0;
padding: 0;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
visibility: visible;
border: 0;
line-height: 28px;
width: 100%;
}
.new_search_fill .search-box img {
height: 20px !important;
width: 25px !important;
vertical-align: middle;
padding: 0 4px;
}
.backtesting .symbol_search{
padding-left: 2px !important;
}
.backtesting .serach_left,.backtesting .serach_fill ,.backtesting .market ,.backtesting .market_select{
height : 28px !important;
line-height: 28px !important;
}
.preDefinedPatternBox{
width: 100%;
height: 28px;
min-width : 155px;
border-bottom-left-radius: 0 !important;
border-top-left-radius: 0 !important;
padding-left: 5px;
}
/* backTesting report */
.trade-analysis .popup-content {
padding: 15px;
position: relative;
overflow: auto;
height: 85vh;
}
.trade-analysis .d1-flex {
display: flex;
}
.trade-analysis .popup-card {width: 50%;background: #fff;margin: 10px;border-radius: 5px; border: 1px solid #ccc;}
.dark .trade-analysis .popup-card {
background: #1c1d21;
border: 1px solid #2a2b31;
}
.trade-analysis .popup-card {width: 98.55555555%;background: #fff;margin: 10px;border-radius: 5px; border: 1px solid #ccc; overflow: auto;}
.dark .trade-analysis .popup-card .card-popuptitle {
border-bottom: 1px solid#23242a;
}
.trade-analysis .popup-card .card-popuptitle { padding: 5px 15px; border-bottom: 1px solid #cdcdcd;}
.trade-analysis .popup-card .card-popupcontent {padding: 18px; position: relative; }
.trade-analysis .over-height-45 {
overflow: auto;
height: 45vh;
}
.dark .trade-analysis .popup-card .card-popupcontent .badge {
background: #23242a;
}
.trade-analysis .btn-panel{
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-bottom: 5px;
font-size: 12px;
}
.trade-analysis .value-up{display: block; margin-top: 5px;font-weight: bold;}
.trade-analysis .value-down{display: block; margin-top: 5px;font-weight: bold;}
.trade-analysis .value{display: block; margin-top: 5px;font-weight: bold;}
.trade-analysis .value-up{color: #53B987; }
.trade-analysis .value-down{color: #EB4D5C; }
.trade-analysis .value{color: #333; }
.dark .trade-analysis .value{color: #828181;}
.trade-analysis .btn{
background: #2070D8;
color: white;
padding: 4px 20px;
margin-bottom: 5px;
margin-left: 5px;
font-size: 12px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
}
.trade-analysis .popup-card .card-popupcontent .badge {
border-radius: 3px;
background: #f4f3f3;
text-align: center;
margin: 1px;
font-size: 12px;
padding: 0 8px;
line-height: 13px;
}
.trade-analysis .chart-box {
width: 30%;
min-width:160px;
height: auto;
}
.trade-analysis .chart-info {
width: 66%;
}
.trade-analysis .mr-0 {
margin-right: 0!important;
}
.trade-analysis .d-flex {
display: flex;
justify-content: space-between;
}
.trade-analysis .chart-value p {
display: flex;
justify-content: space-between;
align-items: baseline;
}
.trade-analysis .chart-value .badge {
background: none!important;
width: 100%;
}
@media only screen and (max-width: 850px) {
.trade-analysis .d1-flex { vertical-align: top; display: inline-block; width: 95%;}
}
.trade-analysis .drawdown-box{
width: 45%;
height: 100%;
}
.gwt-TabPanel {
max-width: 100%;
box-sizing: border-box;
padding : 10px;
}
.gwt-TabPanel .gwt-TabBar {
max-width: 100%;
}
.gwt-TabBar {
border-color: #2070D8;
border-style: solid;
border-width: 0 0 2px 0;
}
.gwt-TabPanel .gwt-TabBarItem {
border-color: transparent;
border-style: solid;
border-width: 1px;
overflow: hidden;
padding: 6px;
}
.gwt-TabPanel .gwt-TabBarItem {
margin-left: 10px;
padding: 6px;
cursor: pointer;
cursor: hand;
color: #333;
font-weight: bold;
text-align: center;
background: transparent;
border-radius: 4px 4px 0 0;
}
.dark .gwt-TabPanel .gwt-TabBarItem{
color:#828181;
}
.dark .gwt-TabPanel .gwt-TabBarItem{
color: #828181;
}
.gwt-TabPanel .gwt-TabBarItem-selected {
cursor: default;
background: #2070D8;
color: white !important;
}
.back-test-result-detail td:first-child{
text-align: left;
}
.back-test-result-detail td:not(first-child){
text-align: right;
}
.trade-analysis .pager{
display: flex;
flex-direction: column;
}
.d-phase p{
margin: 5px 0;
}
.buzzzar-menu{
display: flex;
align-items: center;
height: 100%;
font-size: 115%;
padding: 0 15px;
box-sizing: border-box;
border-bottom: 3px solid transparent;
}
.buzzzar-menu.selected{
border-bottom: 3px solid #4DA2E8;
color: #4DA2E8;
}
a.trigger-buzzer {
display: inline-block;
background: #03458f;
margin-right: 15px;
padding: 5px 20px;
color: #fff;
text-decoration: none;
border-radius: 5px;
white-space: nowrap;
display: inline-block;
vertical-align: middle;
text-transform: uppercase;
line-height: 30px;
}
.order-tab{
margin: 20px 0 0px 0px;
}
.order-tab a{
padding: 0 30px;
white-space: nowrap;
display: block;
text-align: center;
color: #A6A6A6;
text-decoration: none;
font-size: 13px;
line-height: 30px;
height: 100%;
border-bottom: 2px solid #333;
cursor: pointer;
}
.order-tab td.selected a{
color: #4DA2E8;
border-bottom: 2px solid #4DA2E8;
}
/*
.back-test-result-detail tbody, .back-test-result-detail thead {display: block;}
.back-test-result-detail tbody {overflow: auto; height: 400px;}
.back-test-result-detail {width: 100%}
.back-test-result-detail th{width: 100%; min-width: 100px; background: #f1f1f1; margin: 0 1px; padding: 5px 10px; color: #333333; border-radius: 5px 5px 0 0 ; text-align: right;}
.back-test-result-detail td{width: 100%; min-width: 100px; margin: 0 1px; padding: 3px 10px; text-align: right; }
.profit-table td{ padding: 0!important;}
.back-test-result-detail tbody tr:nth-child(odd) {background: #fff;}
.back-test-result-detail tbody tr:nth-child(even) {background: #e9e8e8;}
.scroll-space{margin-right: 4px; display: block;}
.dark .back-test-result-detail th{background: #31323A; color: #9f9fa0;}
.dark .back-test-result-detail tr{cursor: pointer;}
.dark .back-test-result-detail tbody tr:nth-child(odd) {background: #18191d;}
.dark .back-test-result-detail tbody tr:nth-child(even) {background: #25272c;}
*/
/*
For New Order Widget
*/
.content-panel .margin-table {
background-color: #171717;
height: 93px;
margin: 10px 0 0 0;
padding: 10px;
background: #121212;
}
.content-panel input[type="radio"]:checked+label, .content-panel input[type="radio"]:not(:checked ) +label {
position: relative;
padding-left: 28px;
cursor: pointer;
display: inline-block;
padding-right: 10px;
color: #9B9B9B;
}
.buy-sell-popup .content-panel td {
color: #9B9B9B;
}
.buy-sell-popup {
z-index: 12;
box-shadow: 10px 0 10px #000;
}
.buy-sell-popup .popupContent {
background: #121212;
border-radius: 10px;
overflow: hidden;
}
.buy-sell-popup .popupContent .custom-dialog-header {
padding: 20px 30px 10px 30px
}
.buy-sell-popup .popupContent .custom-dialog-header .caption {
font-size: 20px;
font-weight: 600
}
.buy-sell-popup .selection-header {
padding: 0 30px;
display: flex;
justify-content: space-between;
}
.buy-sell-popup .order-widget {
padding: 0
}
.buy-sell-popup .main-form {
padding: 0 30px;
margin-top: 30px;
max-height: 320px;
min-width:500p;
overflow:auto;
}
.buy-sell-popup .custom-dialog-header {
justify-content: space-between;
display: flex;
align-items: center;
}
.buy-sell-popup .custom-dialog-header .close-buton {
display: inline-block;
float: right;
background: url(/images/close-icon.svg) no-repeat;
width: 23px;
height: 23px;
cursor: pointer;
background-position: 4px 4px;
}
.buy-sell-popup .spinner-box {
margin: 5px 15px 10px 0;
padding: 3px 10px;
}
.buy-sell-popup .margin-section {
width: 70%
}
.buy-sell-popup .margin-table {
background: #171717;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 30px;
}
.buy-sell-popup .footer-table {
width: 100%
}
.buy-sell-popup .radio-form {
margin-bottom: 25px
}
.buy-sell-popup .radio-width td {
width: 110px
}
.buy-sell-popup .gwt-RadioButton label {
font-size: 13px
}
.buy-sell-popup .pos-size .gwt-RadioButton label {
font-size: 15px;
}
.buy-sell-popup .margin-table .buy-button {
padding: 10px 20px;
width: 100px;
background: #2070D8;
color: white;
margin-bottom: 0;
font-size: 16px !important;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
margin-right: 5px;
border: 0;
}
.buy-sell-popup .margin-table .buy-button:hover {
background: #115cbd;
}
.buy-sell-popup .margin-table .sell-button {
padding: 10px 20px;
width: 100px;
background: var(--red-sell-color);
color: white;
margin-bottom: 0;
font-size: 16px !important;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
margin-right: 5px;
border: 0;
}
.buy-sell-popup .margin-table .sell-button:hover {
background: #ec2d29;
}
.buy-sell-popup .margin-section .gwt-HTML {
color: #6C6C6C;
font-weight: 400;
font-size: 12px;
}
.buy-sell-popup .margin-section .gwt-text {
color: #9B9B9B;
text-align: right;
font-weight: 700;
font-size: 13px;
}
.buy-sell-popup input[type="radio"]:checked+label:before,.buy-sell-popup input[type="radio"]:not(:checked
) +label:before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 18px;
height: 18px;
border: 1px solid #2070D8;
border-radius: 100%;
background: transparent;
}
.buy-sell-popup input[type="radio"]:checked+label:after, .buy-sell-popup input[type="radio"]:not(:checked
) +label:after {
content: '';
width: 12px;
height: 12px;
background: #2070D8;
position: absolute;
top: 4px;
left: 4px;
border-radius: 100%;
-webkit-transition: all 0.1s ease;
transition: all 0.1s ease;
}
.dark .buy-sell-popup select, .dark .buy-sell-popup input, .dark .buy-sell-popup textarea{
border: 1px solid #121212;
background-color: #121212;
color:#ddd;
}
.dark #side-bar .symbol_search {
border: 1px solid #121212;
}
.dark #side-bar .market{
border-right: 1px solid #121212;
background-color: #121212;
color: #ddd;
box-shadow: 1px 0 0 0 #1a1b1f;
}
#side-bar .symbol_search .search-box{
height: 100%;
background-color: #1E1E1E;
border: 0;
}
.light #side-bar .symbol_search .search-box{
background-color: #fff;
}
#side-bar .symbol_search .search-box input{
height: 100%;
background-color: #1E1E1E;
}
.light #side-bar .market{
background: #D6D7D8;
}
.light #side-bar .search-symbol .gwt-ListBox{ background: #ffffff;}
.buy-sell-popup .content-panel .order-widget{
padding: 10px 0 0 0px;
min-width: 500px;
background-color: #121212;
}
.buy-sell-popup .order-widget .spinner-box{
border: 1px solid #494b52;
height: 35px;
border-radius: 3px;
margin-bottom: 6px;
width: 125px;
height: 30px;
background: #121212;
border: 1px solid #333333;
border-radius: 100px;
}
.buy-sell-popup .order-widget .spinner-box input{
background-color: #1c1d21 ;
height:100%;
color: var(--INPUT-COLOR);
padding-top: 0;
width: 80px;
height: 30px;
background: #121212;
border: 1px solid #333333;
border-radius: 100px;
}
.buy-sell-popup .percent-up{
color : var(--blue-buy-color) ;
}
.buy-sell-popup .percent-down{
color : var(--red-sell-color) ;
}
.dark .buy-sell-popup .high-light{
color: #9B9B9B;
}
.light .buy-sell-popup .high-light{
color: #343646;
}
#side-bar .search-symbol .gwt-ListBox{height: 30px; width: 100px; margin-top: 0; min-width: 130px; background: #121212; padding: 0 5px 0px 5px!important;}
/*
scrip report
*/
.scrip-report-new .row > * {
flex-shrink: 0;
max-width: 100%;
padding-right: calc(var(--bs-gutter-x) * .5);
padding-left: calc(var(--bs-gutter-x) * .5);
margin-top: var(--bs-gutter-y);
}
.scrip-report-new img, .scrip-report-new svg {
vertical-align: middle;
}
.scrip-report-new p {
font-size: 12px;
margin-top: 0;
font-weight: 600;
color: var(--font-color-2);
margin-bottom: 0px;
line-height: 20px;
}
.light{
--scrollbar-1:#dadada;
--scrollbar-2:#a8a6a6;
--bgcolor-1: #fff;
--bgcolor-2: #DDDDDD;
--btn-color-1: #be9b60;
--btn-color-2: #fff;
--font-color-1: #828181;
--font-color-2: #000;
--font-color-3: #757475;
--font-color-4: #be9b60;
--border-1: #b9b6b6;
--border-green: #53b987;
--border-red: #eb4d5c;
}
.dark {
--scrollbar-1: #23242a;
--scrollbar-2: #0f1012;
--bgcolor-1: #18191d;
--bgcolor-2: #23242a;
--btn-color-1: #be9b60;
--btn-color-2: #23242a;
--font-color-1: #7f7f81;
--font-color-2: #ddd;
--font-color-3: #757475;
--font-color-4: #be9b60;
--border-1: #2a2b31;
--border-green: #53b987;
--border-red: #eb4d5c;
}
.scrip-report-new .container-fluid {
width: 100%;
padding-right: var(--bs-gutter-x, 0.75rem);
padding-left: var(--bs-gutter-x, 0.75rem);
margin-right: auto;
margin-left: auto;
}
.scrip-report-new .sr-dashboard {
background: var(--bgcolor-2);
padding: 20px 20px 0 20px;
overflow: scroll;
}
.scrip-report-new .row {
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
display: flex;
flex-wrap: wrap;
margin-top: calc(var(--bs-gutter-y) * -1);
margin-right: calc(var(--bs-gutter-x) * -.5);
margin-left: calc(var(--bs-gutter-x) * -.5);
}
.scrip-report-new .dashboard-srcard {
background: var(--bgcolor-1);
border-radius: 4px;
margin-bottom: 20px;
}
.scrip-report-new .dashboard-srcard .card-title label {
color: var(--font-color-1);
font-size: 15px;
font-weight: 500;
line-height: 26px;
}
.scrip-report-new .col-md-1 {
width: auto;
}
.scrip-report-new .flex {
display: flex;
align-items: center;
}
.scrip-report-new .col-md-1 {
width: auto;
}
.scrip-report-new .ms-auto {
margin-left: auto !important;
}
.scrip-report-new .dashboard-srcard .card-content {
padding: 0 15px 15px 15px;
min-height: 280px;
overflow: auto;
}
.scrip-report-new .content {
color: var(--font-color-2);
font-weight: lighter;
font-size: 15px;
margin-bottom: 10px;
}
.scrip-report-new .mt-50 {
margin-top: 33px;
}
@media ( min-width : 768px) {
.scrip-report-new .col-md-3 {
flex: 0 0 auto;
width: 25%;
}
.scrip-report-new .col-md-6 {
flex: 0 0 auto;
width: 50%;
}
}
.scrip-report-new .dashboard-srcard .sm-card {
border-radius: 4px;
border: 1px solid var(--border-1);
padding: 10px;
}
.scrip-report-new .status {
font-size: 12px;
font-weight: 500;
color: var(--font-color-1)!important;
padding-right: 10px;
}
.scrip-report-new .big-amt {
font-size: 16px!important;
font-weight: 600;
color: var(--font-color-2);
}
.scrip-report-new .dashboard-srcard .sm-cardgreen {
border-radius: 4px;
border: 1px solid var(--border-green);
padding: 10px;
}
.scrip-report-new .bigtext-green {
font-size: 18px;
font-weight: 500;
color: #30b54d;
}
.scrip-report-new .dashboard-srcard .sm-cardred {
border-radius: 4px;
border: 1px solid var(--border-red);
padding: 10px;
}
.scrip-report-new .bigtext-red {
font-size: 18px;
font-weight: 500;
color: #d95f6c;
}
.scrip-report-new .text-muted {
font-size: 11px;
font-weight: 400;
color: var(--font-color-3);
}
.scrip-report-new .color-box-1 {
background: var(--bgcolor-2);
padding: 20px;
}
.scrip-report-new .dashboard-srcard .qa-box {
margin-bottom: 15px;
border-bottom: 1px solid var(--border-1);
}
.scrip-report-new .dashboard-srcard .qa-box:last-child {
border: none;
}
@media (min-width: 768px) {
.scrip-report-new .col-md-9 {
flex: 0 0 auto;
width: 75%;
}
}
.scrip-report-new .dashboard-srcard .card-title {
border-bottom: 1px solid var(--border-1);
padding: 7px 15px;
margin-bottom: 15px;
}
.scrip-report-new *, .scrip-report-new *::before, .scrip-report-new *::after {
box-sizing: border-box;
}
.scrip-report-new .sr-dashboard-table {
width: 100%;
}
.scrip-report-new thead, .scrip-report-new tbody, .scrip-report-new tfoot, .scrip-report-new tr, .scrip-report-new td, .scrip-report-new th {
border-color: inherit;
border-style: solid;
border-width: 0;
}
.scrip-report-new .sr-dashboard-table tr {
white-space: nowrap;
background: none;
}
@media (min-width: 768px){
.scrip-report-new .col-md-12 {
flex: 0 0 auto;
width: 100%;
}
}
.scrip-report-new .title-blue {
font-size: 16px;
font-weight: 500;
color: #2070d8;
}
.scrip-report-new .dashboard-srcard .qa {
padding-left: 10px;
margin-left: 20px;
}
.scrip-report-new .text-green {
font-size: 11px;
font-weight: 500;
color: #30b54d;
}
.scrip-report-new .color-green {
color: #30b54d;
}
.scrip-report-new .color-red {
color: #d95f6c;
}
.scrip-report-new .dashboard-srcard .qa li::marker {
color: #2070d8;
}
.scrip-report-new .dashboard-srcard .qa li {
list-style-type: square;
}
.scrip-report-new .sr-dashboard-table td {
text-align: right;
padding: 9px;
color: var(--font-color-2);
font-weight: normal;
font-size: 14px;
border: 1px solid var(--border-1);
}
.scrip-report-new .dashboard-srcard .pa-20{
padding: 20px !important;
}
.scrip-report-new .dashboard-srcard .mb-2 {
margin-bottom: 0.5rem !important;
}
.scrip-report-new table {
caption-side: bottom;
border-collapse: collapse;
}
.scrip-report-new ol, .scrip-report-new ul, .scrip-report-new dl {
margin-top: 0;
margin-bottom: 1rem;
}
.g-btn{line-height: 20px}
/* New Backtesting popup */
.backtesting-pop-up{
}
.backtesting-pop-up .percent-allocation{
background: url("/images/percent.svg") center right no-repeat;
background-position: center right;
background-size: 10% 35%;
border-radius: 4px;
border-top-right-radius : 0px;
border-bottom-right-radius : 0px;
height: 35px!important;
width: 200px!important;
padding: 5px 25px 5px 5px;
display: inline-block;
text-align: right;
}
.light .backtesting-pop-up .percent-allocation{
background-color: #fff!important;
}
.dark .backtesting-pop-up .percent-allocation{border: 1px solid #25272c;background-color: #25272c;color: #9f9fa0;}
.backtesting-pop-up .non-percent{
border-radius: 4px;
border-top-right-radius : 0px;
border-bottom-right-radius : 0px;
height: 35px!important;
width: 200px!important;
padding: 5px 10px 5px 5px;
display: inline-block;
text-align: right;
}
.dark .backtesting-pop-up .non-percent{ border: 1px solid #25272c; background-color: #25272c; color: #9f9fa0; }
.backtesting-pop-up .custom-dialog-header{border-bottom:1px solid #1e1f23;padding: 15px 30px 15px 30px!important;}
.light .backtesting-pop-up .custom-dialog-header{border-bottom:1px solid #ccc;padding: 15px 30px 15px 30px!important;}
.backtesting-pop-up .footer{padding: 10px 35px;
display: flex;
justify-content: end; border-top: 1px solid #1e1f23;}
.light .backtesting-pop-up .footer{padding: 10px 35px;
display: flex;
justify-content: end; border-top: 1px solid #ccc;}
.or-label{
display: flex;
justify-content: space-between;
align-items: center;
margin: 15px;
}
.backtesting-pop-up .tooltip em a {
padding: 0px 13px;
display: block;
height: 35px;
line-height: 35px;
}
.backtesting .more-option{
color: #4DA2E8;
font-size: 14px;
}
.backtesting .exit-label{
font-size: 14px;
padding: 6px 10px;
border: 1px solid #262729;
border-radius: 5px;
min-width: 40px;
text-align: center;
margin: 0 2px;
}
.dark .strategy-listback{
background-color: #dfdddd;
}
.light .strategy-listback{
background-color: #23242a;
}
.backtesting .edit-option{display: flex;color: #4DA2E8;
font-size: 14px; cursor: pointer;}
.order-widget .spinner-width-ltp td {
padding-top: 0px;
border-radius: 100px;
padding: 3px 0px !important;
}
.buy-sell-popup .spinner-width-ltp {
padding: 0;
}
.subtitle-border{padding-bottom: 10px;
border-bottom: 1px solid #252525;
margin-bottom: 20px;
font-size: 15px;
font-weight: 500;
}
.spinner-box-1 {
border: 1px solid #494b52;
border-radius: 3px;
margin-bottom: 6px;
width: 230px;
height: 29px;
background: #121212;
border: 1px solid #333333;
border-radius: 100px;
margin: 7px 15px 10px 0;
overflow: hidden;
}
.spinner-box-1:HOVER a {
visibility: visible;
}
.spinner-box-1 a {
height: 50%;
cursor: pointer;
visibility: hidden;
outline: none;
color: currentColor;
}
.ltp-box{ width: 90px;
background: #333333;
padding: 11px;
margin-left: 10px;
font-size: 12px;
}
.buy-sell-popup .order-widget .spinner-box-1 input {
color: var(--INPUT-COLOR);
padding-top: 0;
height: 30px;
background: #121212;
border: 1px solid #333333;
border-radius: 100px;
}
/* */
/* .spinner-box-1 {
border: 1px solid #ccc;
} */
.spinner-box-1 input {
width: 100% !important;
border-width: 0 !important;
text-align: right;
padding-right: 6px;
}
.spinner-box-1 a {
height: 50%;
cursor: pointer;
visibility: hidden;
outline: none;
color: currentColor;
}
.spinner-box-1:HOVER a {
visibility: visible;
}
.spinner-box-1.disabled:HOVER a {
visibility: hidden;
}
.spinner-box-1 a svg {
display: block;
}
.spinner-box-1 input:FOCUS {
outline: none;
border: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.spinner-box-1 a input:FOCUS {
visibility: visible;
}
.spinner-box-1:focus-within {
box-shadow: 0px 0px 3px 0px #2070D8;;
outline: none;
box-sizing: border-box;
border-radius: 100px;
}
.spinner-box-1.disabled:focus-within {
outline: none;
border: 1px solid #ccc;
}
.spinner-box-1.disabled, .spinner-box-1.disabled input {
background-color: #efefef;
}
.light .spinner-box-1{
background:#fff;
}
.light .buy-sell-popup .order-widget .spinner-box-1 input {
color: var(--INPUT-COLOR);
background: #ffffff;
}
.light .ltp-box{
width: 90px;
background: #edeff2;
}
.light .subtitle-border{padding-bottom: 10px;
border-bottom: 1px solid #edeff2;
}
/* #9f9fa075 */
.time-box{
position: relative;
width: 85px;
}
.time-box input {
width: 100%;
padding: 5px;
box-sizing: border-box;
}
.time-icon {
position: absolute;
right: 3px;
top: 5px;
bottom: 0;
z-index: 0;
}
.time-select {
border: 1px solid #ccc;
padding: 10px;
display: flex;
justify-content: space-between;
width: 300px;
}
.time-select h5 {
border-bottom: 1px solid #ccc;
padding: 0 0 8px;
margin: 0 0 10px 0;
}
.time-select td span {
padding: 5px;
border: 1px solid #ccc;
width: 13px;
display: inline-block;
text-align: center;
cursor: pointer;
height: 13px;
font-family: arial;
font-size: 12px;
line-height: 12px;
}
.time-select td span:hover{
background-color: #336eb666;
}
.time-select td.active {
background-color: var(--new-buy-color);
}
.preference .main-section{
display: flex;
flex-direction: column;
height: 100%;
box-sizing: border-box;
}
.preference .row{
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
display: flex;
flex-wrap: wrap;
margin-top: calc(var(--bs-gutter-y) * -1);
margin-right: calc(var(--bs-gutter-x) * -.5);
margin-left: calc(var(--bs-gutter-x) * -.5);
}
.main-tab {
border: 1px solid var(--bgcolor-2);
border-radius: 4px;
margin: 15px;
overflow: hidden;
display: flex;
}
.preference .col-md-3 {
width: 25%;
flex: 0 0 auto;
}
.main-tab .nav-tabs {
border-bottom: 1px solid var(--bgcolor-2);
color: var(--font-color-2);
width: 100%;
margin-bottom: 0;
padding: 12px 20px!important;
font-size: 13px;
font-weight: 500!important;
text-align: left;color: var(--FONT-COLOR);
width: 100%;
margin-bottom: 0;
padding: 12px 20px!important;
font-size: 14px;
font-weight: 500!important;
text-align: left;
display: block;
padding: 0.5rem 1rem;
/* color: #0d6efd; */
text-decoration: none;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
background: none;
border: 1px solid transparent;
border-top-left-radius: 0.25rem;
border-top-right-radius: 0.25rem;
border-bottom: 1px solid var(--bgcolor-2);
cursor: pointer;
box-sizing: border-box;
}
.main-tab .nav-tabs.selected{
background: #2070d8;
color: #fff;
text-shadow: none;
font-weight: 500;
border-bottom: var(--border-1);
border-top: 1px solid transparent;
border-left: 1px solid transparent;
border-right: 1px solid transparent;
border-radius: 0!important;
}
.main-tab .right-panel{
flex: 1 1 0%;
margin: 0px 20px;
display: flex;
flex-direction: column;
}
.preference .col-md-9 {
width: 75%;
flex: 0 0 auto;
}
.preference .tab-content {
margin: 0px 20px;
}
.preference .top-tabs {
height: 100%;
border-right: 1px solid var(--bgcolor-2);
}
.preference .leftMenu{
width: 100%;
table-layout: fixed;
padding: 12px 5px;
}
.preference .leftMenu td {
font-size: 15px;
cursor: pointer;
padding: 10px;
color: var(--FONT-COLOR);
vertical-align: middle;
}
.preference .leftMenu .selected td{
background-color: #2070d8;
color:white;
}
.preference .tab-pane {
display: none;
}
.preference .fade {
transition: opacity 0.15s linear;
}
.preference .active {
display: block;
}
.main-tab .tab-title {
padding: 10px 0 0 0!important;
border-bottom: 2px solid var(--bgcolor-2);
margin-bottom: 15px;
display: flex;
justify-content: space-between;
height: 44px;
height: 44px;
align-items: center;
}
.preference .indi-patt-row {
border: 1px solid var(--bgcolor-2);
padding: 6px 10px;
border-radius: 4px;
margin-bottom: 8px;
position: relative;
}
.preference .col-md-8 {
flex: 0 0 auto;
width: 66.66666667%;
}
.preference .col-md-1 {
width: auto;
}
.preference .ms-auto {
margin-left: auto !important;
}
.preference .right{
margin-right:9px;
}
.preference .main-section {
border: 1px solid var(--bgcolor-2);
border-radius: 4px;
margin: 15px;
padding: 15px;
}
.preference .form-group {
margin-bottom: 15px;
}
.preference .col-md-2 {
flex: 0 0 auto;
width: 16.66666667%;
}
.preference .col-md-10 {
flex: 0 0 auto;
width: 83.33333333%;
}
.preference .form-control {
display: block;
width: 100%;
padding: 0.375rem 0.75rem;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #212529;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ced4da;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 0.25rem;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
border: 1px solid var(--border-1);
background: var(--bgcolor-2);
color: #6c6a6d;
}
.preference .conditionssection {
border: 1px solid var(--bgcolor-2);
border-radius: 4px;
margin-top: 15px;
padding: 15px;
overflow:auto;
}
.preference .buttons{
display:flex;
justify-content:space-between;
padding:5px 30px;
}
.preference label {
display: block;
color: #666;
line-height: 30px;
}
.main-tab h3 {
margin: 0;
border-bottom: 2px solid #2070D8;
font-size: 18px;
display: inline-block;
padding: 10px 0;
}
.product-menu-section {
background: #fff;
border-radius: 10px;
padding: 10px;
display: inline-block;
width: 210px;
}
.dark .product-menu-section {
background-color: #18191c;
}
.product-menu-section .p-list {
border-bottom: 1px solid #ccc;
cursor: pointer;
padding: 10px;
display: block;
}
.dark .product-menu-section .p-list {
border-bottom: 1px solid #31343c;
}
.product-menu-section .p-list:last-child {
border-bottom: none;
}
.p-logo {
display: flex;
align-items: center;
}
.product-menu-section .p-list p {
margin: 0;
font-size: 13px;
font-weight: 500;
}
.product-menu-section .p-list p {
color: var(--FONT-COLOR);
}
.p-logo .plogo-text {
font-weight: 700;
padding-left: 5px;
}
.p-logo .plogo-text {
color: var(--FONT-COLOR);
}
.flow-lyaout-row-center {
display: flex;
align-items: center;
flex-direction: row;
}
.main-tab .right-panel .templ-row{
border: 1px solid var(--bgcolor-2);
padding: 6px 10px;
border-radius: 4px;
margin-bottom: 8px;
gap: 8px;
}
.main-tab .right-panel .templ-row.default-temp{
border: 2px solid #2070D8!important;
}
.main-tab .right-panel .templ-row .default{
color: #2070D8;
font-size: 12px;
border: 0;
visibility: hidden;
}
.main-tab .right-panel .templ-row:HOVER .default{
visibility:visible;
}
.main-tab .right-panel .templ-row a{
color: var(--font-color-1);
text-shadow: none;
font-weight: 400;
border: 1px solid var(--border-1);
border-radius: 4px;
display: inline-block;
padding: 4px 8px;
background: none;
}
.basket-pop-up .caption {
font-weight: 400;
}
.basket-pop-up .custom-dialog-header {
border-bottom: 1px solid #1e1f23;
padding: 10px 15px 5px 20px !important;
background-color: #31323a;
}
.light .basket-pop-up .custom-dialog-header {
border-bottom: 1px solid #ccc;
background-color:#edeff2;
padding: 15px 30px 15px 30px !important;
}
.basket-pop-up .tooltip em a {
padding: 0px 13px;
display: block;
height: 35px;
line-height: 35px;
}
.basket-pop-up .text-box {
border: 1px solid #505258;
color: #fff;
display: block;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
background-color: #31323a !important;
}
.basket-pop-up .text-box {
border: 1px solid #505258;
color: #fff;
display: block;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
background-color: #31323a !important;
}
.light .basket-pop-up .text-box {
background-color:#fff !important;
border: 1px solid #e0dfdf;
color: #000;
}
.basket-pop-up .symbol_search .search-box {
height: 100%;
background-color: #121212;
border: 0;
}
.light .basket-pop-up .symbol_search .search-box {
background-color: #fff;
border: none;
}
.basket-pop-up .span {
color: white;
padding: 10px 20px;
margin-bottom: 0;
font-size: 12px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
text-transform: uppercase;
letter-spacing: 0.8px;
font-weight: 500;
}
.basket-pop-up .buy {
background: #14488E;
}
.basket-pop-up .sell {
background: #DA3F3C;
}
.data-grid-bskt th {
white-space: normal !important;
font-weight: normal !important;
outline: none !important;
text-shadow: none;
color: var(- -FONT-COLOR);
padding: 10px 5px;
font-size: 14px;
overflow: hidden;
text-overflow: ellipsis;
}
.dark .data-grid-bskt th {
background-color: #31323A !important;
color: #fff;
}
.light .data-grid-bskt th {
background-color: #edeff2 !important;
}
.data-grid-bskt td {
padding: 2px;
vertical-align: text-top;
}
.dark .data-grid-bskt td {
background-color: #31323A !important;
border-color: transparent !important;
color: var(- -FONT-COLOR) !important;
}
.data-grid-bskt td {
padding: 5px;
vertical-align: text-top;
border-bottom-color: #ccc;
border-color: transparent !important;
border-width: 1px;
overflow: visible;
padding: 10px 0px 20px 10px;
}
.dark .data-grid-bskt td {
background-color: #121212 !important;
border-color: transparent !important;
border-bottom-color: #27282D !important;
border-width: 1px;
}
.dark .data-grid-bskt .disabled td {
color: #58595C !important;
}
.data-grid-bskt .selected td {
background-color: #433E36 !important;
color: white !important;
border-color: transparent !important;
}
.light .data-grid-bskt .selected td {
background-color: #ffffff !important;
color: black !important;
border-color: transparent !important;
}
.basket-pop-up .round-box {
font-size: 10px;
padding-bottom: 1px;
width: 50px;
border-radius: 3px;
line-height: 18px;
}
.light .basket-pop-up .round-box {
font-weight:600;
}
.data-grid-bskt .svg2 {
background-color: #121212;
border-radius: 5px;
cursor: pointer;
margin: 0px 3px;
border: 1px solid #6f7277;
padding: 2px 4px;
}
.data-grid-bskt .svg1 {
background-color: #121212;
border-radius: 5px;
cursor: pointer;
margin: 0px 3px;
border: 1px solid #6f7277;
padding: 2px 7px;
}
.light .data-grid-bskt .svg {
background-color: #fff;
border: 1px solid #ccc;
padding: 2px 7px;
}
.data-grid-bskt .svg svg{
color: #6f7277 !important;
}
.basket-pop-up .margin-panel {
display: flex;
height: 90px;
flex-direction: row;
background-color: #31323a;
}
.light .basket-pop-up .margin-panel {
background-color: #edeff2;
}
.basket-pop-up .left-margin-panel {
width: 25%;
padding: 10px 20px;
border-right: 2px solid #121212;
margin: 10px;
}
.basket-pop-up .right-margin-panel {
width: 75%;
height: 50%;
display: flex;
justify-content: flex-end;
padding: 10px 20px;
margin: 10px;
}
/*BacktestingReport*/
.analysis-panel{
width:100%;
height: auto;
}
.analysis-panel .analysis-cards{
display:flex;
flex-direction:column;
}
.analysis-panel .top-card{
margin:18px 0 0 0;
display:flex;
flex-wrap: wrap;
justify-content:flex-start;
}
.momsim .stats-card-div .amt{
font-size: 12px !important;
font-weight: 600;
}
.momsim .stats-card-div .status {
font-size: 12px;
font-weight: 500;
color: var(--font-color-1) !important;
padding: 2px 0 5px;
}
.stats-card-div{
/* border-radius: 4px; */
border-bottom: 1px solid var(--border-1);
}
.stats-card-div .status{
font-size: 13px;
font-weight: 700;
color: var(--font-color-1)!important;
padding:4px 0px;
}
.stats-card-div .amt{
font-size: 20px!important;
font-weight: 700;
color: var(--font-color-2);
padding: 6px 0px;
}
.stats-card-div .amt .color-blue{
color:var(--blue-buy-color);
}
.stats-card-div .amt .color-red{
color:var(--red-sell-color);
}
.stats-card{
width:249px;
border-radius: 4px;
border: 1px solid var(--border-1);
padding: 10px;
display:flex;
flex-direction:column;
margin:18px 0 0 18px;
}
.stats-card .status{
font-size: 13px;
font-weight: 700;
color: var(--font-color-1)!important;
padding:5px 10px;
}
.stats-card .amt{
font-size: 20px!important;
font-weight: 700;
color: var(--font-color-2);
padding:5px 10px;
}
.stats-card .amt .color-blue{
color:var(--blue-buy-color);
}
.stats-card .amt .color-red{
color:var(--red-sell-color);
}
.stats-card .amt .color-green{
color:var(--buy-color);
}
.analysis-panel .bottom-card{
display:flex;
flex-wrap: wrap;
justify-content:space-around;
width:100%;
}
.analysis-panel .month-card{
border-radius: 4px;
border: 1px solid var(--border-1);
padding: 10px;
display:flex;
flex-direction:column;
margin:18px;
height:270px;
}
.analysis-panel .backtest-detail{
border-radius: 4px;
border: 1px solid var(--border-1);
padding: 10px;
display:flex;
flex-direction:column;
margin:18px;
height:270px;
}
.analysis-panel .card-title{
font-size: 15px!important;
font-weight: 700;
color: var(--font-color-2);
padding:10px;
border-bottom: 1px solid var(--border-1);
}
.analysis-panel .detail-card-main{
overflow:auto;
display:flex;
flex-wrap: wrap;
justify-content:space-between;
padding:2px;
}
.analysis-panel .back-test-detail{
min-width:45%;
margin-top:15px;
}
.analysis-panel .detail-card{
border-radius: 4px;
border: 1px solid var(--border-1);
padding: 10px;
display:flex;
flex-direction:column;
}
.analysis-panel .detail-card .top{
font-size: 15px!important;
font-weight: 700;
color: var(--font-color-2);
padding:10px;
}
.analysis-panel .detail-card .bottom{
font-size: 12px!important;
font-weight: 400;
color: var(--font-color-2);
padding:0 10px 10px 10px;
}
.data-grid-analysis th{
white-space: normal !important;
font-weight: normal !important;
outline: none !important;
text-shadow: none;
color: var(--FONT-COLOR);
padding: 10px 5px;
font-size: 13px;
font-weight:600 !important;
overflow: hidden;
text-overflow: ellipsis;
background-color:#DEE4EC;
}
.data-grid-analysis ::-webkit-scrollbar { width: 8px; height: 8px;}
/* Track */#2070D8
.data-grid-analysis ::-webkit-scrollbar-track {background: transparent; }
/* Handle */
.data-grid-analysis ::-webkit-scrollbar-thumb {background: var(--blue-buy-color); width: 8px; height: 8px;border-radius:4px}
/* Handle on hover */
.data-grid-analysis ::-webkit-scrollbar-thumb:hover {background: var(--blue-buy-color); width: 6px; height: 2px;}
.data-grid-analysis ::-webkit-scrollbar-mouse:hover {background: var(--blue-buy-color); width: 6px; height: 2px;}
.dark .data-grid-analysis th{
background-color: #31323A !important;
}
.data-grid-analysis td{
padding: 2px;
vertical-align: text-top;
}
.dark .data-grid-analysis td{
background-color: #31323A !important;
border-color: #31323A !important;
color: var(--FONT-COLOR) !important;
}
.data-grid-analysis td{
vertical-align: text-top;
border-bottom-color: #ccc;
border-color: #ccc !important;
border-width: 1px;
overflow: visible;
}
.dark .data-grid-analysis td{
background-color: #1c1d21 !important;
border-color: #31323A !important;
border-bottom-color: #27282D !important;
border-width: 1px
}
.dark .data-grid-analysis .disabled td{
color: #58595C !important;
}
.data-grid-analysis .selected td{
background-color: #433E36!important;
color: white !important;
border-color: transparent !important;
}
.analysis-panel .year-column{
font-size: 13px;
font-weight:600 !important;
background: white;
}
.analysis-panel .total-column{
background-color:#DEE4EC;
font-size: 13px;
font-weight:600 !important;
}
.light .data-grid-analysis .selected td{
background-color: #ffffff!important;
color: black !important;
border-color: transparent !important;
}
.light .cell-blue{
background-color:#EDF5FF;
padding: 4px 6px;
}
.light .cell-red{
background-color:#FDF3F3;
padding: 4px 6px;
}
.dark .cell-blue{
background-color:#2A4C68;
padding: 4px 6px;
color:white;
}
.dark .cell-red{
background-color:#602525;
padding: 4px 6px;
color:white;
}
.statistics-panel .statistics-main{
height: 600px;
display:flex;
flex-direction:row;
margin:18px;
}
.statistics-panel .drop-down-table{
width:25%;
border: 1px solid var(--border-1);
border-radius: 4px;
margin-right:10px;
display:flex;
flex-direction:column;
overflow-y: auto;
}
.statistics-panel .stat-charts{
width:75%;
display:flex;
flex-direction:column;
}
.statistics-panel .equity-chart{
border: 1px solid var(--border-1);
border-radius: 4px;
margin-bottom: 10px;
}
.statistics-panel .draw-down-chart{
border: 1px solid var(--border-1);
border-radius: 4px;
}
.div-label{
font-size: 18px;
font-weight: 700;
border-bottom: 1px solid #2070D8;
margin-top: 10px;
padding: 10px;
}
.statistics-panel .equity-chart-title{
font-weight:700;
font-size:15px;
padding:10px;
border-bottom: 1px solid var(--border-1);
}
.statistics-panel .drawdown-chart-title{
font-weight:700;
font-size:15px;
padding:10px;
border-bottom: 1px solid var(--border-1);
}
.statistics-panel .over-height {
height:250px;
}
.statistics-panel .drop-down-title{
display:flex;
flex-direction:row;
padding: 10px;
justify-content: space-between;
}
.statistics-panel .drop-down-title .title{
font-weight:700;
font-size:15px;
}
.statistics-panel .drop-down-title .expand-all{
font-weight:500;
font-size:12px;
color:#4DA2E8;
}
.light .statistics-panel .dropdown-head{
display:flex;
justify-content:space-between;
padding:10px;
background-color:#DEE4EC;
margin-bottom:0px !important;
border-radius:4px;
}
.dark .statistics-panel .dropdown-head{
display:flex;
justify-content:space-between;
padding:10px;
background-color:#1E1E1E;
color:white;
margin-bottom:0px !important;
border-radius:4px;
}
.statistics-panel .dropdown-table-body {
width: 100%;
}
.statistics-panel .dropdown-table-body tr {
border-bottom: 1px solid var(--border-1)!important;
}
.statistics-panel .dropdown-table-body tr:last-child {
border-bottom: none!important;
}
.statistics-panel .dropdown-table-body td {
padding: 5px 10px;
}
.statistics-panel .dropdown-table-body td:last-child {
text-align: right!important;
}
@media only screen and (max-width: 1024px) {
.charts-panel .charts-align{
width:100% !important;
}
}
.charts-panel .charts-main{
display:flex;
flex-wrap:wrap;
justify-content: space-between;
}
.charts-panel .charts-align{
margin:18px 0 0 18px;
width:48%;
border: 1px solid var(--border-1);
border-radius: 4px;
}
.charts-panel .charts-title{
font-weight:700;
font-size:15px;
padding:5px 10px;
border-bottom: 1px solid var(--border-1);
}
.charts-panel .over-height{
height:265px;
}
.trade-result-detail td:first-child{
text-align: left;
}
.trade-result-detail td:not(first-child){
text-align: right;
}
.option-chain .price-border{
background:#121212;
border: 1px solid var(--border-1);
border-radius:5px;
padding:10px;
}
.light .option-chain .price-border{
background:white;
border: 1px solid var(--border-1);
border-radius:5px;
padding:10px;
}
.option-chain .red{
color:#FF4343;
}
.option-chain .green{
color:#10B54E;
}
.light .option-chain td:has(.in){
background: #FFF8E8;
}
.dark .option-chain td:has(.in){
background: #20293D;
}
.light .option-chain td:has(.out){
background: white;
}
.dark .option-chain td:has(.out){
background: #242424;
}
.light .option-chain td:has(.neutral){
background: #EAEA92;
}
.dark .option-chain td:has(.neutral){
background: #1A1F2A;
}
.light .option-chain td:has(.white){
background: white;
}
.dark .option-chain td:has(.white){
background: #242424;
}
.option-table-grid {
border-collapse: collapse;
width: 100%;
}
.option-table-grid tbody{
height:300px;
overflow-y: auto;
}
.option-table-grid thead{
background: #F1F1F1;
color: #333333;
position: sticky;
top: 0;
z-index:2;
height:40px;
}
.dark .option-table-grid thead {
background: #121212;
color: #ddd;
}
.dark .option-table-grid tr {
border-bottom: 1px solid #383940;
}
.option-table-grid tr {
border-bottom: 1px solid #ddd;
text-align: center;
}
.option-table-grid td {
padding: 12px 10px;
font-size: 11px;
font-weight:400;
color:#F0F0F0;
width:6% !important;
}
.light .option-table-grid td {
color:#68727E;
}
.option-table-grid .header td{
font-size: 11px;
font-weight:700!important;
color:#F0F0F0;
}
.light .option-table-grid .header td{
color:#68727E;
}
.dark .option-background{
background-color: #0C0C0C;
border: 1px solid #2a2b31;
border-radius: 4px;
}
.light .option-background{
background-color: #fff;
border: 1px solid #ccc;
margin-top:-1px;
}
.option-table-grid .graph{
position: absolute;
height: 100%;
background-color: #36E277;
z-index: 0;
border-radius: 0 10px 10px 0;
}
.dark .option-table-grid .graph{
background: #10B54E;
}
.option-table-grid .qty{
z-index: 2;
position: absolute;
top: 0;
line-height: 25px;
left:10%;
}
.option-chain .option-title{
color: #68727E;
font-size: 14px;
font-weight: 600;
white-space: nowrap;
padding: 0px 10px;
}
.sbtype{
font-size: 14px;
font-weight: normal;
display: flex;
align-items: center;
}
.sbtype .tooltip {
width: 10px;
height: 10px;
margin-left: 5px;
background-color: #2070D8;
padding: 4px;
border-radius: 50%;
font-size: 12px;
color: white;
position: relative;
text-align: center;
cursor: pointer;
line-height: 10px;
margin-right: 5px;
}
/*All Reports*/
.outer-panel{
border-radius: 6px;
border: 1px solid var(--border-1);
display:flex;
flex-direction:column;
margin:18px;
height:80vh;
}
.outer-panel .title{
color:#333333;
padding:10px 18px;
/*background: #F1F1F1;*/
display:flex;
justify-content:space-between;
font-weight: 500;
font-size: 14px;
border-radius:6px 6px 0 0;
}
.dark .outer-panel .title {
background: #31323A;
color: #ddd;
}
.outer-panel .title .switch-button{
display:flex;
border-radius: 6px;
border: 1px solid var(--border-1);
background: white;
}
.dark .outer-panel .title .switch-button{
background: #1C1D21;
}
.outer-panel .title .switch-button .gainers{
padding:4px 16px;
color: var(--FONT-COLOR);
cursor: pointer;
}
.outer-panel .title .switch-button .losers{
padding:4px 16px;
color:var(--FONT-COLOR);
cursor: pointer;;
}
.outer-panel .title .switch-button .active{
background: #EAF4FF;
color:#2B6CB3;
border: 1px solid #2B6CB3;
border-radius: 6px;
}
.light .outer-panel .data-grid th{
background-color:#F1F1F1;
}
.outer-panel .data-grid td{
padding: 7px;
}
.heatmap-title{
color: #68727E;
font-size: 14px;
font-weight: 600;
white-space: nowrap;
padding: 0px 10px;
}
.input-title{
color: #68727E;
font-size: 14px;
font-weight: 600;
white-space: nowrap;
padding: 0px 10px;
}
.msf-chart{
height:calc(100% - 102px);
display: flex;
flex: 1 1 auto;
gap: 10px;
}
.arrow-rotate svg {
transform: rotate(180deg);
}
.position-size-title{
display:flex;
align-items:center;
color: #68727E;
font-size: 17px;
font-weight: 600;
white-space: nowrap;
padding:17px;
justify-content:space-between;
}
.position-size-label{
display:flex;
align-items:center;
color: #9B9B9B;
font-size: 13px;
font-weight: 600;
white-space: nowrap;
padding:10px;
}
.light .position-size-label{
color: #000;
}
.position-size-label input{
text-align: right;
}
.position-size-info{
display:flex;
align-items:center;
color: #68727E;
font-size: 17px;
font-weight: 600;
padding:17px;
justify-content:space-between;
}
.advance-point{
color:var(--buy-color);
display: inline;
font-weight: bold;
}
.decline-point{
color:var(--sell-color);
display: inline;
font-weight: bold;
}
.light .scrip-info{
color:#000;
}
.dark .scrip-info{
fill:white;
}
.buzzar-straddle{
display: flex;
flex-wrap: wrap;
align-items: baseline;
line-height: 13px;
}
.buzzar-straddle div{
color: #68727E;
font-weight: 600;
font-size: 14px;
margin:5px;
}
.mt-10{
margin-top:10px
}
.fundamental-summary{
display: flex;
padding: 0 30px 20px 30px;
height: 100%;
box-sizing: border-box;
flex-direction: column;
font-size: 14px;
margin:-10px 0 0 0;
}
.content-panel .fundamental-summary{
padding: 0px;
min-width: 500px;
}
.fundamental-summary .company-name{
font-size: 13px;
font-weight: 600;
color:#A6A6A6;
}
.light .fundamental-summary .company-name{
font-size: 13px;
font-weight: 600;
color:#6C6C6C;
}
.sep-line{
border-bottom: 1px solid #333;
padding-bottom: 8px !important;
}
.light .sep-line{
border-bottom: 1px solid #EDEFF2;
}
.fundamental-summary .order-tab{
margin:0px;
}
.button-table{
background: #171717;
display: flex;
justify-content: end;
align-items: center;
padding: 0 30px;
height: 80px;
}
.button-table .buy-button{
padding: 8px 16px;
width: 100px;
background: #2070D8;
color: white;
margin-bottom: 0;
font-size: 16px !important;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
margin-right: 5px;
border: 0;
}
.light .buy-sell-popup .button-table {
background: #EDEFF2;
}
.radar-btn{
display:flex;
align-items:center;
padding:4px 16px;
color: #4D9BE1;
cursor: pointer;
border:1px solid #4DA2E8;
border-radius:5px;
background:white;
font-size:12px;
font-weight:500;
}
.funda-ratios{
display:flex;
flex-direction:row;
justify-content:space-between;
}
.funda-ratios-inner{
border-left:1px solid #333;
padding:0 10px;
display:flex;
flex-direction: column;
}
.light .funda-ratios-inner{
border-left:1px solid #EDEFF2;
}
.radar-value{
font-size: 15px;
font-weight:700;
padding-bottom:5px;
}
.radar-key{
font-size:11px;
font-weight:700;
color:#7E7E83;
}
.summary-form{
padding:30px;
}
.radar-clear{
width: 100%;
padding-right: var(--bs-gutter-x, 0.75rem);
padding-left: var(--bs-gutter-x, 0.75rem);
margin-right: auto;
margin-left: auto;
}
.radar-head{
font-size:14px;
font-weight:600;
color:#4DA2E8;
padding-bottom:20px;
}
.radar-radio-share{
display: flex;
justify-content: center;
}
.radar-radio{
display: flex;
justify-content: space-between;
padding: 0 30px;
}
.funda-ratios-bottom{
padding: 10px;
border-bottom: 1px solid #333;
}
.light .funda-ratios-bottom{
border-bottom: 1px solid #EDEFF2;
}
.fundamental-summary .switch-button{
display:flex;
border-radius: 6px;
border: 1px solid var(--border-1);
background: white;
width:130px;
}
.dark .fundamental-summary .switch-button{
background: #1C1D21;
}
.fundamental-summary .switch-button .gainers{
padding:4px 16px;
color: var(--FONT-COLOR);
cursor: pointer;
}
.fundamental-summary .switch-button .losers{
padding:4px 16px;
color:var(--FONT-COLOR);
cursor: pointer;;
}
.fundamental-summary .switch-button .active{
background: #EAF4FF;
color:#2B6CB3;
border: 1px solid #2B6CB3;
border-radius: 6px;
}
.toggle-btn-outer{
display:flex;
justify-content: end;
}
.fundamental-summary .detailed-table-header{
font-size:14px;
font-weight:700;
color:#68727E !important;
text-align:right;
}
.fundamental-summary .detailed-table-sub-header{
font-size:14px;
font-weight:700;
color:#68727E !important;
text-align:left;
}
.fundamental-summary .detailed-table-value{
font-size:14px;
font-weight:400;
color:#68727E;
text-align:right;
}
.radar-funda-table td,th{
padding:10px;
}
.radar-border tr{
border: 1px solid #333;
}
.light .radar-border tr{
border: 1px solid #EDEFF2;
}
.radar-border thead{
background:#31323A;
}
.light .radar-border thead{
background:#EDEFF2;
}
.first-column-fixed tr th:nth-child(2),.first-column-fixed tr td:nth-child(2) {
position: sticky;
z-index: 1;
border-bottom: 1px solid #31323A;
}
.outer-panel-new{
border-radius: 6px;
display:flex;
flex-direction:column;
margin:18px;
height:80vh;
}
.outer-panel-new .title{
color:#333333;
padding:10px 18px;
/*background: #F1F1F1;*/
display:flex;
justify-content:space-between;
font-weight: 500;
font-size: 14px;
border-radius:6px 6px 0 0;
}
.dark .outer-panel-new .title {
background: #31323A;
color: #ddd;
}
.outer-panel-new .title .switch-button{
display:flex;
border-radius: 6px;
border: 1px solid var(--border-1);
background: white;
}
.dark .outer-panel .title .switch-button{
background: #1C1D21;
}
.outer-panel-new .title .switch-button .gainers{
padding:4px 16px;
color: var(--FONT-COLOR);
cursor: pointer;
}
.outer-panel .title .switch-button .losers{
padding:4px 16px;
color:var(--FONT-COLOR);
cursor: pointer;;
}
.outer-panel-new .title .switch-button .active{
background: #EAF4FF;
color:#2B6CB3;
border: 1px solid #2B6CB3;
border-radius: 6px;
}
.light .outer-panel-new .data-grid th{
background-color:#F1F1F1;
}
.outer-panel-new .data-grid td{
padding: 7px;
}
.spinner-dropdown{
border: 1px solid #333333 !important;
border-radius: 100px;
width:125px;
height:40px;
padding:10px;
}
.opt-over{
display: none;
position: absolute;
top: -13px;
right: 10px;
padding: 8px 0px;
width: 80px;
}
.stockdetail .row:HOVER .opt-over {
display:block;
}
.opt-buy{
background-color: var(--new-buy-color) !important;
font-size: 15px!important;
color: #fff;
font-weight: 500;
}
.opt-sell{
background-color: #ef4258 !important;
font-size: 15px!important;
color: #fff;
font-weight: 500;
}
.option-chain-buy-sell{
background-color: #121212;
}
/* Oi Profile */
.oi-profile-svg .bar-info{
display: none;
}
.oi-profile-svg:hover .bar-info{
z-index:14;
display: block;
}
.setup-dashboard{
background:#F6C63E33;
padding:2px 20px;
border-radius: 30px;
margin-bottom: 8px;
font-size: 14px;
text-transform: uppercase;
}
.dark .setup-dashboard{
background:#2C2D33;
}
.sector-section {display: flex; vertical-align: top;height: 100%}
.sector-section .sector-box{width: 100%; border-radius: 7px; padding:20px;display:flex;}
.sector-section .sector-box .bb-boxs{display: flex;flex-direction:column; justify-content: space-between; align-items: center;height: 100%}
.sector-section .sector-box hr{ border: 1px solid #ccc; margin: 18px 0;}
.sector-section .sector-box h4{ color: var(--FONT-COLOR); font-size: 14px; font-weight: 500; margin: 0; line-height: 22px; margin-bottom: 15px;}
.sector-section .sector-box .bb-box{display: flex; text-align:left; width:100%;cursor: pointer;font-size: 14px;}
.sector-section .sector-box .bb-box .sectoricon{width: 50px; margin-right: 15px;}
.sector-section .sector-box .bb-box .sectorinfo p{ color: #828181; font-size: 12px; font-weight: 500; margin: 0; line-height: 22px; text-transform: uppercase;}
.sector-section .sector-box .bb-box .sectorinfo p{ color: #828181; font-size: 12px; font-weight: 500; margin: 0; line-height: 22px; text-transform: uppercase;}
.sector-section .sector-box .bb-box .sectorinfo .sector-value{font-size: 11px; font-weight: 600;}
.seasonality-idx-green{
background-color:#53B987;padding: 3px 5px;color: #ddd;
}
.light .seasonality-idx-green{
background-color:#adf7cd;color: #000;
}
.seasonality-idx-red{
background-color:#EB4D5C;padding: 3px 5px;color: #ddd;
}
.light .seasonality-idx-red{
background-color:#ffc4c3;color: #000;
}
.strategy-qual-analysis-green{
background-color:#00802b;padding: 3px 5px;color: #ddd;
}
.light .strategy-qual-analysis-green{
background-color:#adf7cd;color: #000;
}
/* Momentum Simulation */
.plPanel{
width: 210px;
border-radius: 4px;
border: 1px solid var(--border-1);
padding: 10px;
}
.momsim .custom-dialog-header{
background-color:#fff;
}
.dark .momsim .custom-dialog-header{
background-color: #121212;
}
.momsim .popupContent{
background-color:#fff;
}
.dark .momsim .popupContent{
background-color: #121212;
}
.momsim .content-panel{
border : none;
margin : 0px;
padding: 15px;
margin: 0 15px 15px 15px;
border:none!important;
overflow-y: auto;
}
.dark .momsim .content-panel{
background-color: #121212;
}
.momsim .stats-card{
margin: 10px 0px;
padding: 7px;
}
.momsim .stats-card .amt{
font-size: 16px !important;
font-weight: 600;
}
.momsim .stats-card .status {
font-size: 12px;
font-weight: 500;
color: var(--font-color-1) !important;
}
.momsim .date-header{
color:#14488e;
font-weight: 600;
font-size: 16px;
}
.mom-table table{
border-collapse: collapse;
}
.mom-table thead th{
font-size: 12px;
text-shadow:none;
padding: 5px 10px;
border-bottom: 1px solid #31323A;
}
.dark .mom-table thead th{
border-bottom: 1px solid #31323A;
}
.mom-table tbody tr{
background:#fff
}
.dark .mom-table tbody tr{
background:#121212!important
}
.mom-table td{
font-size: 11px;
border:none;
text-shadow:none;
border: 1px solid #31323A;
padding: 5px 10px;
}
/* .mom-border{
border:1px solid var(--border-1);
} */
.dark .mom-table th{
color: var(--FONT-COLOR) !important;
}
.dark .mom-table td{
color: var(--FONT-COLOR) !important;
background-color: #121212 !important;
border-color: #31323A !important;
border-bottom-color: #27282D !important;
border-width: 1px
}
/* mom dialog */
.mom-dialog .form-control {
width: 250px !important;
height: 27px !important;
font-size: 13px !important;
}
.mom-dialog .percent{
/* background: url(/images/percent.svg) #fafafa center right no-repeat;
background-position: center right; */
background-size: 11% 37%;
width: 250px !important;
text-align: right;
padding-right: 21px;
}
.mom-dialog .footer {
height: 80px;
display: flex;
}
.mom-dialog .custom-dialog-header{
height: 60px;
}
.light .mom-dialog .footer{
background-color: #edeff2;
}
.dark .mom-dialog .footer{
background: #171717;
}
.mom-table {
border: 1px solid var(--border-1);
border-radius:4px;
}
.mom-dialog .caption{
margin: 20px;
font-size:16px;
font-weight:400;
}
.momsim .equity-chart{
height: calc(100% - 45px);
border: 1px solid var(--border-1);
width: 100%;
}
.strategy-qualification-analysis{
color:#fff;
}
.light .strategy-qualification-analysis{
color:#000;
}
.right-stat .stats-card{
margin: 10px 0px;
padding: 12px;
width: 210px;
}
.left-stat{
border: 1px solid var(--border-1);
padding: 5px;
}
.right-stat{
height: calc(100% - 30px - 15px);
border: 1px solid var(--border-1);
}
.right-stat .right-stat-panel{
display: flex;
justify-content: space-evenly;
margin-bottom: 10px;
}
.right-stat .stat-grid-3 {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 10px;
margin: 0 10px;
}
.left-stat .cell-blue{
font-size:12px;
}
.left-stat div{
font-size:12px;
}
.toggle-button{
display: flex;
justify-content:space-between;
margin: 20px;
font-size: 13px; font-weight: 500;
gap:15px;
}
.toggle-button .tog-btn {
color: unset;
cursor: pointer;
border: 1px solid #818181;
border-radius: 50px;
padding: 7px 10px;
display:block;
width:100%;
text-align:center
}
.toggle-button .active {
background: #EAF4FF;
border: 1px solid #2B6CB3;
color:unset;
}
.dark .toggle-button .active {
background: #2070d838;
border: 1px solid #2B6CB3;
color: unset;
}
.input-position-cal{
padding: 12px;
border-radius: 100px;
}
.dark .input-position-cal{
background: #121212;
border: 1px solid #333333 !important;
}
.pos-cal-button-buy{
padding: 5px 10px;
width: 100px;
color: white;
margin-bottom: 0;
background: #2070D8;
font-size: 16px !important;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
margin-right: 5px;
border: 0;
}
.pos-cal-button-sell{
padding: 5px 10px;
width: 100px;
color: white;
margin-bottom: 0;
background: var(--red-sell-color);
font-size: 16px !important;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
margin-right: 5px;
border: 0;
}
.buzzar-dialog .popupContent .custom-dialog-header{
flex-wrap:wrap;
width:450px;
}
.simulator-table-label {
text-align: center;
padding: 12px;
font-size: 16px;
}
.export-button {
background: rgba(255, 255, 255, 0.2);
border: 2px solid #2196F3;
border-radius: 5px; /* Adjusted for a square-like shape */
color: #2196F3;
padding: 2px 8px;
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
cursor: pointer;
backdrop-filter: blur(5px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
}
.export-button:hover {
background: #2196F3;
color: #ffffff;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
transform: translateY(-2px);
}
.export-button:active {
background: #1976D2;
color: #ffffff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
transform: translateY(0);
}
/* Below all three css related to third-column-fixed class are imp to make scrip column as stickey */
.third-column-fixed tr th:nth-child(1),.third-column-fixed tr td:nth-child(1) {
position: sticky;
left: 0;
z-index: 1;
/* background: white; */
}
.third-column-fixed tr th:nth-child(3),.third-column-fixed tr td:nth-child(3) {
position: sticky;
left: 0;
z-index: 1;
/* background: white; */
}
.light .third-column-fixed tr th:nth-child(3),.third-column-fixed tr td:nth-child(3) {
background: white;
}
.lot-toggle {
background-color: transparent;
color: #A6A6A6;
border: 0.5px solid #ccc;
width: 80px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
border-radius: 20px;
text-align: center;
font-size: 12px;
position: relative;
overflow: hidden;
}
.highlight {
background-color: #0078FF;
color: #fff;
border: 2px solid #0078FF;
transform: scale(1.1);
box-shadow: 0 0 10px rgba(0, 120, 255, 0.5);
}
.toggle-container {
display: inline-flex;
gap: 5px;
border: 0.5px solid #ccc;
border-radius: 25px;
padding: 5px;
}
.margin-lot {
margin-right: 8px;
}
.margin-qty{
margin-right: 5px;
}
.chart-menu::-webkit-scrollbar {
width: 8px;
}
.chart-menu::-webkit-scrollbar-thumb {
background-color: #2070D8;
}
.chart-menu::-webkit-scrollbar-thumb:hover {
background-color: #2070D8;
}
.dashboardScan-button {
background: #2070D8;
border-radius: 5px;
border-color: #2070D8;
color: white;
width: 48px;
height: 23px;
cursor: pointer;
backdrop-filter: blur(5px);
/*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/
transition: all 0.3s ease;
}
.dashboardScan-button:hover {
background: #115cbd;
color: #ffffff;
/*box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);*/
transform: translateY(-2px);
}
.dashboardScan-button:active {
background: #1976D2;
color: #ffffff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
transform: translateY(0);
}
.dashboardScan-button-bul {
background: #2070D8;
/*border: 2px solid #fd773e; */
border-color: #2070D8;
border-radius: 5px;
color: white;
width: 48px;
height: 30px;
cursor: pointer;
backdrop-filter: blur(5px);
/*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
transition: all 0.3s ease;
}
.dashboardScan-button-bul:hover {
background: #115cbd;
border-color: #2070D8;
color: #ffffff;
/*box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); */
transform: translateY(-2px);
}
.dashboardScan-button-bul:active {
background: #2070D8;
color: #ffffff;
/*box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); */
transform: translateY(0);
}
.timeframe-tab {
padding: 8px 15px;
margin-right: 10px;
cursor: pointer;
font-weight: bold;
color: #333;
border-bottom: 2px solid transparent;
}
.timeframe-tab:hover {
color: #007bff;
}
.selected-tab {
color: #007bff;
border-bottom: 2px solid #007bff;
}
.toggle-pfdashboard-button{
display: flex;
/* justify-content:space-between; */
margin: 20px;
font-size: 13px; font-weight: 500;
gap:15px;
}
.toggle-pfdashboard-button .tog-btn {
color: unset;
cursor: pointer;
border: 1px solid #818181;
border-radius: 50px;
padding: 7px 10px;
display:block;
width:100%;
text-align:center
}
.toggle-pfdashboard-button .active {
background: #EAF4FF;
border: 1px solid #2B6CB3;
color: unset;
}
.dark .toggle-pfdashboard-button .active {
background: #2070d838;
border: 1px solid #2B6CB3;
color: unset;
}
.hover-row {
position: relative;
}
.hover-buttons {
display: none;
position: absolute;
top: 1px;
left: 85px;
padding: 8px 0px
}
.hover-row:hover .hover-buttons {
display: inline-flex;
gap: 3px;
}
.ws-btn {
color: #6C6C6C;
padding: 5px!important;
margin-bottom: 0;
font-size: 11px !important;
line-height: 18px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
text-transform: uppercase;
background-color: #1E1E1E;
margin: 0 2px;
height: 24px !important;
width: 24px !important;
}
.buy-btn {
background-color: var(--new-buy-color) !important;
font-size: 14px!important;
color: #fff;
font-weight: 500;
}
.sell-btn {
background-color: var(--new-sell-color) !important;
font-size: 14px!important;
color: #fff;
font-weight: 500;
}
.pos-btn {
background-color: #53B987 !important;
font-size: 14px!important;
color: #fff;
font-weight: 500;
}
.hover-cell-wrapper {
display: flex;
align-items: center;
position: relative;
}
.fallback-avatar {
width: 24px;
height: 24px;
background-color: #007bff;
color: white;
text-align: center;
font-weight: bold;
line-height: 24px;
border-radius: 50%;
margin-right: 10px;
}
.stock-name {
font-weight: 500;
margin-right: auto;
}
.hover-buttons {
display: none;
margin-left: auto;
gap: 3px;
}
.hover-cell-wrapper:hover .hover-buttons {
display: flex;
}
.buy-btn, .sell-btn {
background-color: #28a745;
color: white;
border: none;
padding: 2px 6px;
font-size: 12px;
border-radius: 3px;
cursor: pointer;
}
.sell-btn {
background-color: #dc3545;
}
.disclaimer-text {
padding: 10px;
background-color: #18191d;
border-radius: 4px;
font-size: 15px;
}
.light .disclaimer-text {
padding: 10px;
background-color: #ffffff;
border-radius: 4px;
font-size: 15px;
}
.light .disclaimer-text b{
color : #151515;
}
.anchor-investing{
outline: none;
text-decoration: none;
color: #4FC3F7;
}
.light .anchor-investing{
outline: none;
text-decoration: none;
color: #0991ce;
}
.sip-margin-panel {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
background-color: #31323a;
width: 100%;
padding: 0;
margin: 0;
box-sizing: border-box;
}
.sip-left-margin-panel {
flex: 1;
color: white;
padding: 8px;
font-size: 12px;
}
.light .sip-left-margin-panel{
background-color:#edeff2;
flex: 1;
color:black;
padding: 8px;
}
.light .sip-right-margin-panel{
background-color:#edeff2;
}
.sip-right-margin-panel {
display: flex;
align-items: center;
gap: 8px;
padding: 8px;
}
.sip-Detail-label {
font-weight: bold;
color: #333;
text-align: right;
padding-right: 8px;
white-space: nowrap;
}
.sip-value-column {
vertical-align: middle;
text-align: center;
font-size: 13px;
color: #222;
}
.manage-dashboard-panel {
margin: 0 10px;
background: #2C2D33;
}
.light .manage-dashboard-panel {
background: #f1f1f1;
}
.dashboard-popup {
width: 375px;
background: #40414b;
}
.light .dashboard-popup {
background: #e3e1e1;
}
.dashboard-popup-content {
width: 100%;
height: 450px;
background: #18191d;
}
.light .dashboard-popup-content {
background: #fff;
}
.dashboard-popup-content::-webkit-scrollbar {
width: 8px;
}
.dashboard-popup-content::-webkit-scrollbar-thumb {
background-color: #2070D8;
}
.dashboard-popup-content::-webkit-scrollbar-thumb:hover {
background-color: #2070D8;
}
.sip-dialog-btn {
padding: 8px 16px;
font-size: 12px;
cursor: pointer;
border: 1px solid #555;
background-color:#18191d;
color: #9B9B9B;
border-radius: 4px;
font-weight: bold;
}
.sip-dialog-btn:hover {
background-color: #1f2127;
}
.close-button {
background: url(/images/close-icon.svg) no-repeat center center !important;
width: 16px;
height: 16px;
cursor: pointer;
display: inline-block;
background-size: contain;
}
.scanner-item {
display: flex;
align-items: center;
width: 100%;
padding-right: 5px;
gap: 8px;
box-sizing: border-box;
}
.favourite {
flex-shrink: 0;
cursor: pointer;
height: 17px;
}
.favourite-fill {
flex-shrink: 0;
cursor: pointer;
height: 22px;
}
.scanner-name-scroll {
overflow-x: auto;
white-space: nowrap;
flex-grow: 1;
}
.sip-Detail-label {
font-weight: bold;
font-size: 13px;
padding-right: 6px;
text-align: left;
white-space: nowrap;
}
.Fav-menu {
margin: 0;
list-style: none;
max-height: 500px;
overflow: auto;
}
.Fav-menu li a {
color: #d3d5d6;
display: block;
padding: 3px 10px;
position: relative;
outline: 0;
height:28px;
}
.Fav-menu li hr{
margin: 1px 8px;
border: 0;
border-bottom: 1px solid #ccc;
}
.Fav-menu li a {
color: var(--FONT-COLOR);
cursor: pointer;
}
.Fav-menu li a:HOVER {
background-color: rgba(216, 240, 250, 0.6);
}
.dark .Fav-menu li a:HOVER {
background-color: #232428;
}
.Fav-menu::-webkit-scrollbar {
width: 8px;
}
.Fav-menu::-webkit-scrollbar-thumb {
background-color: #2070D8;
}
.Fav-menu::-webkit-scrollbar-thumb:hover {
background-color: #2070D8;
}
.icon-style {
height: 24px;
width: 24px;
border-radius: 50%;
border: 1px solid #d1d5db; /* default */
transition: transform 0.3s ease, border-color 0.3s ease;
}
.icon-style:hover {
transform: scale(1.15);
border-color: #2070D8 !important;
}
.fallback-icon {
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-weight: bold;
font-size: 12px;
background-color: #2070D8;
}
.light .icon-style {
border-color: #dfe2e8;
}
.dark .icon-style {
border-color: #2a2a2b;
}
.sipbook-sub-header {
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
/* border-bottom: 1px solid #3c3d44; */
padding-bottom: 5px;
}
.sipbook-sub-header .sipbook-subheading {
font-size: 18px !important;
margin: 10px 0 !important;
}
.sip-gwt-Button {
background: #14488E;
color: white;
padding: 6px 25px;
margin-bottom: 0;
font-size: 12px !important;
line-height: 20px;
text-align: center;
vertical-align: middle;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
display: inline-block;
border-radius: 4px;
border: 0;
text-transform: uppercase;
letter-spacing: 0.8px;
font-weight: 500;
}
.action {
display: flex;
justify-content: end;
align-items: center;
gap: 10px;
}
.action .link {
color: #1275fb !important;
}
.action .link:hover {
color: #4593ff !important;
}
.action .link-icon {
color: #6c727a !important;
height: 18px;
}
.action .edit:hover {
color: #1275fb !important;
}
.action .trash:hover {
color: #eb4d5c !important;
}
.action-icon {
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
}
.sipbook-main-table {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
border: 1px solid #23242a;
color: #9f9f9c;
border: none;
}
.sipbook-main-table {
width: 100%;
}
.sipbook-main-table th {
padding: 10px;
font-weight: 500;
/* font-size: 14px; */
min-width: 120px;
color: #fff;
}
.sipbook-main-table th i {
font-size: 12px;
padding: 3px;
}
.sipbook-main-table td {
padding: 10px;
font-weight: normal;
font-size: 14px;
}
.light .sipbook-main-table td {
padding: 10px;
font-weight: normal;
font-size: 14px;
color: #222326;
}
.sipbook-main-table td strong {
color: #be9b60;
}
.sipbook-main-table tr:nth-child(even) {
background-color: #2a2b31
}
.light .sipbook-main-table tr:nth-child(even) {
background-color: #e8e9f1
}
.zone-input {
padding: 8px 12px;
border: 1px solid #3c3d45;
background-color:#222326;
color: #e0e3e7;
font-size: 14px;
box-sizing: border-box;
min-width: 160px;
display: inline-block;
border-radius: 8px;
margin-right: 16px;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.4);
transition: all 0.2s ease-in-out;
}
.zone-input:hover {
border-color: #4a90e2;
}
.zone-input:focus-within {
outline: none;
box-shadow: 0 0 0 1px #4a90e2;
}
.tight-row {
margin-bottom: -2px !important;
padding-bottom: 0px !important;
}
.light .zone-input {
padding: 8px 12px;
border: 1px solid #bfc0d3;
background-color: #edeff2;
color: #e0e3e7;
font-size: 14px;
box-sizing: border-box;
min-width: 160px;
display: inline-block;
border-radius: 8px;
margin-right: 16px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
transition: all 0.2s ease-in-out;
}
.light .zone-input:hover {
border-color: #4a90e2;
}
.light .zone-input:focus-within {
outline: none;
box-shadow: 0 0 0 1px #4a90e2;
}
.basket-pop-up .sip-text-box {
border: 1px solid #505258;
color: #fff;
display: block;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
background-color: #222326 !important;
}
.param-tableIndicator, .param-tableIndicator input, .param-tableIndicator select {
font-size: 14px;
}
.dark .param-tableIndicator td{
color:var(--FONT-COLOR);
}
.dropdown-display {
cursor: pointer;
}
.dropdown-display-text {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
height: 20px;
width: 160px;
padding: 4px 10px;
border: 1px solid #28292e;
border-radius: 4px;
background-color: #25272c;
color: #fff;
background-image: url('images/drop-down-arrow.svg');
background-size: 9px auto;
background-repeat: no-repeat;
background-position: right 3px center;
}
.light .dropdown-display-text {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 6px 10px;
border: 1px solid #ccc;
border-radius: 4px;
background-color: #fff;
color: #000;
}
.dropdown-popup {
background-color: #222;
border: 1px solid #666;
z-index: 1000;
overflow-y: auto;
}
.light .dropdown-popup {
background-color: #fff;
border: 1px solid #ccc;
color: #000;
z-index: 1000;
overflow-y: auto;
}
.dropdown-list {
padding: 4px;
width: 180px;
}
.dropdown-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4px 8px;
color: white;
cursor: pointer;
width: 155px;
}
.light .dropdown-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 4px 8px;
cursor: pointer;
width: 155px;
color: #000;
}
.light .dropdown-item .dropdown-edit-icon{color: #2070d8}
.dark .dropdown-item .dropdown-edit-icon{color: #2070d8}
.light .dropdown-item .dropdown-delete-icon{color: #d55050}
.dark .dropdown-item .dropdown-delete-icon{color: #d97575}
.light .dropdown-item:hover {
background-color: #d9dadb;
}
.dark .dropdown-item:hover {
background-color: #000000;
}
.dropdown-label {
flex-grow: 1;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.dropdown-label-selected {
color: #3498db;
font-weight: bold;
}
.dropdown-delete-icon {
color: #e74c3c;
margin-left: 5px;
cursor: pointer;
}
.light .basket-pop-up .sip-text-box {
border: 1px solid #e0dfdf;
color: black;
display: block;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
background-color: white !important;
}
.dark .basket-pop-up .sip-searchmrkt
{
height: 33px;
border-color:#28292e;
border-width: 1px;
border-style: solid;
}
.light .sip-searchmrkt
{ height: 33px;
border-color:rgb(224, 223, 223);
border-width: 1px;
border-style: solid;
}
.Sip-toggle-button {
padding: 11px 29px;
border: 1px solid #3c3d45;
border-radius: 20px;
background-color: #232427;
color: #8b8888;
font-size: 10px;
cursor: pointer;
margin-right: -11px;
transition: all 0.3s ease;
}
.Sip-toggle-button:hover {
background-color: #e0e0e0;
}
.Sip-toggle-button.sip-selected {
background-color: #232427;
color: #aeb7c3;
border-color: #3c3d45;
box-shadow: 0 0 2px 1px rgba(0, 123, 255, 0.4);
/* font-size: 10px; */
font-weight: bold;
}
.light .Sip-toggle-button.sip-selected {
background-color: #b1b3bd;
color: #68727e;
font-size: 10px;
font-weight: bold;
}
/* .Sip-toggle-button.sip-selected:focus{
} */
.sipradio-container {
display: flex;
gap: 17px;
align-items: center;
margin-bottom: -17px;
margin-top: -10px;
margin-left: 12px;
}
.light .Sip-toggle-button {
padding: 11px 29px;
border: 1px solid #bfc0d3;
border-radius: 20px;
background-color: #dadde5;
color: #8b8888;
font-size: 10px;
cursor: pointer;
margin-right: -11px;
/* transition: all 0.3s ease; */
}
/* .header-row td {
background-color: #1c1d22;
color: #333;
font-weight: bold;
} */
.dark .header-row{
/* border-bottom: 1px solid black; */
border-bottom: 1px solid #555;
font-size: 13px;
background-color: #1c1d22;
font-size: 13px;
font-weight: bold;
}
.light .header-row{
border-bottom:1px solid #6f7277;
font-size: 13px;
font-weight: bold;
/* background-color: #f5f5f5; */
}
.sip-ltp{
font-size: 12px;
padding: 3px 6px;
color: white;
}
.light .sip-ltp{
font-size: 12px;
padding: 3px 6px;
color: #453939;
font-weight: bold;
}
.dropdown-disabled {
pointer-events: none;
opacity: 0.6;
cursor: not-allowed;
}