.go-mixin-label { font-size: 12px; font-weight: 700; text-transform: uppercase; } @-webkit-keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes preload { 0% { background-position: 125% 0%; } 50% { background-position: -25% 0%; } 100% { background-position: -25% 0%; } } @keyframes bounce { 0% { margin-right: 0; } 50% { margin-right: 2.5px; } 100% { margin-right: 0; } } @keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; } } .go-mixin-item-separator { content: "•"; padding: 0 2.5px 0 5px; } .go-mixin-align-hcenter { left: 50%; position: absolute; transform: translateX(-50%); } .go-mixin-align-vcenter { top: 50%; position: absolute; transform: translateY(-50%); } .go-mixin-card-embossed-font { text-shadow: 1px 1px hsl(204, 25%, 8%); } .go-mixin-preload-gradient-anim { animation: preload 2s infinite linear; background-color: hsl(204, 22%, 95%); background-image: linear-gradient(90deg, hsl(204, 22%, 95%) 0%, hsl(204, 22%, 95%) 40%, hsl(198, 20%, 83%) 50%, hsl(204, 22%, 95%) 60%, hsl(204, 22%, 95%) 100%); } .go-mixin-text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -ms-text-overflow: ellipsis; } .optional { position: relative; } .optional::before { content: "(optional)"; position: absolute; top: 10px; right: 0; color: hsl(198, 20%, 59%); } .info-message-container { left: 50%; transform: translateX(-50%) translateY(-50%); top: 50%; position: absolute; color: hsl(199, 20%, 31%); text-align: center; } .info-message-container > span { font-size: 24px; line-height: 30px; } html, body { background-color: #F3F3F3 !important; } .side-menu-header { cursor: pointer; } .side-menu-header .animateLeft { transform: rotate(180deg); transition: transform 0.3s ease-in-out; } .side-menu-header .animateRight { transform: rotate(0deg); transition: transform 0.3s ease-in-out; } .side-menu-header .outline-1:focus { outline: 2px solid #538cc6; outline-offset: 2px; } @media screen and (max-width: 768px) { .side-menu-header { padding: 16px 24px 0px; } } .side-menu-typography { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "kern" 1; font-kerning: normal; } .side-menu-nav-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; color: #ffffff !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-title-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.285em !important; color: #ffffff !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-avatar-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.333em !important; color: #333333 !important; text-align: center; letter-spacing: normal; text-transform: none; } .side-menu-footer-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; color: #ffffff !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-footer-secondary-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.333em !important; color: #767676 !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-badge-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.5 !important; color: #ffffff !important; text-align: center; letter-spacing: normal; text-transform: none; } .side-menu-typography, .side-menu-nav-text, .side-menu-title-text, .side-menu-avatar-text, .side-menu-footer-text, .side-menu-footer-secondary-text, .side-menu-badge-text { text-rendering: optimizeLegibility !important; font-feature-settings: "kern" 1 !important; font-kerning: normal !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; font-variant-ligatures: normal !important; font-variant-numeric: normal !important; } @supports (font-display: swap) { .side-menu-typography, .side-menu-nav-text, .side-menu-title-text, .side-menu-avatar-text, .side-menu-footer-text, .side-menu-footer-secondary-text, .side-menu-badge-text { font-display: swap; } } @media screen and (max-width: 768px) { .side-menu-nav-text, .side-menu-title-text, .side-menu-footer-text { font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; } .side-menu-title-text { font-weight: 500 !important; line-height: 1.285em !important; } .side-menu-avatar-text, .side-menu-footer-secondary-text { font-size: 12px !important; font-weight: 400 !important; line-height: 1.333em !important; } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .side-menu-typography, .side-menu-nav-text, .side-menu-title-text, .side-menu-avatar-text, .side-menu-footer-text, .side-menu-footer-secondary-text, .side-menu-badge-text { -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } } .go-mixin-label { font-size: 12px; font-weight: 700; text-transform: uppercase; } @-webkit-keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes preload { 0% { background-position: 125% 0%; } 50% { background-position: -25% 0%; } 100% { background-position: -25% 0%; } } @keyframes bounce { 0% { margin-right: 0; } 50% { margin-right: 2.5px; } 100% { margin-right: 0; } } @keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; } } .go-mixin-item-separator { content: "•"; padding: 0 2.5px 0 5px; } .go-mixin-align-hcenter { left: 50%; position: absolute; transform: translateX(-50%); } .go-mixin-align-vcenter { top: 50%; position: absolute; transform: translateY(-50%); } .go-mixin-card-embossed-font { text-shadow: 1px 1px hsl(204, 25%, 8%); } .go-mixin-preload-gradient-anim { animation: preload 2s infinite linear; background-color: hsl(204, 22%, 95%); background-image: linear-gradient(90deg, hsl(204, 22%, 95%) 0%, hsl(204, 22%, 95%) 40%, hsl(198, 20%, 83%) 50%, hsl(204, 22%, 95%) 60%, hsl(204, 22%, 95%) 100%); } .go-mixin-text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -ms-text-overflow: ellipsis; } .optional { position: relative; } .optional::before { content: "(optional)"; position: absolute; top: 10px; right: 0; color: hsl(198, 20%, 59%); } .info-message-container { left: 50%; transform: translateX(-50%) translateY(-50%); top: 50%; position: absolute; color: hsl(199, 20%, 31%); text-align: center; } .info-message-container > span { font-size: 24px; line-height: 30px; } html, body { background-color: #F3F3F3 !important; } #go-app #go-app-container .sidebar .ts-menu > li > a:hover:before { bottom: 0; content: ""; left: 0; position: absolute; right: 0; right: auto; top: 0; width: 5px; background-color: hsl(325, 98%, 33%); } #go-app #go-app-container request-info .request-status:hover.created:before, #go-app #go-app-container [request-info] .request-status:hover.created:before { background-color: hsl(200, 21%, 92%); } #go-app #go-app-container request-info .request-status:hover.approved:before, #go-app #go-app-container [request-info] .request-status:hover.approved:before { background-color: hsl(99, 85%, 42%); } #go-app #go-app-container request-info .request-status:hover.pending:before, #go-app #go-app-container [request-info] .request-status:hover.pending:before { background-color: #ff9100; } #go-app #go-app-container request-info .request-status:hover.declined:before, #go-app #go-app-container [request-info] .request-status:hover.declined:before, #go-app #go-app-container request-info .request-status:hover.error:before, #go-app #go-app-container [request-info] .request-status:hover.error:before { background-color: hsl(0, 100%, 37%); } #go-app #go-app-container #main-sideMenu.hasSidemenuOpen + .content-right conversation .add-message { left: 360px; transition: 0.25s; } #go-app #go-app-container #main-sideMenu.side-menu-open + .content-right conversation .add-message { left: 360px; transition: 0.25s; } #go-app #go-app-container #main-sideMenu.hasDoubleSidemenuCollapsed + .content-right conversation .add-message { left: 60px; } #go-app #go-app-container #main-sideMenu.side-menu-collapsed + .content-right conversation .add-message { left: 60px; } #go-app #go-app-container #main-sideMenu.side-menu-collapsed [ts-variant="sideMenuItemSpan"] { opacity: 0; transition: opacity 0.3s; } #go-app #go-app-container #main-sideMenu.collapsedAndOpenChild + .content-right conversation .add-message { left: 360px; } #go-app #go-app-container #main-sideMenu.side-menu-collapsed:has(.open) + .content-right conversation .add-message { left: 360px; } #go-app #go-app-container .mb10 { margin-bottom: 10px; } #main-sideMenu { --sideMenuWidth: 342px; --sideMenuTransition: min-width 0.3s ease-in-out, max-width 0.3s ease-in-out; overflow: hidden; background-color: #3e505d !important; position: fixed; top: 0; left: 0; width: var(--sideMenuWidth); max-width: var(--sideMenuWidth); min-width: var(--sideMenuWidth); transition: var(--sideMenuTransition); display: flex; flex-direction: column; z-index: 1000; height: 100vh; max-height: 100vh; } @media screen and (max-width: 768px) { #main-sideMenu { --sideMenuWidth: 100vw; --sideMenuTransition: none; } } #main-sideMenu > * { background-color: inherit; } #main-sideMenu .side-menu-panel { flex: 1; position: relative; background-color: #3e505d !important; overflow-y: auto; overflow-x: hidden; min-height: 0; scrollbar-width: thin; scrollbar-color: #767676 transparent; scroll-behavior: smooth; word-wrap: break-word; word-break: break-word; } #main-sideMenu .side-menu-panel::-webkit-scrollbar { width: 6px; } #main-sideMenu .side-menu-panel::-webkit-scrollbar-track { background: transparent; } #main-sideMenu .side-menu-panel::-webkit-scrollbar-thumb { background-color: #767676; border-radius: 3px; } #main-sideMenu .side-menu-panel::-webkit-scrollbar-thumb:hover { background-color: #999999; } #main-sideMenu .side-menu-panel > ul, #main-sideMenu .side-menu-panel > div, #main-sideMenu .side-menu-panel [role="menu"], #main-sideMenu .side-menu-panel [role="menuitem"] { background-color: inherit; } #main-sideMenu .side-menu-panel svg { color: #ffffff !important; } #main-sideMenu .side-menu-panel svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel svg circle:not([fill="none"]), #main-sideMenu .side-menu-panel svg rect:not([fill="none"]):not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel svg polygon:not([fill="none"]), #main-sideMenu .side-menu-panel svg polyline:not([fill="none"]), #main-sideMenu .side-menu-panel svg line:not([fill="none"]), #main-sideMenu .side-menu-panel svg ellipse:not([fill="none"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel svg [style*="fill:#333"], #main-sideMenu .side-menu-panel svg [style*="fill: #333"], #main-sideMenu .side-menu-panel svg [style*="fill:#000"], #main-sideMenu .side-menu-panel svg [style*="fill: #000"], #main-sideMenu .side-menu-panel svg [style*="fill:black"], #main-sideMenu .side-menu-panel svg [style*="fill: black"] { fill: #ffffff !important; } #main-sideMenu .side-menu-panel svg [style*="fill:none"], #main-sideMenu .side-menu-panel svg [style*="fill: none"], #main-sideMenu .side-menu-panel svg [fill="none"] { fill: none !important; } #main-sideMenu .side-menu-panel .MuiSvgIcon-root, #main-sideMenu .side-menu-panel .icon-wrapper, #main-sideMenu .side-menu-panel [class*="Icon"] { color: #ffffff !important; } #main-sideMenu .side-menu-panel .active-option svg, #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg, #main-sideMenu .side-menu-panel [aria-selected="true"] svg, #main-sideMenu .side-menu-panel [aria-current="page"] svg { color: #ffffff !important; } #main-sideMenu .side-menu-panel .active-option svg path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel .active-option svg circle:not([fill="none"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg circle:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg circle:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg circle:not([fill="none"]), #main-sideMenu .side-menu-panel .active-option svg rect:not([fill="none"]):not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg rect:not([fill="none"]):not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg rect:not([fill="none"]):not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg rect:not([fill="none"]):not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .active-option svg polygon:not([fill="none"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg polygon:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg polygon:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg polygon:not([fill="none"]), #main-sideMenu .side-menu-panel .active-option svg polyline:not([fill="none"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg polyline:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg polyline:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg polyline:not([fill="none"]), #main-sideMenu .side-menu-panel .active-option svg line:not([fill="none"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg line:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg line:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg line:not([fill="none"]), #main-sideMenu .side-menu-panel .active-option svg ellipse:not([fill="none"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg ellipse:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-selected="true"] svg ellipse:not([fill="none"]), #main-sideMenu .side-menu-panel [aria-current="page"] svg ellipse:not([fill="none"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#333"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:#333"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:#333"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #333"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: #333"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: #333"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#000"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:#000"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:#000"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #000"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: #000"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: #000"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill:black"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:black"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:black"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:black"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: black"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: black"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: black"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: black"] { fill: #ffffff !important; } #main-sideMenu .side-menu-panel .active-option svg [style*="fill:none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:none"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:none"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:none"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: none"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: none"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: none"], #main-sideMenu .side-menu-panel .active-option svg [fill="none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [fill="none"], #main-sideMenu .side-menu-panel [aria-selected="true"] svg [fill="none"], #main-sideMenu .side-menu-panel [aria-current="page"] svg [fill="none"] { fill: none !important; } #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root, #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root, #main-sideMenu .side-menu-panel [aria-selected="true"] .MuiSvgIcon-root, #main-sideMenu .side-menu-panel [aria-current="page"] .MuiSvgIcon-root, #main-sideMenu .side-menu-panel .active-option .icon-wrapper, #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper, #main-sideMenu .side-menu-panel [aria-selected="true"] .icon-wrapper, #main-sideMenu .side-menu-panel [aria-current="page"] .icon-wrapper, #main-sideMenu .side-menu-panel .active-option [class*="Icon"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"], #main-sideMenu .side-menu-panel [aria-selected="true"] [class*="Icon"], #main-sideMenu .side-menu-panel [aria-current="page"] [class*="Icon"] { color: #ffffff !important; } #main-sideMenu .side-menu-panel .MuiPaper-root { background-color: #3e505d !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] { background-color: #3e505d !important; padding: 0; margin: 0; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root { height: 44px !important; min-height: 44px !important; max-height: 44px !important; padding: 0 !important; background-color: transparent !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option { background-color: #1d262c !important; border-left: 3px solid #db0011 !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg { color: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill:#333"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill: #333"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill:#000"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill: #000"] { fill: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root:hover { background-color: rgba(255, 255, 255, 0.05) !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root:focus { outline: 2px solid #ffffff; outline-offset: 2px; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root { padding: 12px 20px !important; gap: 15px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; color: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root svg, #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root img, #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root .icon-wrapper { width: 18px !important; height: 18px !important; min-width: 18px !important; min-height: 18px !important; max-width: 18px !important; max-height: 18px !important; flex-shrink: 0; color: #ffffff !important; fill: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root svg *, #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root img *, #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root .icon-wrapper * { color: #ffffff !important; fill: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item { height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; background-color: transparent !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg { color: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg circle:not([fill="none"]), #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg rect:not([fill="none"]):not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg polygon:not([fill="none"]), #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg polyline:not([fill="none"]), #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg line:not([fill="none"]), #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg ellipse:not([fill="none"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:#333"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: #333"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:#000"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: #000"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:black"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: black"] { fill: #ffffff !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:none"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: none"], #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [fill="none"] { fill: none !important; } #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item .MuiSvgIcon-root, #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item .icon-wrapper, #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item [class*="Icon"] { color: #ffffff !important; } #main-sideMenu .side-menu-panel .side-menu-panel-option a i { transition: left 0.3s ease-out; flex-shrink: 0; } #main-sideMenu .side-menu-panel .side-menu-panel-option a span { transition: opacity 0.2s ease-out 0.1s; } #main-sideMenu .side-menu-panel .side-menu-panel-option .request-status.pending i { color: orange; top: 40px; } #main-sideMenu .side-menu-panel .side-menu-panel-option .secondary { font-weight: 300; font-size: 12px; } #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg, #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg, #main-sideMenu .side-menu-panel .active-option svg, #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root, #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root, #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root, #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper, #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper, #main-sideMenu .side-menu-panel .active-option .icon-wrapper, #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] { color: #ffffff !important; } #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .active-option svg path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .active-option .icon-wrapper path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] path:not([data-name="Bounding box"]), #main-sideMenu .side-menu-panel .active-option [class*="Icon"] path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill:#333"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill:#333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill:#333"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill:#333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill:#333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill:#333"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill:#333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill:#333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill:#333"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill:#333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill: #333"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill: #333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill: #333"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill: #333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill: #333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill: #333"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill: #333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill: #333"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill: #333"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill: #333"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill:#000"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill:#000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill:#000"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill:#000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill:#000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill:#000"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill:#000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill:#000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill:#000"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill:#000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill: #000"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill: #000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill: #000"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill: #000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill: #000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill: #000"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill: #000"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill: #000"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill: #000"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill: #000"] { fill: #ffffff !important; } #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill:none"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill:none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill:none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill:none"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill:none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill:none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill:none"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill:none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill:none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill:none"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill:none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill: none"], #main-sideMenu .side-menu-panel .active-option svg [style*="fill: none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill: none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill: none"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill: none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill: none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill: none"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill: none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill: none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill: none"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill: none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [fill="none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [fill="none"], #main-sideMenu .side-menu-panel .active-option svg [fill="none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [fill="none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [fill="none"], #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [fill="none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [fill="none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [fill="none"], #main-sideMenu .side-menu-panel .active-option .icon-wrapper [fill="none"], #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [fill="none"], #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [fill="none"], #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [fill="none"] { fill: none !important; } #main-sideMenu.side-menu-collapsed { --sideMenuWidth: 80px; background-color: #3e505d !important; height: 100vh; max-height: 100vh; } #main-sideMenu.side-menu-collapsed .side-menu-header .side-menu-header-collapse-button { opacity: 0; transition: opacity 0.1s ease-out; } #main-sideMenu.side-menu-collapsed .side-menu-header:hover .side-menu-header-collapse-button { opacity: 1; } #main-sideMenu.side-menu-collapsed .side-menu-panel .side-menu-panel-option a { align-items: center; justify-content: center; } #main-sideMenu.side-menu-collapsed .side-menu-panel .side-menu-panel-option a i { position: static; left: 30px; transition: left 0.3s ease-out; } #main-sideMenu.side-menu-collapsed .side-menu-panel .side-menu-panel-option a span { opacity: 0; overflow: hidden; display: none; transition: opacity 0.1s ease-out, display 0.1s 0.2s; } #main-sideMenu.side-menu-mobile-view-open { --sideMenuWidth: 100vw; } @media screen and (max-width: 1024px) and (min-width: 769px) { #main-sideMenu { height: 100vh; max-height: 100vh; min-height: 100vh; } } @media screen and (max-width: 768px) { #main-sideMenu { position: absolute; transform: translateX(-100%); background-color: #3e505d !important; height: 100vh; max-height: 100vh; min-height: 100vh; width: 100vw; max-width: 100vw; min-width: 100vw; top: 0; left: 0; z-index: 1000; } #main-sideMenu.side-menu-mobile-view-open { transform: translateX(0); } } @media screen and (min-width: 1440px) { #main-sideMenu { --sideMenuWidth: 342px; background-color: #3e505d !important; height: 100vh; max-height: 100vh; } } #main-sideMenu .team-switcher-scroll::-webkit-scrollbar { width: 6px; } #main-sideMenu .team-switcher-scroll::-webkit-scrollbar-track { background: transparent; } #main-sideMenu .team-switcher-scroll::-webkit-scrollbar-thumb { background-color: #767676; border-radius: 3px; } #main-sideMenu .team-switcher-scroll::-webkit-scrollbar-thumb:hover { background-color: #999999; } .side-menu-typography { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; font-feature-settings: "kern" 1; font-kerning: normal; } .side-menu-nav-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; color: #ffffff !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-title-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.285em !important; color: #ffffff !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-avatar-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.333em !important; color: #333333 !important; text-align: center; letter-spacing: normal; text-transform: none; } .side-menu-footer-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; color: #ffffff !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-footer-secondary-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 12px !important; font-weight: 400 !important; line-height: 1.333em !important; color: #767676 !important; text-align: left; letter-spacing: normal; text-transform: none; } .side-menu-badge-text { font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.5 !important; color: #ffffff !important; text-align: center; letter-spacing: normal; text-transform: none; } .side-menu-typography, .side-menu-nav-text, .side-menu-title-text, .side-menu-avatar-text, .side-menu-footer-text, .side-menu-footer-secondary-text, .side-menu-badge-text { text-rendering: optimizeLegibility !important; font-feature-settings: "kern" 1 !important; font-kerning: normal !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; font-variant-ligatures: normal !important; font-variant-numeric: normal !important; } @supports (font-display: swap) { .side-menu-typography, .side-menu-nav-text, .side-menu-title-text, .side-menu-avatar-text, .side-menu-footer-text, .side-menu-footer-secondary-text, .side-menu-badge-text { font-display: swap; } } @media screen and (max-width: 768px) { .side-menu-nav-text, .side-menu-title-text, .side-menu-footer-text { font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; } .side-menu-title-text { font-weight: 500 !important; line-height: 1.285em !important; } .side-menu-avatar-text, .side-menu-footer-secondary-text { font-size: 12px !important; font-weight: 400 !important; line-height: 1.333em !important; } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .side-menu-typography, .side-menu-nav-text, .side-menu-title-text, .side-menu-avatar-text, .side-menu-footer-text, .side-menu-footer-secondary-text, .side-menu-badge-text { -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; } } .go-mixin-label { font-size: 12px; font-weight: 700; text-transform: uppercase; } @-webkit-keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes preload { 0% { background-position: 125% 0%; } 50% { background-position: -25% 0%; } 100% { background-position: -25% 0%; } } @keyframes bounce { 0% { margin-right: 0; } 50% { margin-right: 2.5px; } 100% { margin-right: 0; } } @keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; } } .go-mixin-item-separator { content: "•"; padding: 0 2.5px 0 5px; } .go-mixin-align-hcenter { left: 50%; position: absolute; transform: translateX(-50%); } .go-mixin-align-vcenter { top: 50%; position: absolute; transform: translateY(-50%); } .go-mixin-card-embossed-font { text-shadow: 1px 1px hsl(204, 25%, 8%); } .go-mixin-preload-gradient-anim { animation: preload 2s infinite linear; background-color: hsl(204, 22%, 95%); background-image: linear-gradient(90deg, hsl(204, 22%, 95%) 0%, hsl(204, 22%, 95%) 40%, hsl(198, 20%, 83%) 50%, hsl(204, 22%, 95%) 60%, hsl(204, 22%, 95%) 100%); } .go-mixin-text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -ms-text-overflow: ellipsis; } .optional { position: relative; } .optional::before { content: "(optional)"; position: absolute; top: 10px; right: 0; color: hsl(198, 20%, 59%); } .info-message-container { left: 50%; transform: translateX(-50%) translateY(-50%); top: 50%; position: absolute; color: hsl(199, 20%, 31%); text-align: center; } .info-message-container > span { font-size: 24px; line-height: 30px; } html, body { background-color: #F3F3F3 !important; } .main-header { width: 100%; display: flex; position: relative; background-color: #fff; flex-direction: column; font-weight: 400; color: #3f545e; font-size: 14px; line-height: 20px; padding: 0 10px; box-sizing: border-box; border-bottom: 1px solid hsl(198, 20%, 83%); } .main-header_name { text-decoration: none; font-size: 18px; padding: 20px 10px; line-height: 20px; display: block; overflow: hidden; text-overflow: ellipsis; height: 60px; white-space: nowrap; } .main-header_top { flex-direction: row; align-items: center; transform: translateX(-10px); border: none; } .main-header_top .hamburger { border: 0; height: 40px; width: 40px; padding: 10px; color: #0f1519; cursor: pointer; transition: background-color 0.2s ease-in-out; display: none; } .main-header_top .ts-icon-close { margin-left: auto; cursor: pointer; padding: 10px 0; } @media screen and (max-width: 768px) { .main-header_name { padding-left: 0; } .main-header_top { transform: translateX(0px); padding-left: 0; } .main-header_top .hamburger { display: block; } } .go-mixin-label { font-size: 12px; font-weight: 700; text-transform: uppercase; } @-webkit-keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes preload { 0% { background-position: 125% 0%; } 50% { background-position: -25% 0%; } 100% { background-position: -25% 0%; } } @keyframes bounce { 0% { margin-right: 0; } 50% { margin-right: 2.5px; } 100% { margin-right: 0; } } @keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; } } .go-mixin-item-separator { content: "•"; padding: 0 2.5px 0 5px; } .go-mixin-align-hcenter { left: 50%; position: absolute; transform: translateX(-50%); } .go-mixin-align-vcenter { top: 50%; position: absolute; transform: translateY(-50%); } .go-mixin-card-embossed-font { text-shadow: 1px 1px hsl(204, 25%, 8%); } .go-mixin-preload-gradient-anim { animation: preload 2s infinite linear; background-color: hsl(204, 22%, 95%); background-image: linear-gradient(90deg, hsl(204, 22%, 95%) 0%, hsl(204, 22%, 95%) 40%, hsl(198, 20%, 83%) 50%, hsl(204, 22%, 95%) 60%, hsl(204, 22%, 95%) 100%); } .go-mixin-text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -ms-text-overflow: ellipsis; } .optional { position: relative; } .optional::before { content: "(optional)"; position: absolute; top: 10px; right: 0; color: hsl(198, 20%, 59%); } .info-message-container { left: 50%; transform: translateX(-50%) translateY(-50%); top: 50%; position: absolute; color: hsl(199, 20%, 31%); text-align: center; } .info-message-container > span { font-size: 24px; line-height: 30px; } html, body { background-color: #F3F3F3 !important; } .main-footer { --footerHeight: 60px; background-color: #eff2f5; position: relative; transition: opacity 0.2s; height: var(--footerHeight); max-height: var(--footerHeight); min-height: var(--footerHeight); white-space: nowrap; display: flex; align-items: center; padding: 0 10px; justify-content: flex-end; z-index: 2000; } .main-footer::after { height: 1px; position: absolute; left: 0; right: 0; pointer-events: none; background-color: #cad7dc; content: ""; top: 0; } .main-footer button { margin-left: 10px; } .navigation .navigation-menu { margin-left: auto; overflow: hidden; } .navigation .navigation-menu ul { display: flex; flex-wrap: wrap; padding: 0; margin: 0; max-width: calc(100vw - 40px); } .go-mixin-label { font-size: 12px; font-weight: 700; text-transform: uppercase; } @-webkit-keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes preload { 0% { background-position: 125% 0%; } 50% { background-position: -25% 0%; } 100% { background-position: -25% 0%; } } @keyframes bounce { 0% { margin-right: 0; } 50% { margin-right: 2.5px; } 100% { margin-right: 0; } } @keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; } } .go-mixin-item-separator { content: "•"; padding: 0 2.5px 0 5px; } .go-mixin-align-hcenter { left: 50%; position: absolute; transform: translateX(-50%); } .go-mixin-align-vcenter { top: 50%; position: absolute; transform: translateY(-50%); } .go-mixin-card-embossed-font { text-shadow: 1px 1px hsl(204, 25%, 8%); } .go-mixin-preload-gradient-anim { animation: preload 2s infinite linear; background-color: hsl(204, 22%, 95%); background-image: linear-gradient(90deg, hsl(204, 22%, 95%) 0%, hsl(204, 22%, 95%) 40%, hsl(198, 20%, 83%) 50%, hsl(204, 22%, 95%) 60%, hsl(204, 22%, 95%) 100%); } .go-mixin-text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -ms-text-overflow: ellipsis; } .optional { position: relative; } .optional::before { content: "(optional)"; position: absolute; top: 10px; right: 0; color: hsl(198, 20%, 59%); } .info-message-container { left: 50%; transform: translateX(-50%) translateY(-50%); top: 50%; position: absolute; color: hsl(199, 20%, 31%); text-align: center; } .info-message-container > span { font-size: 24px; line-height: 30px; } html, body { background-color: #F3F3F3 !important; } .tab-link { list-style-type: none; margin: 0; padding: 0 16px !important; cursor: pointer; position: relative; } .tab-link::before { content: none !important; } .tab-link:first-child { padding-left: 0 !important; } .tab-link:first-child a { padding-left: 16px; min-width: 30px; position: relative; } .tab-link:hover a { color: #0f1519; } .tab-link:has(.active:not(.has_ts_icon_other)) { color: #0f1519; } .tab-link:has(.active:not(.has_ts_icon_other))::after { content: ""; height: 3px; background-color: #db0011; position: absolute; left: 0; bottom: 0; right: 0; top: auto; width: auto; z-index: 1; } .tab-link a { text-decoration: none !important; display: block; width: 100%; color: #333; font-size: 16px; font-weight: 400; white-space: nowrap; padding: 10px 0; } .tab-link a.active { color: #0f1519; } .tab-link a span:has(i.ts-icon-other) { position: absolute; left: 0; right: 0; top: 0; bottom: 10px; background-color: #fff; display: flex; align-items: flex-end; } .tab-link a span:has(i.ts-icon-other)::before { position: absolute; } .cards { padding: 0; } .go-mixin-label { font-size: 12px; font-weight: 700; text-transform: uppercase; } @-webkit-keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes move-progress-bar { 0% { background-position: 0 0; } 100% { background-position: 40px 40px; } } @keyframes preload { 0% { background-position: 125% 0%; } 50% { background-position: -25% 0%; } 100% { background-position: -25% 0%; } } @keyframes bounce { 0% { margin-right: 0; } 50% { margin-right: 2.5px; } 100% { margin-right: 0; } } @keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; } } .go-mixin-item-separator { content: "•"; padding: 0 2.5px 0 5px; } .go-mixin-align-hcenter { left: 50%; position: absolute; transform: translateX(-50%); } .go-mixin-align-vcenter { top: 50%; position: absolute; transform: translateY(-50%); } .go-mixin-card-embossed-font { text-shadow: 1px 1px hsl(204, 25%, 8%); } .go-mixin-preload-gradient-anim { animation: preload 2s infinite linear; background-color: hsl(204, 22%, 95%); background-image: linear-gradient(90deg, hsl(204, 22%, 95%) 0%, hsl(204, 22%, 95%) 40%, hsl(198, 20%, 83%) 50%, hsl(204, 22%, 95%) 60%, hsl(204, 22%, 95%) 100%); } .go-mixin-text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -ms-text-overflow: ellipsis; } .optional { position: relative; } .optional::before { content: "(optional)"; position: absolute; top: 10px; right: 0; color: hsl(198, 20%, 59%); } .info-message-container { left: 50%; transform: translateX(-50%) translateY(-50%); top: 50%; position: absolute; color: hsl(199, 20%, 31%); text-align: center; } .info-message-container > span { font-size: 24px; line-height: 30px; } html, body { background-color: #F3F3F3 !important; } .ts-app { flex: 1 0 0px; display: flex; flex-direction: column; width: 100%; max-width: 100%; min-width: 100%; position: relative; } .ts-app:has(#go-app-container) { min-width: unset; width: unset; max-width: unset; } #go-app { box-sizing: content-box; } #go-app .close-aside-button { color: inherit; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } #go-app .close-aside-button:hover { background-color: hsla(198, 20%, 83%, 0.5); text-decoration: none; } #go-app .form-wrapper { flex-direction: column; display: flex; flex: 1; } #go-app #main-sideMenu { height: 100vh; max-width: 100%; display: flex; } #go-app #main-sideMenu .side-menu { @import "../components/organisms/sideMenu/typography.css"; } #go-app #main-sideMenu .side-menu #go-app #go-app-container .sidebar .ts-menu > li > a:hover:before { bottom: 0; content: ""; left: 0; position: absolute; right: 0; right: auto; top: 0; width: 5px; background-color: hsl(325, 98%, 33%); } #go-app #main-sideMenu .side-menu #go-app #go-app-container request-info .request-status:hover.created:before, #go-app #main-sideMenu .side-menu #go-app #go-app-container [request-info] .request-status:hover.created:before { background-color: hsl(200, 21%, 92%); } #go-app #main-sideMenu .side-menu #go-app #go-app-container request-info .request-status:hover.approved:before, #go-app #main-sideMenu .side-menu #go-app #go-app-container [request-info] .request-status:hover.approved:before { background-color: hsl(99, 85%, 42%); } #go-app #main-sideMenu .side-menu #go-app #go-app-container request-info .request-status:hover.pending:before, #go-app #main-sideMenu .side-menu #go-app #go-app-container [request-info] .request-status:hover.pending:before { background-color: #ff9100; } #go-app #main-sideMenu .side-menu #go-app #go-app-container request-info .request-status:hover.declined:before, #go-app #main-sideMenu .side-menu #go-app #go-app-container [request-info] .request-status:hover.declined:before, #go-app #main-sideMenu .side-menu #go-app #go-app-container request-info .request-status:hover.error:before, #go-app #main-sideMenu .side-menu #go-app #go-app-container [request-info] .request-status:hover.error:before { background-color: hsl(0, 100%, 37%); } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.hasSidemenuOpen + .content-right conversation .add-message { left: 360px; transition: 0.25s; } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.side-menu-open + .content-right conversation .add-message { left: 360px; transition: 0.25s; } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.hasDoubleSidemenuCollapsed + .content-right conversation .add-message { left: 60px; } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.side-menu-collapsed + .content-right conversation .add-message { left: 60px; } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.side-menu-collapsed [ts-variant="sideMenuItemSpan"] { opacity: 0; transition: opacity 0.3s; } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.collapsedAndOpenChild + .content-right conversation .add-message { left: 360px; } #go-app #main-sideMenu .side-menu #go-app #go-app-container #main-sideMenu.side-menu-collapsed:has(.open) + .content-right conversation .add-message { left: 360px; } #go-app #main-sideMenu .side-menu #go-app #go-app-container .mb10 { margin-bottom: 10px; } #go-app #main-sideMenu .side-menu #main-sideMenu { --sideMenuWidth: 342px; --sideMenuTransition: min-width 0.3s ease-in-out, max-width 0.3s ease-in-out; overflow: hidden; background-color: #3e505d !important; position: fixed; top: 0; left: 0; width: var(--sideMenuWidth); max-width: var(--sideMenuWidth); min-width: var(--sideMenuWidth); transition: var(--sideMenuTransition); display: flex; flex-direction: column; z-index: 1000; height: 100vh; max-height: 100vh; } @media screen and (max-width: 768px) { #go-app #main-sideMenu .side-menu #main-sideMenu { --sideMenuWidth: 100vw; --sideMenuTransition: none; } } #go-app #main-sideMenu .side-menu #main-sideMenu > * { background-color: inherit; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel { flex: 1; position: relative; background-color: #3e505d !important; overflow-y: auto; overflow-x: hidden; min-height: 0; scrollbar-width: thin; scrollbar-color: #767676 transparent; scroll-behavior: smooth; word-wrap: break-word; word-break: break-word; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel::-webkit-scrollbar { width: 6px; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel::-webkit-scrollbar-track { background: transparent; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel::-webkit-scrollbar-thumb { background-color: #767676; border-radius: 3px; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel::-webkit-scrollbar-thumb:hover { background-color: #999999; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel > ul, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel > div, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menu"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"] { background-color: inherit; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg circle:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg rect:not([fill="none"]):not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg polygon:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg polyline:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg line:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg ellipse:not([fill="none"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill:black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill: black"] { fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel svg [fill="none"] { fill: none !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [class*="Icon"] { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg circle:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg circle:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg circle:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg circle:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg rect:not([fill="none"]):not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg rect:not([fill="none"]):not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg rect:not([fill="none"]):not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg rect:not([fill="none"]):not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg polygon:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg polygon:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg polygon:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg polygon:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg polyline:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg polyline:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg polyline:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg polyline:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg line:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg line:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg line:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg line:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg ellipse:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg ellipse:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg ellipse:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg ellipse:not([fill="none"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: black"] { fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] svg [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] svg [fill="none"] { fill: none !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-selected="true"] [class*="Icon"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [aria-current="page"] [class*="Icon"] { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiPaper-root { background-color: #3e505d !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] { background-color: #3e505d !important; padding: 0; margin: 0; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root { height: 44px !important; min-height: 44px !important; max-height: 44px !important; padding: 0 !important; background-color: transparent !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option { background-color: #1d262c !important; border-left: 3px solid #db0011 !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root.active-option svg [style*="fill: #000"] { fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root:hover { background-color: rgba(255, 255, 255, 0.05) !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiMenuItem-root:focus { outline: 2px solid #ffffff; outline-offset: 2px; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root { padding: 12px 20px !important; gap: 15px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; font-family: "Univers Next for HSBC", "HSBC_MtUnivers_Latin", sans-serif !important; font-size: 14px !important; font-weight: 400 !important; line-height: 1.428em !important; color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root img, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root .icon-wrapper { width: 18px !important; height: 18px !important; min-width: 18px !important; min-height: 18px !important; max-width: 18px !important; max-height: 18px !important; flex-shrink: 0; color: #ffffff !important; fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root svg *, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root img *, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .MuiLink-root .icon-wrapper * { color: #ffffff !important; fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item { height: 44px !important; min-height: 44px !important; max-height: 44px !important; margin: 0 !important; background-color: transparent !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg circle:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg rect:not([fill="none"]):not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg polygon:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg polyline:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg line:not([fill="none"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg ellipse:not([fill="none"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:black"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: black"] { fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item svg [fill="none"] { fill: none !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [ts-variant="secondaryNavigation"] .secondary-navigation-item [class*="Icon"] { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .side-menu-panel-option a i { transition: left 0.3s ease-out; flex-shrink: 0; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .side-menu-panel-option a span { transition: opacity 0.2s ease-out 0.1s; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .side-menu-panel-option .request-status.pending i { color: orange; top: 40px; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .side-menu-panel-option .secondary { font-weight: 300; font-size: 12px; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper, #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] { color: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] path:not([data-name="Bounding box"]), #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] path:not([data-name="Bounding box"]) { fill: #ffffff !important; stroke: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill:#333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill: #333"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill:#000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill: #000"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill: #000"] { fill: #ffffff !important; } #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill:none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [style*="fill: none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option svg [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option svg [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option svg [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .MuiSvgIcon-root [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .MuiSvgIcon-root [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .MuiSvgIcon-root [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option .icon-wrapper [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option .icon-wrapper [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option .icon-wrapper [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .MuiMenuItem-root.active-option [class*="Icon"] [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel [role="menuitem"].active-option [class*="Icon"] [fill="none"], #go-app #main-sideMenu .side-menu #main-sideMenu .side-menu-panel .active-option [class*="Icon"] [fill="none"] { fill: none !important; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-collapsed { --sideMenuWidth: 80px; background-color: #3e505d !important; height: 100vh; max-height: 100vh; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-collapsed .side-menu-header .side-menu-header-collapse-button { opacity: 0; transition: opacity 0.1s ease-out; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-collapsed .side-menu-header:hover .side-menu-header-collapse-button { opacity: 1; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-collapsed .side-menu-panel .side-menu-panel-option a { align-items: center; justify-content: center; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-collapsed .side-menu-panel .side-menu-panel-option a i { position: static; left: 30px; transition: left 0.3s ease-out; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-collapsed .side-menu-panel .side-menu-panel-option a span { opacity: 0; overflow: hidden; display: none; transition: opacity 0.1s ease-out, display 0.1s 0.2s; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-mobile-view-open { --sideMenuWidth: 100vw; } @media screen and (max-width: 1024px) and (min-width: 769px) { #go-app #main-sideMenu .side-menu #main-sideMenu { height: 100vh; max-height: 100vh; min-height: 100vh; } } @media screen and (max-width: 768px) { #go-app #main-sideMenu .side-menu #main-sideMenu { position: absolute; transform: translateX(-100%); background-color: #3e505d !important; height: 100vh; max-height: 100vh; min-height: 100vh; width: 100vw; max-width: 100vw; min-width: 100vw; top: 0; left: 0; z-index: 1000; } #go-app #main-sideMenu .side-menu #main-sideMenu.side-menu-mobile-view-open { transform: translateX(0); } } @media screen and (min-width: 1440px) { #go-app #main-sideMenu .side-menu #main-sideMenu { --sideMenuWidth: 342px; background-color: #3e505d !important; height: 100vh; max-height: 100vh; } } #go-app #main-sideMenu .side-menu #main-sideMenu .team-switcher-scroll::-webkit-scrollbar { width: 6px; } #go-app #main-sideMenu .side-menu #main-sideMenu .team-switcher-scroll::-webkit-scrollbar-track { background: transparent; } #go-app #main-sideMenu .side-menu #main-sideMenu .team-switcher-scroll::-webkit-scrollbar-thumb { background-color: #767676; border-radius: 3px; } #go-app #main-sideMenu .side-menu #main-sideMenu .team-switcher-scroll::-webkit-scrollbar-thumb:hover { background-color: #999999; } #go-app #go-app-container { height: 100vh; max-width: 100vw; display: flex; } #go-app #go-app-container .content:not(.modal-panel-content) { margin: 0; max-width: inherit; box-sizing: border-box; padding: 20px; } #go-app #go-app-container .main-content { overflow: hidden; padding: 20px; } #go-app #go-app-container .content-right { display: flex; max-width: 100%; flex-direction: column; min-width: 0; flex: 1; isolation: isolate; position: relative; margin-left: 0; height: 100vh; overflow-y: auto; overflow-x: hidden; } #go-app #go-app-container .content-right:empty { display: none; } @media screen and (max-width: 768px) { #go-app #go-app-container .content-right { margin-left: 0; width: 100vw; max-width: 100vw; } } #go-app #go-app-container .app-content { display: flex; width: 100vw; height: 100vh; max-width: 100vw; box-sizing: border-box; } #go-app #go-app-container .app-content .content-right { width: 100vw; max-width: 100vw; } #go-app #go-app-container .app-content.with-sidemenu .content-right { margin-left: 342px; width: calc(100vw - 342px); max-width: calc(100vw - 342px); } @media screen and (max-width: 768px) { #go-app #go-app-container .app-content.with-sidemenu .content-right { margin-left: 0; width: 100vw; max-width: 100vw; } } #go-app #go-app-container .ts-table { min-width: 100%; } #go-app #go-app-container .team-overview { padding-bottom: 20px; flex-grow: 1; } #go-app #go-app-container .team-overview .page-main { height: 100% !important; } #go-app #go-app-container .page-main { margin: 0; min-width: 0; flex: 1; } #go-app #go-app-container .page-main .main-content { overflow: hidden; } #go-app #go-app-container .page-main .main-content .page-settings { height: 100% !important; overflow: auto; } #go-app #go-app-container .page-main .main-content .page-settings .user-report-header { padding-top: 0; padding-bottom: 20px; } #go-app #go-app-container #requestSidebar .side-menu-my-request-aside { position: absolute; top: 0; left: 0; height: 100%; width: calc(320px - 40px); background-color: #192226; z-index: 1200; } #go-app #go-app-container #requestSidebar .side-menu-my-request-aside header { display: flex; align-items: center; justify-content: space-between; padding: 20px 40px; height: 60px; } #go-app #go-app-container #requestSidebar .side-menu-my-request-aside .close-drawer { cursor: pointer; } :root { --focus-outline-color1: #72ade9; --focus-outline-color2: #5d98d3; --focus-outline-color3: #538cc6; /* Tells the browser not to fake bold or italic styles. */ font-synthesis: none; /* Improves how text looks, especially for longer or large blocks of text. It enables: better kerning (spacing between letters), nicer ligatures (like combining fi into one shape). */ text-rendering: optimizeLegibility; /* Makes text look thinner and smoother on macOS / iOS (WebKit browsers like Safari and Chrome). */ -webkit-font-smoothing: antialiased; /* Same idea as above, but for Firefox on macOS. */ -moz-osx-font-smoothing: grayscale; } .outline-1:focus-visible { outline-offset: -2px; outline: 2px solid var(--focus-outline-color1) !important; } .outline-2:focus-visible { outline-offset: 2px; outline: 2px solid var(--focus-outline-color2) !important; } .outline-3:focus-visible { outline-offset: 2px; outline: 2px solid var(--focus-outline-color3) !important; } .flag-button:focus-visible { outline-offset: -8px !important; outline: 2px solid var(--focus-outline-color2) !important; } .outline-tab:focus-visible > span { outline-offset: 8px; outline: 2px solid var(--focus-outline-color1) !important; } .hide-focus { outline: none; border: 1px solid transparent !important; } .offset-4 { outline-offset: -4px !important; } .offset-2 { outline-offset: -2px !important; } .no-border-radius { border-radius: 0 !important; } /* override required after removing of ts-ui lib */ fieldset { border: none; margin: 0; } textarea { box-sizing: border-box; } ul { padding: inherit; } /* Hide the default clear and reveal buttons in Edge for password inputs */ input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear { display: none; } /*# sourceMappingURL=app-4de7212d5c2d67bb401f.css.map*/