@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

:root {
    --Background: #f8f9fc;
    --MainButtonBG: #00fab9;
    --MainButtonColor: black;
    --MainButtonBGHover: #00dca0;
    --MainButtonColorHover: black;

    --SecondaryButtonBG: white;
    --SecondaryButtonBGHover: #2c9faf;
    --SecondaryButtonColor: #36b9cc;
    --SecondaryButtonColorHover: black;

    --DangerButtonBG: #ff6347;
    --DangerButtonBGHover: FireBrick;
    --DangerButtonColorHover: black;

    --NavLinkColor: #4e73df;
    --NavLinkColorHover: #2e59d9;

    --SidebarBackground: black;

    --UserSidebarBG: rgb(78, 115, 223);
    --AdminSiderbarBG: #0d0d0d;

    /* Teal button background & border */
    --PrintGreen: #36b9cc;
    /* Teal button hover background & border */
    --ScreenGreen: #2a96a5;
    /* Topbar, loading screen backgrounds */
    --White: #ffffff;
    /* Fallback app & login-container background, sidebar toggle button */
    --Grey1: rgba(255, 255, 255, 0.1);
    --Grey2: #e5e5e5;
    /* Hover background for sidebar toggle button */
    --Grey3: rgba(255, 255, 255, 0.2);
    --Black: #000000;
    /* Link dropdown, Login, page header (forms-header), content-pane font colors  */
    --UniversalGrey: #858796;
    /* Sidebar background and font color */
    --Sidebar-background: black;
    --Sidebar-color: white;
    /* Portal Sidebar background and font color */
    --PortalSidebar-background: #4e73df;
    --PortalSidebar-color: white;

    --TradeScreenInputFont-color: #f8f9fc;
    --DarkModePortal-background: #121212;
}

.logo {
    padding: 0 !important;
}

.app,
.field-description-react-quill .ql-editor {
    font-family: "Roboto" !important;
}

#home-icon svg {
    color: transparent !important;
    mask: url("/clients/GIGA/icons/Home.svg") no-repeat center;
    mask-size: 24px 24px;
    background-color: white;
}

#invest-icon svg {
    color: transparent !important;
    mask: url("/clients/GIGA/icons/Invest.svg") no-repeat center;
    mask-size: 24px 24px;
    background-color: white;
}

#portfolio-icon svg {
    color: transparent !important;
    mask: url("/clients/GIGA/icons/Portfolio.svg") no-repeat center;
    mask-size: 24px 24px;
    background-color: white;
}

#trade-icon svg {
    color: transparent !important;
    mask: url("/clients/GIGA/icons/Trade.svg") no-repeat center;
    mask-size: 24px 24px;
    background-color: white;
}

#wallets-icon svg {
    color: transparent !important;
    mask: url("/clients/GIGA/icons/Wallets.svg") no-repeat center;
    mask-size: 24px 24px;
    background-color: white;
}

.confirmation-container,
.portfolio-screen > div {
    border-radius: 12px;
}

.portfolio-positions-cards .card {
    height: 120px !important;
}

.mini-modal-expanded .btn[disabled] {
    background-color: var(--TradeScreenInputBackground-color) !important;
    border-color: var(--TradeScreenInputBackground-color) !important;
    color: var(--Grey3) !important;
}