@charset "utf-8";

@import "components/table.css";
@import "components/blog.css";
@import "components/comments.css";
@import "baseNode/common.css";
@import "components/navbar.css";
@import "components/custom-select.css";
@import "components/cftc.css";
@import "components/gamma.css";
@import "components/landing/common.css";
@import "components/settings/activeTickers.css";
@import "components/watchlists/common.css";
@import "components/scanner/common.css";
@import "components/upgrade-and-payment/upgrade.css";
@import "components/upgrade-and-payment/extratickers.css";
@import "components/ticker-detail-page/common.css";
@import "components/ticker-detail-page/performance-table.css";
@import "components/ticker-detail-page/range-box.css";
@import "components/ticker-detail-page/chart.css";
@import "components/ticker-table/common.css";
@import "components/ticker-table/ticker-add-input.css";

/*----------CSS-START----------*/

:root {
	--text-dark-grey: #42526e;
	--text-grey: #5e6c84;
	--color-primary: #14bdef;
	--color-primary-detail: #5ad1f4;
	--color-dark-blue: #05488b;
	--text-green: #48d6ac;
	--text-yellow: #dba538;
	--text-red: #e95e71;
	--text-white: #ffffff;
	--text-black: #121212;
	--bg-green: #d3f8ec;
	--bg-yellow: #f7ebd4;
	--bg-red: #f9d2d7;
	--color-darkmode-main-bg: #242424;
	--color-darkmode-outer-bg: #121212;
	--color-darkmode-bg: #ffffff10;
	--input-border-color: #dee4ee;
	--size-text: 16px;
}

*,
*::before,
*::after {
	transition: background-color 200ms ease-out, color 150ms ease-out, border-color 150ms ease-out,
		box-shadow 200ms ease-out, opacity 200ms ease-out, transform 200ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
	}
}

body {
	font-family: "Lato", serif !important;
	font-weight: 600;
	font-size: 16px;
}

.landing {
	font-family: "Poppins", sans-serif !important;
}

.table {
	color: var(--text-grey);
}

.foreground {
	z-index: 1;
}

.l-padding-20 {
	padding-left: 20px;
}

@media (min-width: 1400px) {
	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1320px;
	}
}

@media (min-width: 1600px) {
	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1420px;
	}
}

@media (min-width: 1800px) {
	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1480px;
	}
}

small {
	font-family: "Poppins", serif;
	font-size: 13px;
}

.btn-clean {
	padding: 0;
	border: 0;
	background: transparent;
}

input {
	border-radius: 12px;
}

input:focus {
	border: none;
	outline: none;
}

.border-bottom {
	border-bottom: 1px solid #ccc;
}

.text-primary:hover,
.text-primary {
	color: var(--color-primary) !important;
}

.text-green:hover,
.text-green {
	color: var(--text-green) !important;
}

.text-yellow:hover,
.text-yellow {
	color: var(--text-yellow) !important;
}

.text-red:hover,
.text-red {
	color: var(--text-red) !important;
}

.text-white:hover,
.text-white {
	color: var(--text-white) !important;
}

.text-black:hover,
.text-black {
	color: var(--text-black) !important;
}

.bg-green:hover,
.bg-green {
	background: var(--bg-green);
	color: var(--text-green) !important;
}

.bg-yellow:hover,
.bg-yellow {
	background: var(--bg-yellow);
	color: var(--text-yellow) !important;
}

.bg-red:hover,
.bg-red {
	background: var(--bg-red);
	color: var(--text-red) !important;
}

.bg-blue:hover,
.bg-blue {
	background: var(--color-primary);
	color: var(--white) !important;
}

.bg-green-pure:hover,
.bg-green-pure {
	background: var(--bg-green);
}

.bg-yellow-pure:hover,
.bg-yellow-pure {
	background: var(--bg-yellow);
}

.bg-red-pure:hover,
.bg-red-pure {
	background: var(--bg-red);
}

.bg-blue-pure:hover,
.bg-blue-pure {
	background: var(--color-primary);
}

.primary-color {
	color: #14bdef;
}

.bg-primary {
	background: #14bdef;
}

.btn:focus {
	outline: none !important;
	box-shadow: none !important;
}

.btn {
	font-size: var(--size-text);
	font-weight: 500;
	font-stretch: normal;
	font-style: normal;
	border-radius: 8px !important;
	text-align: center;
	padding: 10px 32px;
	letter-spacing: 1px;
}

.btn.btn-sm {
	font-size: 14px;
	border-radius: 10px;
	padding: 8px 18px;
}

.btn-primary:focus {
	color: #fff !important;
	background: #119cc6 !important;
}

.btn-primary-white {
	background: transparent;
	color: #faaf19;
	border: 1px solid #faaf19;
}

.btn-secondary-white {
	background: transparent;
	color: #545afa;
	border: 1px solid #545afa;
}

.btn-three-white {
	background: transparent;
	color: #14bdef;
	border: 1px solid #14bdef;
}

.btn-three-white:hover,
.btn-primary-white:hover {
	color: #14bdef !important;
	background: rgba(20, 189, 239, 0.05);
	border: solid 1px #14bdef;
}

.btn-primary:hover {
	background: #12b1e0;
	border: 1px solid #12b1e0;
}

.btn-primary {
	background: #14bdef;
	color: #fff !important;
	border: 1px solid #14bdef;
}

.btn-primary-red {
	background: var(--text-red);
	color: #fff;
	border: 1px solid var(--text-red);
}

.btn-primary-white {
	background: transparent;
	color: #faaf19;
	border: 1px solid #faaf19;
}

.btn-secondary-white {
	background: transparent;
	color: #545afa;
	border: 1px solid #545afa;
}

.btn-three-white {
	background: transparent;
	color: #14bdef;
	border: 1px solid #14bdef;
	border-radius: 13px;
}

#mainContainer {
	min-height: 100vh;
	position: relative;
}

header {
	padding: 5px;
	border-bottom: 1px solid #f0f0f0;
	background: #fff;
	z-index: 999;
	position: fixed;
	left: 0;
	margin-left: 270px;
	width: calc(100% - 270px);
}

#header__dashboard {
	padding: 10px;
}

.menu-close header {
	width: calc(100% - 75px);
	margin-left: 75px;
}

main {
	width: calc(100% - 270px);
	margin-left: 270px;
}

.logo-section {
	padding: 18px 18px;
	border-bottom: 1px solid #f0f0f0;
}

.logo-section .main-logo {
	height: 32px;
}

.tickertable-header-item {
	cursor: pointer;
}

.sidebar {
	width: 270px;
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	overflow: auto;
	border-right: 1px solid #f2f4ff;
	font-family: "Lato", serif;
	font-style: normal;
	font-size: var(--size-text);
	font-weight: 600;
}

#logo_sidebar {
	max-width: 70%;
}

.sidebar::-webkit-scrollbar {
	width: 0;
}

.sidebar ul.menu-list {
	margin: 0;
	padding: 12px 0;
}

.sidebar ul li {
	list-style: none;
}

.menu-close .sidebar ul li:hover a {
	width: 275px;
	background: #f0f6fc;
	z-index: 9999;
	position: relative;
	-webkit-transition: none;
	transition: none;
}

.menu-close .sidebar ul li .collapse {
	display: none;
}

.menu-close .sidebar ul li:hover .collapse {
	display: block;
	position: absolute;
	left: 27px;
}

.menu-close .sidebar ul li:hover ul li a {
	width: calc(200px);
}

.menu-close .sidebar .menu-nav:hover ul li a .sidebar-text {
	opacity: 0.3;
	color: #293a90;
}

.sidebar ul li.active a .sidebar-text {
	color: #14bdef;
	opacity: 1;
}

.sidebar ul li.active-link a .sidebar-text {
	color: #14bdef;
	opacity: 1;
}

.sidebar ul li a .sidebar-text {
	color: var(--text-grey);
	transition: 0.4s linear;
	font-weight: 600;
	white-space: nowrap;
}

.menu-close .sidebar ul li a {
	text-align: center;
}

.menu-close .sidebar ul li:hover .sidebar-text {
	color: #6b6b6b;
	opacity: 1;
}

.menu-close .sidebar ul li:hover a .sidebar-icon .unactive-icon {
	display: none;
}

.menu-close .sidebar ul li:hover a .sidebar-icon .active-icon {
	display: block;
}

.menu-close .sidebar ul li a .sidebar-text {
	padding-left: 24px;
}

.menu-close .sidebar ul li ul li a .sidebar-text {
	padding-left: 0px;
}

.menu-close .sidebar ul li a .sidebar-text {
	opacity: 0;
	transition: 0.4s linear;
}

/* When collapsed, the icon-only sidebar is too narrow for the "NEW" badges; without this they
   overflow the rail and bleed into the main content area (e.g. over the ticker table). */
.menu-close .sidebar .nav-badge {
	display: none;
}

.sidebar ul li a {
	display: flex;
	line-height: 20px;
	padding: 15px 24px;
	text-decoration: none;
	position: relative;
}

.sidebar ul li a:hover:before {
	opacity: 1;
}

.sidebar ul li a:before {
	content: "";
	position: absolute;
	width: calc(100% - 30px);
	height: 39px;
	background: #eee;
	z-index: -1;
	border-radius: 12px;
	top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
	opacity: 0;
}

.sidebar-icon img {
	width: 24px;
	height: 24px;
	margin-right: 24px;
}

.sidebar .menu-bar-mobile,
.sidebar .menu-bar {
	text-decoration: none;
}

.sidebar .menu-bar i {
	font-size: 12px;
	color: #14bdef;
}

/* Sidebar collapse / expand toggle — the directional arrow lives in the header,
   exactly where the hamburger (three-lines) icon used to sit. The arrow points left
   to collapse the sidebar and flips right (via .menu-close) to expand it. */
.menu-bar-open svg {
	color: #14bdef;
	transition: transform 0.3s ease;
}

.menu-close .menu-bar-open svg {
	transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
	.menu-bar-open svg {
		transition: none;
	}
}

.icon-logo {
	display: none;
}

.menu-close .main-logo {
	display: none;
}

.menu-close .icon-logo {
	display: block;
	width: 32px;
	height: 32px;
	object-fit: contain;
}

.menu-close main {
	width: calc(100% - 75px);
	margin-left: 75px;
}

.menu-close .sidebar .menu-bar {
	display: none !important;
}

.menu-close .sidebar {
	width: 75px;
	overflow: inherit;
	position: fixed;
	z-index: 100;
}

/* The header toggle is always visible on desktop — it both collapses the sidebar
   (when expanded) and expands it (when in .menu-close). On mobile it is hidden in
   favour of the slide-in hamburger (see responsive.css). */
.menu-bar-col {
	display: flex !important;
}

.coll-drop.collapsed:after {
	transform: rotate(90deg);
}

.menu-nav ul li {
	padding-left: 8px;
}

.menu-close .coll-drop:after {
	display: none;
}

.coll-drop:after {
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 11px;
	display: inline-block;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	line-height: 24px;
	color: #293a90;
	opacity: 0.3;
	position: absolute;
	top: 14px;
	right: 25px;
	transform: rotate(-90deg);
}

.active-icon {
	display: none;
}

.menu-list li.active .active-icon {
	display: block;
}

.menu-list li.active .unactive-icon {
	display: none;
}

.main-page {
	padding: 75px 0 0;
	min-height: 100vh;
	overflow: hidden;
	background: #fbfbff;
}

.page-title h2 {
	font-weight: 600;
	color: #623d3d;
	margin-bottom: 24px;
}

.btn-drop {
	font-size: 14px;
	color: #14bdef;
	border: none;
	padding: 11px 16px;
	border-radius: 10px;
	background-color: #f2fcff;
	line-height: 26px;
}

.header-list li {
	display: inline-block;
	padding-left: 30px;
}

.btn-drop span {
	font-weight: 600;
	font-size: var(--size-text);
}

.header-dropdown .dropdown {
	position: static;
}

.header-dropdown .dropdown-menu {
	float: inherit;
	min-width: 450px;
	top: 84px !important;
	background: #fff;
	border: none;
	border-radius: 12px;
	box-shadow: 0 20px 80px 0 rgb(60 96 123 / 10%);
	padding: 18px;
	left: -61px !important;
	transform: none !important;
}

.header-dropdown .dropdown-menu:after {
	top: -20px;
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #ffffff;
	left: 82px;
	margin: auto;
}

.header-list li:nth-child(2) .dropdown-menu:after {
	left: 0;
	right: 0;
	margin: auto;
}

.header-list li:nth-child(3) .dropdown-menu:after {
	left: auto;
	right: 98px;
	margin: auto;
}

.header-dropdown .textarea {
	padding: 10px 15px;
	border-radius: 10px;
	background-color: #f0f6fc;
	text-align: center;
}

.header-dropdown .textarea p {
	opacity: 0.33;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.65px;
	color: #6b6b6b;
	margin-bottom: 6px;
}

.header-dropdown .drop-btn {
	padding: 12px 20px;
	border-radius: 10px;
	border: solid 2px #14bdef;
	background-color: #fff;
	font-size: 15px;
	display: block;
	cursor: pointer;
	text-align: center;
	text-transform: uppercase;
	color: #007bff;
}

.header-dropdown .textarea h5 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0;
	line-height: 1.5;
	color: #6b6b6b;
}

header .profile {
	width: 48px;
	height: 48px;
	border-radius: 15px;
	text-align: center;
	background-color: #f0f6fc;
	line-height: 48px;
	color: rgb(107 107 107 / 33%);
	cursor: pointer;
}

.text-gray {
	font-size: 14px;
	font-weight: 500;
	color: #6b6b6b;
}

.bg-area:hover {
	text-decoration: none;
}

.bg-area {
	padding: 6px 8px;
	border-radius: 8px;
	font-size: var(--size-text);
	font-weight: 500;
	display: block;
	text-align: center;
	width: auto;
	margin: 8px 0;
}

.ticker-cloud-container {
	overflow-x: hidden;
	box-shadow: 0 20px 80px rgba(60, 96, 123, 0.1);
}

.switch {
	height: 24px;
	display: block;
	position: relative;
	cursor: pointer;
}

.switch input {
	display: none;
}

.switch input + span {
	padding-left: 60px;
	min-height: 24px;
	line-height: 24px;
	display: block;
	color: #99a3ba;
	position: relative;
	vertical-align: middle;
	white-space: nowrap;
	transition: color 0.3s ease;
}

.switch input + span:before,
.switch input + span:after {
	content: "";
	display: block;
	position: absolute;
	border-radius: 12px;
}

.switch input + span:before {
	top: 0;
	left: 0;
	width: 44px;
	height: 25px;
	background: #eee;
	transition: all 0.3s ease;
}

.switch input + span:after {
	width: 15px;
	height: 15px;
	background: #14bdef;
	top: 5px;
	left: 5px;
	box-shadow: 0 1px 3px rgba(18, 22, 33, 0.1);
	transition: all 0.45s ease;
}

.switch input + span em {
	width: 8px;
	height: 7px;
	background: #99a3ba;
	position: absolute;
	left: 8px;
	bottom: 7px;
	border-radius: 2px;
	display: block;
	z-index: 1;
	transition: all 0.45s ease;
}

.switch input + span em:before {
	content: "";
	width: 2px;
	height: 2px;
	border-radius: 1px;
	background: #fff;
	position: absolute;
	display: block;
	left: 50%;
	top: 50%;
	margin: -1px 0 0 -1px;
}

.switch input + span em:after {
	content: "";
	display: block;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border: 1px solid #99a3ba;
	border-bottom: 0;
	width: 6px;
	height: 4px;
	left: 1px;
	bottom: 6px;
	position: absolute;
	z-index: 1;
	transform-origin: 0 100%;
	transition: all 0.45s ease;
	transform: rotate(-35deg) translate(0, 1px);
}

.switch input + span strong {
	font-weight: normal;
	position: relative;
	display: block;
	top: 1px;
}

.switch input:checked + span:before {
	background: #14bdef;
}

.switch input + span strong:before,
.switch input + span strong:after {
	color: var(--text-grey);
	font-size: var(--size-text);
	transition: 0.4s linear;
	font-weight: 600;
	display: block;
	-webkit-backface-visibility: hidden;
}

.switch input + span strong {
	padding-left: 10px;
	color: var(--text-grey);
	font-size: var(--size-text);
	transition: 0.4s linear;
	font-weight: 600;
}

.switch input:checked + span strong {
	color: #6b6b6b;
	opacity: 1;
	transition: all 0.3s ease;
}

.switch input:checked + span:after {
	background: #fff;
	transform: translate(20px, 0);
}

.switch input:checked + span em {
	transform: translate(18px, 0);
	background: #5628ee;
}

.switch input:checked + span em:after {
	border-color: #5628ee;
	transform: rotate(0deg) translate(0, 0);
}

.switch input:checked + span strong:before {
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
	transform: translate(-2px, 0);
}

.switch input:checked + span strong:after {
	opacity: 1;
	visibility: visible;
	transform: translate(0, 0);
	transition: all 0.3s ease 0.2s;
}

.bottom-modes ul li {
	list-style: none;
	padding: 10px 0;
}

.bottom-modes ul {
	padding: 0;
	margin: 0;
}

.bottom-modes {
	padding: 24px;
	margin-top: 50px;
}

.menu-close .bottom-modes {
	padding: 24px 15px;
}

.menu-close .switch input + span strong {
	opacity: 0;
}

.custom-dropdown h5 {
	font-size: 18px;
	color: #293a90;
	margin: 0;
	padding: 20px 20px 20px 56px;
	border-bottom: 1px solid rgb(0 0 0 / 10%);
}

.custom-dropdown ul li span:hover {
	text-decoration: none;
	border-radius: 8px;
	background-color: rgba(41, 58, 144, 0.1);
	cursor: pointer;
}

.custom-dropdown ul li span {
	font-size: 14px;
	font-weight: 500;
	display: block;
	text-decoration: none;
	padding: 12px 36px;
	color: #6b6b6b;
}

.custom-dropdown ul li {
	list-style: none;
}

.custom-dropdown ul {
	padding: 10px 20px;
	margin: 0;
}

.custom-dropdown {
	width: calc(100% - 30px);
	max-height: 500px;
	position: absolute;
	background: #fff;
	z-index: 10;
	box-shadow: 0 20px 80px 0 rgb(60 96 123 / 10%);
	background-color: #fff;
	top: 65px;
	border-radius: 15px;
	overflow-y: scroll;
}

.visible {
	visibility: visible;
	opacity: 1;
}

.not-visible {
	visibility: hidden;
	opacity: 0;
}

.serach-list header .custom-dropdown {
	opacity: 1;
}

.held-tickers {
	padding: 15px 18px;
	background: #fff;
	border-radius: 20px;
}

.held-tickers ul {
	/*        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;*/
	flex-wrap: wrap;
	padding: 0;
	margin-bottom: 0;
}

.held-tickers ul li {
	list-style: none;
}

/*.held-tickers ul li{
        -ms-flex: 0 0 24%;
    flex: 0 0 24%;
    list-style: none;
    padding: 0 15px;
    max-width: 24%;
}*/
.modal-content {
	border-radius: 18px;
	padding: 24px;
}

.modal-ticker p {
	font-size: 18px;
	color: #6b6b6b;
}

.modal-ticker h5 {
	font-size: 18px;
	font-weight: 600;
	color: #6b6b6b;
}

.icon-modal {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: #14bdef;
	margin: auto;
	text-align: center;
	line-height: 48px;
	margin-top: -48px;
	margin-bottom: 24px;
}

.footer-content-padding-wrapper {
	padding: 60px 0px;
}

.hide {
	display: none;
}

.custom-select {
	position: relative;
	/* font-family: Arial; */
	padding: 0;
	border: 0;
}

.select-refresh select {
	width: 220px;
}

.select-refresh button {
	position: absolute;
	right: 8px;
	top: 8px;
}

.goto-btn,
.download-btn {
	display: block;
	border-radius: 10px;
	border: solid 1px #eee;
	font-size: var(--size-text);
	color: #000000;
	cursor: pointer;
	user-select: none;
	background: #fff;
	height: 51px;
	width: 51px;
	text-align: center;
	line-height: 46px;
}

.inp-cbx {
	position: absolute;
	z-index: 1;
	opacity: 0;
	width: 22px;
	height: 22px;
	cursor: pointer;
}

.cbx {
	margin: auto;
	-webkit-user-select: none;
	user-select: none;
	cursor: pointer;
}

.cbx a {
	font-family: "Poppins", serif;
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 27px;

	text-decoration-line: underline !important;
	color: #14bdef;
}

.cbx span {
	font-style: normal;
	font-weight: 400;
	font-size: var(--size-text);

	display: inline-block;
	vertical-align: middle;
	transform: translate3d(0, 0, 0);
}

.cbx span:first-child {
	position: relative;
	width: 22px;
	height: 22px;
	transform: scale(1);
	vertical-align: middle;
	border: 1px solid rgba(41, 58, 144, 0.3);
	border-radius: 8px;
	transition: all 0.2s ease;
}

.cbx span:first-child svg {
	position: absolute;
	top: 5px;
	left: 4px;
	fill: none;
	stroke: #14bdef;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 16px;
	stroke-dashoffset: 16px;
	transition: all 0.3s ease;
	transition-delay: 0.1s;
	transform: translate3d(0, 0, 0);
	stroke-dashoffset: 0;
	opacity: 0;
}

.cbx span:first-child:before {
	content: "";
	width: 100%;
	height: 100%;
	background: #506eec;
	display: block;
	transform: scale(0);
	opacity: 1;
	border-radius: 50%;
}

.inp-cbx:disabled + .cbx span:first-child {
	background: #d9d9d9;
}

/*.inp-cbx:checked + .cbx span:first-child {
  background: #506EEC;
  border-color: #506EEC;
  animation: wave 0.4s ease;
}*/
.inp-cbx:checked + .cbx span:first-child svg {
	opacity: 1;
}

.inp-cbx:checked + .cbx span:first-child:before {
	opacity: 0;
	transition: all 0.6s ease;
}

body .tooltip-inner {
	font-size: 14px;
	border-radius: 10px;
	background-color: #fff !important;
	color: #000 !important;
	border: 1px solid #eee !important;
}

body .tooltip .arrow:before,
body .tooltip.bs-tooltip-top .arrow:before {
	display: none;
}

.mouse-pointer {
	cursor: pointer;
}

.disabled-pointer {
	cursor: not-allowed;
}

.ticker-cbx-label {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.micro-badge {
	font-size: 8px !important;
	margin-top: 3px;
}

.popup-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: #0000007d;
}

.popup-overlay-scanner {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: #0000007d;
	top: 0;
	left: 0;
}

.no-border-list li {
	border: 0 !important;
}

.blur-class {
	filter: blur(2px);
	-webkit-filter: blur(2px);
}

.info-tooltip {
	position: absolute;
	top: 15px;
	right: 15px;
}

#mockInfo {
	font-size: 8px;
}

#chart_table_title {
	padding: 0 0 0 35px !important;
	min-width: 350px;
}

#chart_table_inner_table {
	border-bottom: 0 solid !important;
}

.MuiTableCell-root {
	border-bottom: 0 solid !important;
}

.native-dropdown select {
	padding: 5px;
	border-radius: 5px;
	border-color: #ccc;
	width: 100%;
}

.mfr-table-row {
	max-height: 150px !important;
}

._loading_overlay_overlay {
	border-radius: 15px !important;
}

.center {
	text-align: center;
}

.white-box {
	border: solid 1px rgba(107, 107, 107, 0.1);
	background-color: #fff;
	padding: 36px;
	border-radius: 12px;
}

.video-medium-size-container {
	min-height: 600px;
}

.video-box {
	overflow: hidden;
	border-radius: 24px;
}

.video-box:after {
	position: absolute;
	content: "";
	height: 100%;
	width: 100%;
	background-image: linear-gradient(to bottom, rgba(41, 58, 144, 0.05), rgba(41, 58, 144, 0.6));
	top: 0;
	left: 0;
	z-index: 1;
	pointer-events: none;
}

.video-box a img {
	width: 50px;
	position: absolute;
	top: 50%;
	height: 50px;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}

.video-box img {
	width: 100%;
	height: 180px;

	object-fit: cover;
}

.video-title {
	margin-bottom: 36px;
}

.nav-pills .nav-link {
	padding: 12px 24px;
	border-radius: 12px;
	box-shadow: 0 12px 20px 0 rgba(0, 0, 0, 0.1);
	font-size: var(--size-text);
	margin-right: 12px;
	font-weight: 500;
	color: #000;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
	color: #14bdef;
	background-color: rgba(20, 189, 239, 0.1);
}

.faq .card-body {
	padding: 12px 0;
	font-size: 14px;
	color: rgb(0 0 0 / 60%);
	line-height: 24px;
}

.faq .btn-clean {
	font-size: var(--size-text);
	font-weight: 500;
	position: relative;
	display: block;
	width: 100%;
	text-align: left;
}

.faq .collapsed.btn-clean:after {
	content: "\f067";
}

.faq .btn-clean:after {
	content: "\f068";
	font-family: "Font Awesome 5 Free";
	font-weight: 600;
	font-size: var(--size-text);
	display: inline-block;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	line-height: 24px;
	color: rgb(0 0 0);
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	opacity: 0.8;
}

.faq .card:nth-last-child(1) {
	border: none;
}

.faq .card {
	border: none;
	border-bottom: 1px solid rgb(107 107 107 / 20%);
	border-radius: 0;
	padding: 30px 0;
}

.faq .card-header {
	padding: 0;
	background: transparent;
	border: none;
}

.form-grp textarea,
.form-grp select,
.form-grp input {
	width: 100%;
	border-radius: 8px;
	border: solid 1px rgba(0, 0, 0, 0.2);
	padding: 14px 18px;
	font-size: 14px;
}

.form-grp label {
	font-size: var(--size-text);
	font-weight: 500;
	width: 100%;
	margin-bottom: 0.1rem;
}

.form-grp select,
.form-grp {
	margin-bottom: 24px;
}

.form-grp select,
.form-grp input {
	width: 100%;
	border-radius: 8px;
	border: solid 1px rgba(0, 0, 0, 0.2);
	padding: 14px 18px;
	font-size: 14px;
}

.current-plan {
	border-bottom: 2px solid rgb(107 107 107 / 10%);
}

.current-plan-box {
	background: #f3f7fc;
	padding: 24px;
	border-radius: 14px;
}

.current-plan-box .plan-nam {
	font-size: 24px;
	font-weight: 600;
	color: #000;
	margin-bottom: 8px;
}

.current-plan-box .plan-am {
	font-size: var(--size-text);
	font-weight: 400;
	color: rgba(0, 0, 0, 0.4);
}

.current-plan-box .plan-am span {
	font-weight: 600;
	font-size: 20px;
	color: #000;
}

.plan-head {
	margin: 4px 0 14px;
	opacity: 0.4;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 0.8px;
	color: #000;
}

.plan-type {
	font-size: var(--size-text);
	font-weight: 600;
	letter-spacing: 0.8px;
	color: #000;
}

.settings .white-box p {
	opacity: 0.8;
	font-size: var(--size-text);
	color: #000;
}

.settings .select-selected {
	width: 100%;
	border-color: rgba(0, 0, 0, 0.2);
}

.support-msg {
	padding: 24px;
	background: #fff4e5;
	font-size: 14px;
	border-radius: 12px;
	text-align: center;
	color: #6b6b6b;
}

.support-msg .info {
	width: 50px;
	height: 50px;
	background: #ff9800;
	border-radius: 50%;
	line-height: 50px;
	margin: auto;
	margin-top: -44px;
	margin-bottom: 15px;
}

.captilize {
	text-transform: capitalize;
}

.mfr-row {
	padding-bottom: 20px;
}

.mfr-row .input-description,
.mfr-row input,
.mfr-row .form-grp {
	max-width: 500px;
}

#btn-saveUserData {
	float: right;
	max-width: 250px;
}

.purchase-wizard {
	text-align: center;
	justify-content: center;
}

.purchase-wizard .stripe-widget-container {
	margin-top: 30px;
}

.purchase-wizard-text-box {
	padding: 24px;
	font-size: var(--size-text);
	font-weight: 600;
	margin-bottom: 8px;
	display: flex;
	justify-content: space-between;
}

.purchase-wizard-text-box span:first-child {
	color: dimgrey;
}

.purchase-wizard-text-box .undertext {
	font-size: 12px;
	color: dimgrey;
}

.pwChangeBox input,
#btn-updatePW,
#btn-saveUserSettings {
	max-width: 500px;
}

.error-msg ul li {
	text-align: left;
	justify-content: left;
}

.dropdown-icon-active {
	background-color: #007bff;
	-webkit-mask: url(/assets/images/app-icons/down-arrow.svg) no-repeat center;
	mask: url(/assets/images/app-icons/down-arrow.svg) no-repeat center;
}

.empty-table {
	padding: 100px 0;
}

.empty-table h5 {
	font-size: 24px;
	font-weight: bold;
	margin: 24px 0;
}

.empty-table p {
	opacity: 0.6;
	font-size: var(--size-text);
}

.no-border {
	border: none !important;
}

.ticker-util-holder {
	padding: 0px 15px 0px 0px;
}

.custom-modal-style {
	display: block;
	background: #00000057;
	transition: all 0.15s linear;
}

.model-form input {
	border-radius: 12px;
	border: solid 1px #eee;
	padding: 10px 18px;
	font-size: var(--size-text);
	color: #000000;
	user-select: none;
	background: #fff;
	width: 100%;
}

.modal-content {
	border: none;
}

footer {
	background-image: linear-gradient(to bottom, #010101, #303030);
	position: absolute;
	bottom: 0;
	z-index: 2;
	width: 100%;
}

.top-header {
	padding: 32px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-logo img {
	height: 50px;
}

.main-footer {
	padding: 32px 0;
}

.social-media ul li a {
	opacity: 1 !important;
}

.main-footer ul li a,
.main-footer p {
	color: #ffffff;
	opacity: 0.6;
	font-size: var(--size-text);
	font-weight: 300;
	margin: 0;
	text-decoration: none;
}

.main-footer ul {
	padding: 0;
	margin: 0;
}

.main-footer ul li {
	list-style: none;
	display: inline-block;
	margin-left: 20px;
	color: rgba(255, 255, 255, 0.6);
}

.purchase-tokens-table .sub-heading {
	font-size: 12px;
	margin: 2px;
	display: inline;
	font-weight: 400;
}

.purchase-tokens-table thead th:nth-child(2) {
	width: 20%;
}

.purchase-tokens-table thead th:nth-child(3) {
	width: 40%;
}

/* custom MFR UI styling classes */

#ViewSupportTicket_F1-input {
	min-height: 60px;
}

#ViewSupportTicket_F2-input {
	min-height: 175px;
}

.ws-pre-line {
	white-space: pre-line;
}

.inp-cbx-contr {
	position: relative;
}

*[tooltip-text]:hover:after {
	content: attr(tooltip-text);
	display: block;
	border: 1px solid rgba(0, 0, 0, 0.2);
	background: white;
	color: #212529;
	padding: 5px;
	position: absolute;
	z-index: 1000;
	text-align: center;
	border-radius: 5px;
	min-width: 140px;
	font-size: 12px;
	max-width: 210px;
	white-space: pre-line;
}

*[tooltip-text].tooltip-text-up:hover:after {
	bottom: 100%;
}

*[tooltip-text].tooltip-text-left:hover:after,
*[tooltip-text].tooltip-left:hover:after {
	right: 0;
}

/* Special-filter (column-header) tooltip. The ticker tables live inside a
   .table-responsive scroll container whose overflow clips an absolutely
   positioned tooltip: it gets cut off at the container boundary, worst when
   the header sits near the top/bottom edge of a short viewport (see MYF-890).
   position: fixed lifts the tooltip out of that overflow context so it is no
   longer clipped (no transformed ancestor exists to trap the fixed box). */
*[tooltip-text].tooltip-fixed:hover:after {
	position: fixed;
}

/* Trend Icon background styles */
.bearish-background {
	display: inline-flex;
	border-radius: 5px;
	background: #fdeff1;
}

.bullish-background {
	display: inline-flex;
	border-radius: 5px;
	background: #dbfff4;
}

/* Setting Icon URls */
.plus-height-icon img {
	content: url("/assets/images/app-icons/plus-height.svg");
}

.right-arrow-icon img {
	content: url("/assets/images/app-icons/right-arrow.svg");
}

.minus-height-icon img {
	content: url("/assets/images/app-icons/minus-height.svg");
}

.plus-icon img {
	content: url("/assets/images/app-icons/plus.svg");
}

.zero-icon img {
	content: url("/assets/images/app-icons/zero.svg");
}

.minus-icon img {
	content: url("/assets/images/app-icons/minus.svg");
}

.plus-minus-icon img {
	content: url("/assets/images/app-icons/plus-minus.svg");
}

.tick-icon img {
	content: url("/assets/images/tick.svg");
}

.green-c-icon img {
	content: url("/assets/images/app-icons/green-c.svg");
}

.red-c-icon img {
	content: url("/assets/images/app-icons/red-c.svg");
}

.yellow-c-icon img {
	content: url("/assets/images/app-icons/yellow-c.svg");
}

.blue-c-icon img {
	content: url("/assets/images/app-icons/blue-c.svg");
}

.neutral-background {
	display: inline-flex;
	border-radius: 5px;
	background: #fdf3dd;
}

.neutralDanger-background {
	display: inline-flex;
	border-radius: 5px;
	background: #e8f4ff;
}

/* Compact Mode Style */
.compact .table-rounded th {
	padding-top: 12px;
	padding-bottom: 12px;
}

.compact .table-rounded td {
	padding-top: 6px;
	padding-bottom: 6px;
}

.open-popup-text {
	padding-top: 20px;
	margin: auto;
}

h1 {
	font-size: 48px;
}

h2 {
	font-size: 40px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 28px;
	color: var(--text-dark-grey);
}

h5 {
	font-size: 25px;
	color: var(--text-dark-grey);
}

h6 {
	font-size: 21px;
	color: var(--text-dark-grey);
}

.textLineHeight {
	line-height: 1.75;
}

.dropzone-row-container {
	margin: 10px 0px 20px 0px;
}

.dz-outer-container {
	display: flex;
	flex-direction: column;
	font-family: sans-serif;
}

.dropzone-row-container .container aside div {
	background-color: #ffffff;
}

.dropzone-row-container p {
	font-size: 12px;
}

.dropzone-row-container em {
	font-size: 14px;
}

.set-view-btn {
	margin-left: 20px;
}

.exportDataPopupDrop select {
	display: inherit;
	padding: 6px;
	margin: auto;
	margin-bottom: 15px;
}

.payment-feedback-wrapper {
	display: block;
	background-color: #0000006b;
}

.payment-feedback-wrapper .modal-xl {
	max-width: 1070px;
}

.payment-feedback-inner {
	padding: 60px;
}

.payment-feedback-inner img {
	height: 220px;
	margin: auto;
	margin: 16px 0;
}

.payment-feedback-inner p {
	opacity: 0.6;
	font-size: var(--size-text);
}

.payment-feedback-inner h6 {
	opacity: 0.6;
}

.payment-feedback-inner h2 {
	font-weight: 800;
	font-size: 36px;
	line-height: 44px;
}

.volatilitv-main table tbody tr td:nth-child(8),
.volatilitv-main table thead tr:nth-child(2) th:nth-child(8),
.volatilitv-main table thead tr:nth-child(1) th:nth-child(4),
.volatilitv-main table tbody tr td:nth-child(6),
.volatilitv-main table thead tr:nth-child(2) th:nth-child(6),
.volatilitv-main table thead tr:nth-child(1) th:nth-child(3) {
	border-left: 12px solid #fff !important;
}

.volatilitv-main .table tr td:nth-child(7),
.volatilitv-main .table tr td:nth-child(6),
.volatilitv-main .table tr th:nth-child(6),
.volatilitv-main .table tr th:nth-child(7) {
	background: rgb(41 58 144 / 4%);
}

.inline-heading {
	display: inline;
}

input:focus {
	border-color: #17a2b8;
}

.no-padding {
	padding: 0 !important;
}

.no-overflow {
	overflow: hidden;
}

.ticker-detail .volatilitv-main .table tr th,
.ticker-detail .volatilitv-main .table tr td {
	background: rgb(41 58 144 / 4%);
}

.ticker-detail-correlation-table td,
.ticker-detail-correlation-table th {
	padding: 14px 10px !important;
}

.hurst-series-table thead tr,
.ticker-detail-correlation-table thead tr {
	height: 50px;
}

.hurst-series-table tbody tr,
.ticker-detail-correlation-table tbody tr {
	height: 50px;
	border-bottom: 1px;
	border-bottom-color: rgb(0 0 0 / 4%);
	border-bottom-style: solid;
}

.risk-rating li,
.performance-table li {
	border-bottom: 1px;
	border-bottom-color: rgb(0 0 0 / 4%);
	border-bottom-style: solid;
}

.table-box-row {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 15px;
	padding-bottom: 15px;
}

.risk-rating-row {
	padding-bottom: 30px;
	margin-left: 15px;
}

.risk-rating-teaser {
	min-height: 370px;
}

.single-alert-dialog .MuiPaper-root {
	width: 500px; /* Set a constant width for the alert */
}

@media screen and (max-width: 480px) {
	.single-alert-dialog .MuiPaper-root {
		width: 90%; /* Responsive width for smaller screens */
	}
}

.pagination {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	padding: 10px;
	max-width: 1000px;
}

.pagination button {
	background-color: var(--color-primary);
	color: #fff;
	border: none;
	padding: 10px 20px;
	border-radius: 10px;
	cursor: pointer;
	transition: background-color 0.3s;
}

.pagination button:hover {
	background-color: #0069d9;
}

.pagination button:disabled {
	background-color: #6c757d;
	cursor: default;
}

.pagination span {
	font-size: 1.2rem;
	font-weight: bold;
}

/* Login buttons */
#submit_login_form {
	min-height: 65px;
}

/* Register DEMO account */
#regConfirmBtn {
	min-height: 65px;
}

#regAbortBtn {
	min-height: 65px;
	color: var(--color-primary);
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.2);
}

#regAbortBtn:hover {
	min-height: 65px;
	color: var(--color-primary);
	background: #ffffff;
	border: 1px solid rgba(0, 0, 0, 0.2);
}

.plan-popup .modal-content .step-2 .des-text-height {
	min-height: 505px;
}

.plan-popup .modal-content {
	padding: 40px;
	border-radius: 16px;
}

.step-grp h6 {
	font-size: 18px;
	font-weight: 600;
}

.step-grp p {
	font-size: 13px;
	font-weight: 400;
	margin-bottom: 0;
}

.plan-list a.nav-link.active,
.plan-list a.nav-link {
	background: transparent;
}

.plan-list ul li a {
	padding: 0;
}

.plan-inner-pop {
	background: #f3f7fc;
	border: 2px solid var(--input-border-color);
	border-radius: 24px;
	padding: 24px 32px;
}

.active .plan-inner-pop {
	border-color: #14bdef;
}

.plan-inner-pop .plan-name-pop {
	font-weight: 600;
	font-size: var(--size-text);
	line-height: 19px;
	color: #172b4d;
}

.plan-inner-pop .plan-price-pop {
	font-weight: 600;
	font-size: var(--size-text);
	line-height: 19px;
	color: #172b4d;
	margin: 15px 0;
}

.plan-price-vat {
	font-weight: 300;
	font-size: 13px;
	line-height: 19px;
	color: #172b4d;
	margin: 4px 0;
}

.plan-inner-pop p {
	font-weight: 400;
	font-size: 15px;
	line-height: 18px;
	color: #172b4d;
	line-height: 18px;
	margin: 0;
}

.des-text {
	background: #f3f7fc;
	border-radius: 16px;
	height: 100%;
}

.des-text ul li {
	color: var(--text-grey);
	font-weight: 400;
	font-size: 15px;
	list-style: none;
	line-height: 18px;
	padding: 8px 0px 8px 24px;
	position: relative;
}

.des-text ul li:before {
	position: absolute;
	content: "\f058";
	font-family: "Font Awesome 5 Free";
	font-size: var(--size-text);
	color: #5bd1f4;
	font-weight: 700;
	left: 0px;
	top: 8px;
	transition: all 500ms ease;
}

.show-rules {
	color: #14bdef;
	font-weight: 500;
	font-size: var(--size-text);
}

.des-text ul {
	margin: 0;
	padding: 24px;
}

.des-text .title {
	background: #05488b;
	border-radius: 16px 16px 0px 0px;
	font-weight: 400;
	font-size: var(--size-text);
	line-height: 19px;
	text-align: center;
	color: #ffffff;
	padding: 15px 0;
}

.pay-box .pre-title {
	color: #42526e;
	font-weight: 600;
	font-size: var(--size-text);
	line-height: 19px;
	padding: 20px 32px;
	border-bottom: 1px solid var(--input-border-color);
}

.pay-box p span {
	font-weight: 500;
	font-size: var(--size-text);
	line-height: 19px;
	margin-bottom: 8px;
}

.pay-box p {
	color: #42526e;
	font-weight: 400;
	font-size: 15px;
	line-height: 18px;
	padding: 20px 32px;
}

.pay-box .total-head {
	color: #172b4d;
	font-weight: 600;
	font-size: var(--size-text);
	padding: 20px 32px;
	line-height: 19px;
	border-bottom: 1px solid var(--input-border-color);
}

.pay-box .summ {
	color: #42526e;
	font-weight: 700;
	font-size: 21px;
	line-height: 25px;
	border-bottom: 1px solid var(--input-border-color);
	padding: 20px 32px;
}

.week-trial {
	color: #ffffff;
	font-weight: 400;
	font-size: 13px;
	line-height: 19px;
	background: #11bc8a;
	border-radius: 4px;
	padding: 1px 6px;
	margin: 6px;
}

/* END of REGISTER DEMO account section */

/* START OF f_cking ugly special landing page buttons */

#login_btn {
	font-family: "Lato", serif;
	font-style: normal;
	font-weight: 500;
	font-size: var(--size-text);
	line-height: 19px;
	letter-spacing: 1.25px;
	text-transform: capitalize !important;
}

#demo_btn {
	font-family: "Lato", serif;
	font-style: normal;
	font-weight: 500;
	font-size: var(--size-text);
	line-height: 19px;
	letter-spacing: 1.25px;
	text-transform: capitalize !important;

	color: #000000;
}

/* Portfolio section padding - targets the specific div within the 5th section (first portfolio item) */
#mainContainer > div.landing > section:nth-child(5) > div > div {
	padding-top: 50px;
}

/* END OF LANDING PAGE ID SELECTORS */
.language-javascript,
.language-python {
	font-size: 16px;
	font-weight: 600;
	color: var(--text-grey);
}

.faq .nav-item {
	padding-bottom: 10px;
}

.tradingview-promo-image-main {
	max-width: 350px;
	border: 5px black solid;
	border-radius: 5px;
}

.tradingview-promo-image-overview {
	max-width: 850px;
	border: 5px black solid;
	border-radius: 5px;
}

.box-min-height {
	min-height: 500px;
}

#chartingAppUsername,
#chartingAppUsername::placeholder {
	font-size: 16px;
	font-weight: 400;
}

.closeMenu .compact span {
	font-size: 22px !important;
}

/* MCP tab — breadcrumb highlight to guide users to the new feature */
.nav-link.mcp-tab-highlight {
	position: relative;
	animation: mcpTabPulse 2.4s ease-in-out infinite;
}

.nav-link.mcp-tab-highlight.active {
	animation: none;
}

.nav-link.mcp-tab-highlight .mcp-tab-badge {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 8px;
	border-radius: 10px;
	background-color: #fbc02d;
	color: #1a1a1a;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	vertical-align: middle;
	line-height: 1.2;
	box-shadow: 0 0 0 0 rgba(251, 192, 45, 0.7);
	animation: mcpBadgePulse 2.4s ease-in-out infinite;
}

@keyframes mcpTabPulse {
	0%,
	100% {
		box-shadow: 0 0 0 0 rgba(251, 192, 45, 0);
	}
	50% {
		box-shadow: 0 0 0 4px rgba(251, 192, 45, 0.18);
	}
}

@keyframes mcpBadgePulse {
	0%,
	100% {
		box-shadow: 0 0 0 0 rgba(251, 192, 45, 0.55);
	}
	50% {
		box-shadow: 0 0 0 6px rgba(251, 192, 45, 0);
	}
}