/* CSS dark mode overrides */

:root {
    /*  Colors  */
    /*--color-primary-light: #BCCBFF;*/
    --color-primary-light1: #374164; /* Primary/primary-200 */
    --color-primary-300: #6280EB47; /* Primary/primary-300 */
    --color-primary-400: #9CAFF2; /* Primary/primary-400 */
    --color-primary: #9CAFF2; /* Primary/primary-500 */
    --color-primary-mod: #5671CF;
    /*--color-primary-mod-contrast: #FFFFFF;*/
    /*--color-primary1: #3C4AC8;*/
    /*--color-primary-700: #4A60B0;*/

    /*--color-secondary-gradient: #62EBCD;*/
    /*--color-status-02: #62EBE1; !* Status/status-02 *!*/
    /*--color-status-03: #68D6CE; !* Status/status-03 *!*/

    --color-white: #222222;
    --color-white-mod: #FFFFFFFA;
    /*--color-white0: #FFFFFF14;*/
    /*--color-white1: #FBFBFD;*/
    --color-white2: #3A3A3A;


    --color-grey1: #000000;
    --color-grey2: #3A3A3A; /* Neutral/neutral-01 */
    --color-grey3: #5E5E5E; /* Border/border-light */ /* Neutral/neutral-200 */
    --color-neutral-300: #717171;
    /*--color-grey4: #0000001A;*/
    /*--color-grey5: #B0B0B0; !* Neutral/light/neutral-600 *!*/
    /*--color-grey6: #22222261;*/
    --color-grey7: #FFFFFF99;
    --color-grey8-mod: #FFFFFF99;
    /*--color-grey8: #5E5E5E;*/
    --color-grey9: #FFFFFFD9; /* Text/Black/black-text-02 */

    --color-grey-light: #FFFFFF99; /* Text/Black/black-text-03 */
    /*--color-grey-lighter: #D3D3D3; !* Neutral/neutral-400 *!*/

    --color-black: #FFFFFFFA;
    --color-black-mod: #FFFFFFFA;
    --color-black2: #FFFFFFFA;
    --color-neutral-09: #F7F7F7; /* Neutral/neutral-09 */ /* Neutral/neutral-900 */

    /*!*  Mobile colors  *!*/
    --color-mobile_primary: #5671CF; /* Primary/primary-600 */
    /*--color-mobile-grey: #FFFFFF33;*/

    /*--color-mobile-card: #22222212;*/

    --color-border-strong: #717171;

    /*!*  Filters  *!*/
    --filter-primary: invert(67%) sepia(39%) saturate(552%) hue-rotate(193deg) brightness(98%) contrast(93%);
    --filter-primary-500: invert(45%) sepia(79%) saturate(411%) hue-rotate(189deg) brightness(96%) contrast(99%);

    /*--filter-white: invert(100%) sepia(1%) saturate(7496%) hue-rotate(153deg) brightness(102%) contrast(101%);*/

    /*--filter-grey1: invert(49%) sepia(0%) saturate(1724%) hue-rotate(194deg) brightness(87%) contrast(78%);*/
    /*--filter-grey5: invert(75%) sepia(0%) saturate(99%) hue-rotate(155deg) brightness(99%) contrast(80%);*/
    --filter-grey7: invert(100%) sepia(0%) saturate(199%) hue-rotate(156deg) brightness(88%) contrast(96%);
    --filter-grey8: invert(38%) sepia(0%) saturate(0%) hue-rotate(2deg) brightness(93%) contrast(90%);
    --filter-grey8-mod: invert(75%) sepia(0%) saturate(99%) hue-rotate(155deg) brightness(99%) contrast(80%);
    --filter-grey9: invert(100%) sepia(9%) saturate(7366%) hue-rotate(184deg) brightness(131%) contrast(73%);

    --filter-grey-717171: invert(100%) sepia(0%) saturate(2134%) hue-rotate(319deg) brightness(106%) contrast(73%); /* neutral-07 */

    --filter-grey-lighter: invert(93%) sepia(0%) saturate(0%) hue-rotate(215deg) brightness(82%) contrast(71%);

    --filter-black: invert(100%) sepia(0%) saturate(7500%) hue-rotate(325deg) brightness(113%) contrast(116%);

    --filter-neutral-300: invert(48%) sepia(0%) saturate(87%) hue-rotate(134deg) brightness(92%) contrast(103%);
    --filter-neutral-400: invert(92%) sepia(1%) saturate(0%) hue-rotate(182deg) brightness(77%) contrast(91%);
    --filter-neutral-09: invert(99%) sepia(0%) saturate(81%) hue-rotate(64deg) brightness(114%) contrast(94%);

    /*!*  Mobile filters  *!*/
    /*--filter-mobile-primary: invert(43%) sepia(47%) saturate(674%) hue-rotate(189deg) brightness(94%) contrast(96%);*/
    --filter-primary-400: invert(70%) sepia(16%) saturate(885%) hue-rotate(190deg) brightness(96%) contrast(97%);
    /*--filter-primary-700: invert(39%) sepia(69%) saturate(556%) hue-rotate(190deg) brightness(80%) contrast(86%);*/
}

a {
    color: var(--color-primary-400) !important;
}

[src*="/static/images/svg/logos/logo_brand_only_black.svg"] {
    filter: invert(52%) sepia(21%) saturate(5603%) hue-rotate(207deg) brightness(96%) contrast(92%) !important;
}

.btn {
    opacity: 1;
}

.btn:hover {
    opacity: 0.8;
    background: var(--color-grey2);
    color: #FFFFFF;
}

.btn.active:hover {
    background: var(--color-primary-300);
    color: var(--color-primary);
}


[id^=left-section-tab][data-bs-toggle="tooltip"] {
    opacity: 0.6;
}

.markets-modal-search-pill {
    color: var(--color-grey9);
    background: var(--color-grey2);
}

.markets-modal-search-pill.selected {
    color: #FFFFFF;
    background: var(--color-mobile_primary);
}

#signals-section-pills > button.active {
    color: var(--color-black);
    background: var(--color-neutral-300);
}

div.signal-parity-button > p {
    color: var(--color-grey7) !important;
}


.parity-trash {
    background: var(--color-grey3);
}


.signals-parities-group > button > div > span:nth-child(even) {
    color: var(--color-grey7) !important;
}


.modal-menu-install-content-device-tab > p.active {
    color: var(--color-primary-400);
}

#modal-menu-install-content-device-contents > div > div > img:nth-child(1) {
    filter: invert(49%) sepia(53%) saturate(613%) hue-rotate(190deg) brightness(93%) contrast(98%) !important;
}


#currency-pair-price {
    color: var(--color-grey7) !important;
}


div:has(#currency-pair-price) > [data-bs-toggle="tooltip"] {
    filter: var(--filter-grey-lighter) !important;
}


.tooltip-inner {
    background: var(--color-grey3);
    color: #FFFFFF;
}

.tooltip {
    /*--bs-tooltip-bg: var(--color-black);*/
    --bs-tooltip-bg: var(--color-grey3);
}


/* Mobile */
.menu-tab.selected > img {
    filter: var(--filter-primary-400) !important;
}

.menu-tab.selected > h2 {
    color: var(--color-primary-400) !important;
}


div:has(.btn.markets-parity-card) > h3 {
    color: var(--color-grey7) !important;
}

.markets-parity-card {
    background: var(--color-grey2) !important;
}

.markets-parity-card-title {
    color: var(--color-black);
}

.markets-parity-card-subtitle {
    color: var(--color-grey7) !important;
}

.markets-parity-card-price {
    color: var(--color-black);
}

.markets-parity-card-signals-text {
    color: var(--color-grey7) !important;
}


#modal-search-parities-search-bar-close-button > img {
    filter: var(--filter-neutral-09);
}

#markets-modal-search-bar {
    color: var(--color-black) !important;
}

#markets-modal-search-bar::placeholder {
    color: var(--color-grey7) !important;
}

.markets-modal-search-pill.selected {
    opacity: 1;
}

#markets-modal-search-parity-top-border {
    border-color: var(--color-grey3) !important;
}

.modal-parity-card {
    background: var(--color-grey2) !important;
}

.modal-parity-card-title {
    color: var(--color-black) !important;
}

.modal-parity-card-subtitle {
    color: var(--color-grey7) !important;
}

.modal-parity-card-favorite, #graph-header-favorite {
    filter: var(--filter-neutral-300) !important;
}

.modal-parity-card-favorite.active, #graph-header-favorite.active {
    filter: var(--filter-primary-500) !important;
}

.signals-pill.selected {
    opacity: 1;
    color: var(--color-black);
    background: var(--color-mobile_primary);
}


#signals-content-card {
    color: #FFFFFF !important;
    background: var(--color-mobile_primary) !important;
}

#signals-content-card > p {
    color: #FFFFFF !important;
}

.signals-parity-card {
    background: var(--color-grey2) !important;
}

.signals-parity-card > p {
    color: var(--color-grey7) !important;
}

.signals-parity-card > div > div {
    color: var(--color-black);
}

.signals-parity-card > div > div > p:last-child {
    color: var(--color-grey7) !important;
}


#graph-header-title {
    color: var(--color-grey7) !important;
}

#graph-header-favorite {
    filter: var(--filter-neutral-400) !important;
}

#parity-infos > p:last-child {
    color: var(--color-grey7) !important;
}

#graph-warning-offcanvas, #graph-more-offcanvas {
    color: var(--color-black);
    background: var(--color-white);
    border: 1px solid var(--color-grey3);
}

#graph-warning-offcanvas > button {
    color: var(--color-black) !important;
    background: var(--color-mobile_primary) !important;
}

.graph-modal-more-item > div > p {
    color: var(--color-grey7) !important;
}


.vr {
    color: #FFFFFF !important;
}

.journal-pill {
    color: var(--color-black);
}

.journal-pill.selected {
    opacity: 1;
    color: #FFFFFF;
    background: var(--color-mobile_primary) !important;
}

#journal-medium-card {
    background: var(--color-mobile_primary) !important;
}

#journal-medium-card > p {
    color: #FFFFFF !important;
}

#journal-medium-card > button {
    background: var(--color-grey7) !important;
}

.journal-for-you-content-card {
    background: var(--color-grey2) !important;
}

.journal-for-you-content-card > div > p.font-app-mobile-body-medium {
    color: var(--color-grey7) !important;
}

.journal-followed-card > p:last-child {
    color: var(--color-grey7) !important;
}


.menu-medium-gradient-card {
    background: var(--color-mobile_primary) !important;
}

.menu-medium-gradient-card > p {
    color: #FFFFFF !important;
}

.menu-medium-gradient-card > button {
    background: #FFFFFF !important;
}

.menu-modal-language-item > div > p:last-child {
    color: var(--color-grey7) !important;
}

.menu-parameters-theme-item > img:last-child {
    filter: var(--filter-neutral-09) !important;
}

.menu-parameters-theme-item.active > img:last-child {
    filter: brightness(150%) !important;
}


.analysis-section-analysis-card-item {
    background: var(--color-grey2);
}


/* overrides */

.font-app-desktop-title-caption {
    color: var(--color-grey-light);
}


/* Modal payments */
.form-floating > input:focus + label {
    color: var(--color-black) !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
    -webkit-background-clip: text;
    -webkit-text-fill-color: #ffffff;
    transition: background-color 5000s ease-in-out 0s;
    box-shadow: inset 0 0 60px 20px #7CD1DD;
}
