﻿:root {
    --side-nav-bg-color: #0A323F;
    --side-nav-fore-color: #FFFFFF;
    --side-nav-hover-bg-color: #385864;
    --side-nav-hover-fore-color: #FFFFFF;
    --side-nav-active-bg-color: #385864;
    --side-nav-active-fore-color: #FFFFFF;
    --side-nav-2-active-bg-color: var(--color-seafoam);
    --side-nav-2-active-fore-color: #0A323F;
    --border-color: #C8CBD9;
    --bg-primary-color: #0A323F;
    --bg-primary-hover-color: #030f13;
    --btn-primary-fore-color: #FFFFFF;
    --btn-primary-bg: #0A323F;
    --btn-primary-hover: #007d85;
    --btn-primary-focus: #1A4D59;
    --btn-primary-disabled: #ADD5D6;
    --btn-default-bg: #FFFFFF;
    --btn-default-border: #DDDEED;
    --btn-default-disabled: #F1F1FA;
    --btn-default-disabled-fore-color: #5A5B69;
    --color-deep-teal: #OA323F;
    --color-teal: #OO7D85;
    --color-seafoam: #C6E7DB;
    --color-light-seafoam: #DBEFE8;
    --color-yellow: #F0FF44;
    --color-light-blue: #F9FDF8;
}

html, body { height: 100%; }
body { font-family: inter, "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif !important; line-height: 1.5; background-color: #ffffff; font-size: 13px; font-weight:400; color: #676a6c; margin: 0; text-align: left;overflow-x: hidden;}

#main-body-wrapper { width: 100%; overflow-x: hidden; display: flex; }
#main-wrapper { padding: 0 15px; position: relative !important; flex-shrink: 1; width: calc(100% - 250px); background-color: #ffffff; transition:all 0.4s;min-height: 100vh; padding-bottom: 65px;}

.wrapper { padding: 0 10px; }
.wrapper-content { padding: 0; }

@media (min-width: 768px) { 
    .navbar-side { z-index: 999; width: 250px; }
}
@media (max-width: 768px) { 
    #main-wrapper { position: inherit; margin: 0 0 0 0; min-height: 100vh; width: 100%; }
}

.fixed-nav .navbar-min { margin: 5px 5px 5px 15px;border-radius:4px; }

.portal-logo {padding: 10px 15px;display: flex;align-items: center;}
.portal-logo img { max-width:250px;max-height:50px;vertical-align:middle;}
.portal-logo span { font-size:15px;font-weight:bold;}

#lnk-app-navigator {display:block; color:#fff!important; padding:10px 15px;font-size:20px;background:#28388F;}
.account-info { display: block; text-align: left; margin: 0 25px 0 50px; line-height:28px;font-size:14px!important;}

.btn-toggle-nav { display:inline-block; color: #fff !important; background-color: #28388F ; position: absolute; left: 0; top: 30px; padding:7px 5px; border-radius: 0 4px 4px 0; transform: scaleY(1.5);}
.btn-toggle-nav .fa:before { content: "\f104"; }

.sidebar-collapse { flex-grow: 1; }

.navbar.navbar-static-top {display:flex;flex-wrap:wrap;align-items:center; padding: 0; width: 100%; background: #ffffff;justify-content:space-between;}
.navbar.navbar-static-top .navbar-header { display: flex; align-items: center;position:relative;margin-right:auto;}

.navbar-fixed-top, .navbar-static-top { background: #f3f3f4; }
.navbar-side, .nav-header, li.active, #main-wrapper, .footer { -webkit-transition: all 0.4s; transition: all 0.4s; }

.navbar-side { display: flex; flex-direction: column; background: var(--side-nav-bg-color);}
.navbar-side .dropdown a:hover, .navbar-side .dropdown a:focus, .navbar-side .dropdown a:after { color: #fff !important; background-color: inherit !important; border-color: inherit !important;}
.app-item .app-icon { width: 60px; height:60px; text-align:center; background: #263D91; border-radius:50%; color:#fff; }
.app-item .app-icon i { font-size:25px; line-height: 60px; }
.navbar-side .dropdown a.app-item:hover, .navbar-side .dropdown a.app-item:focus, .navbar-side .dropdown a.app-item:after {color:#777!important;}

.navbar-side .nav-header { border-bottom:1px solid #ddd;min-height:50px;}

.navbar-static-top .navbar-header .user-profile {display:flex;align-items:center;padding:10px 15px;line-height:1.2;background-color:var(--side-nav-bg-color);
                                                 width:250px;transition:width 0.4s;color:var(--side-nav-fore-color);height:51px;margin-bottom:-1px;}
.navbar-static-top .navbar-header .user-profile .name {font-weight:bold;}
.navbar-static-top .navbar-header .user-profile .picture {width: 25px;height: 25px;border-radius: 50%;background-color: var(--side-nav-fore-color);color: var(--side-nav-bg-color);
    margin-right: 12px;text-align: center;font-weight: bold;line-height: 25px;flex:none;}
/*
.navbar-static-top .navbar-header .portal-logo ~ a {display:none;}
.navbar-side .nav-header .open > a, .nav-header .open > a:focus, .nav-header .open > a:hover { background-color: inherit; border-color: none; }
*/
.navbar-side .logo-element {font-size: 18px;font-weight: 600;color: white;display: none;padding: 18px 0;}

body.mini-navbar .navbar-static-top .navbar-header .user-profile {padding:7px 15px;}

.navbar-side .nav > li.active {border-left: 4px solid #FFFFFF;background: var(--side-nav-active-bg-color);border-radius:4px;}
.navbar-side .nav > li.active a {color:var(--side-nav-active-fore-color);}
.navbar-side .nav > li.menu-divider {padding:25px 15px;}
.navbar-side .nav > li.menu-divider span {display:block; height: 1px;overflow: hidden;background-color: var(--side-nav-fore-color);}
.navbar-side .nav > li > a:hover, .navbar-side .nav > li > a:focus {background-color: var(--side-nav-hover-bg-color);border-radius:4px;color:var(--side-nav-hover-fore-color);}
.navbar-side .nav > li > a { color: var(--side-nav-fore-color); padding: 10px 20px 10px 25px; display: block; }
.navbar-side .nav > li > span.menu-header {padding: 25px 20px 5px 25px;display: block;text-transform: uppercase;font-size: 0.8em;}
.navbar-side .nav li.noaccess { cursor: not-allowed; background: #f17b7b; }
.navbar-side .nav li.noaccess a { pointer-events:none; color:#fff; }
.navbar-side .nav li.disabled {cursor: not-allowed; }
.navbar-side .nav li.disabled a {pointer-events:none; color:#999!important; }
/*.navbar-side .nav > li > a.lnk-google-translate a.goog-te-menu-value, 
.navbar-side .nav > li > a.lnk-google-translate .goog-te-gadget-simple > span > a { font-size:25px; }*/

.navbar-static-top .nav > li > a i {margin-right: 6px; }
.navbar-side .nav > li > a i {font-size:1.2em;margin-right:14px;vertical-align:middle;}
.navbar-side .nav.nav-second-level > li.active {border: none;background-color:var(--side-nav-2-active-bg-color);border-top-left-radius:0;border-bottom-left-radius:0;}
.navbar-side .nav.nav-second-level > li.active a {color:var(--side-nav-2-active-fore-color);}
.navbar-side .nav.nav-second-level > li.active > a:hover {color:var(--side-nav-2-active-fore-color);background-color:var(--side-nav-2-active-bg-color);}
.navbar-side .nav.metismenu > li { display: block; width: 100%; position: relative;color: var(--side-nav-fore-color); }
.navbar-side .nav.metismenu .arrow { float: right; line-height: 1.42857; }

body.navbar-collapse .navbar-side { width: 70px; }

body.mini-navbar.fixed-sidebar .profile-element, .block { display: block !important; }
body.body-sm .navbar-header .user-profile {display: none;}
body.mini-navbar .navbar-header .user-profile, body.body-sm.mini-navbar .navbar-header .user-profile {width: 70px;display:block;}
body.body-sm.mini-navbar .navbar-header .user-profile {width: 70px;}

body.mini-navbar .navbar-header .user-profile .profile, body.body-sm .navbar-header .user-profile .profile { display:none;}
body.mini-navbar .navbar-header .user-profile .picture, body.body-sm .navbar-header .user-profile .picture {width:35px;height:35px;margin-right:0;line-height:35px;font-size:16px;}
body.mini-navbar .nav-header {  text-align: center; font-size: 16px; font-weight: 600; padding: 18px 0!important; display: block; }
body.mini-navbar .btn-toggle-nav .fa:before { content: "\f105"; }

body.mini-navbar #main-wrapper { width: calc(100% - 70px); }
body.mini-navbar .navbar-side { width: 70px; }
body.mini-navbar .nav-header { padding: 0; background-color: #28388F; }
body.mini-navbar .navbar-side .nav-footer img { width: 50px; height: 50px; }
body.mini-navbar .navbar-side .nav > li > a { font-size: 16px; }
body.mini-navbar .navbar-side .nav.nav-second-level > li.active {border-radius:4px;}
body.mini-navbar .navbar-side .nav:not(.nav-second-level) > li > a span.arrow {display: none;}
body.mini-navbar .navbar-side .nav > li > .nav-second-level li a { font-size: 12px; border-radius: 3px;white-space:nowrap; }
body.mini-navbar .nav-label, body.mini-navbar .navbar-side .nav li a span.nav-label { display: none; }
body.mini-navbar .app-menu li a span { display:block!important;}
body.mini-navbar .nav-second-level { display: none; }
body.mini-navbar .navbar-side .label.label-count {line-height: 12px;padding: 2px 5px;position: absolute;right:14px;top:8px}
body.mini-navbar .navbar-side .nav > li > span.menu-header {padding-left: 0;padding-right: 0;text-align:center;}

body.mini-navbar .metismenu .collapse { opacity: 0; }
body.mini-navbar .metismenu .collapse.in { opacity: 1; }
body.mini-navbar .nav .nav-second-level { position: absolute; left: 70px; top: 0; min-width: 200px; /*background-color: #1B56A6;*/ padding: 10px 10px 10px 10px; font-size: 12px; }
body.mini-navbar .metismenu .collapse.in a { display: block; }
body.mini-navbar .metismenu .collapse a { display: none; }
body.mini-navbar .nav-second-level li a { padding: 10px 10px 10px 15px; }
body.mini-navbar .nav li:hover > .nav-second-level, .mini-navbar .nav li:focus > .nav-second-level { display: block; border-radius: 0 2px 2px 0; height: auto; }
body.mini-navbar li.active .nav-second-level { left: 65px; }
a:hover, a:focus { text-decoration: none; }

body.mini-navbar .nav-second-level { background: var(--side-nav-bg-color); }
.navbar-side .nav-second-level li a { padding: 7px 10px; padding-left: 52px; }
.navbar-side .nav-third-level li a { padding-left: 70px; }

.app-menu-container { width: 372px; padding: 5px; background: #ffffff;border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); box-shadow: 0 6px 12px rgba(0,0,0,.175); }
.app-menu-container hr { margin:10px 0;border-bottom:none;}
.app-menu { padding: 0; list-style-type: none; }
.app-menu li a { display: block; padding: 5px; color: #777!important; font-size: 12px; font-weight: normal!important; }
.app-menu li .app-icon { margin:0px auto ;}
.app-menu li:hover { background: #f5f5f5;border-radius:5px; }
.app-menu li a span { display: block; margin-top: 5px; }
.app-menu li { display: block; float:left; width: 120px; height: 110px; text-align: center; }
.app-menu li a:hover {color: inherit!important; }
.app-menu-footer { background: #1B56A6 !important; padding:5px;text-align:center;border-radius: 4px;}
.app-menu-footer a {display:block; color:#fff!important;padding:6px;}
.app-menu-footer a i { font-size:1.5em;margin-right:5px;}

.navbar-header .breadcrumb { display: inline-block; background: none; padding: 0;margin:10px 0 10px 30px; }
.navbar-header .breadcrumb li:first-child { font-weight: bold; }
.navbar-header .breadcrumb .app-icon { display: inline-block; width: 30px; height: 30px; text-align: center; background: #263D91; border-radius: 50%; color: #fff; margin-right:5px;}
.navbar-header .breadcrumb .app-icon i { font-size: 15px; line-height: 30px; vertical-align:middle;}
.navbar-header .spn-help-icons a {font-size:1.5em; margin-left:7px;vertical-align:middle;}

.navbar-top-container {margin-right:-15px;margin-left:-15px;display:flex;flex-wrap:wrap;}

.navbar-top-links {display: flex;flex-wrap: wrap;margin-left: auto;margin-right:15px;}
.navbar-top-links li { display: inline-block; align-self: center; }
.nav.navbar-right > li > a { color: #999c9e; }
.nav.navbar-top-links > li > a { font-size: 20px;color:#545454;}
.navbar-top-links.anonymous li a { padding:15px 10px; font-size:13px; color:#545454; }
.navbar-top-links > li > a { padding: 10px; min-height: 50px; }
.nav.navbar-top-links > li > a:hover, .nav.navbar-top-links > li > a:focus {background:transparent;}

.nav .label, .ibox .label { font-size: 10px; }
.count-info .label { line-height: 12px; padding: 2px 5px; position: absolute; right: 6px; top: 8px; }
.label-warning, .badge-warning { background-color: #f8ac59; color: #FFFFFF; }

.footer { background: #fff; border-top: 1px solid #e7eaec; bottom: 0; left: 0; padding: 10px 20px; position: absolute; right: 0; padding-right:70px;text-align:center;}
.footer .links { list-style: none; list-style-type: none; padding: 0; margin-bottom:5px;}
.footer .links li { display:inline;}
.footer .links li:not(:first-child)::before { content : '|';  margin:0 5px; }
.footer a { color: inherit !important; }
.footer .brand { display: block; margin: 15px 0; }

.nav-footer { padding: 15px 0 100px 0; text-align: center; }
.nav-footer img { margin: auto; }
.lang-icon { width: 40px; height: 40px; position: absolute; left: 0; top: 0; font-size: 20px; }

.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; }
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.content-box { clear: both; margin: 15px 0; background-color: #ffffff;}
.border-bottom { border-bottom: 1px solid #e7eaec !important; }

.back-to-top { position:fixed;right:10px;bottom:70px;cursor:pointer;width:50px; height:50px;background-color: #1B56A6; color:#fff!important;border-radius:50%;text-align:center;font-size:30px;line-height:50px;z-index:1;}

/* fixed side nav and top nav header--- */

/*body.fixed-nav .navbar-static-side, body.canvas-menu .navbar-static-side {width: 250px;min-height:100vh;z-index: 999;position: fixed;}*/
body.fixed-nav #main-body-wrapper #main-wrapper, body.fixed-nav .navbar-static-side { padding-top: 50px; }
body.fixed-nav .navbar-static-top { background: #fff; transition-duration: 0.4s; border-bottom: 1px solid #e7eaec !important; z-index: 999; position: fixed; right: 0; left: 0; padding: 0; top: 0; margin: 0;}

body.mini-navbar .navbar-static-side { width: 70px; }

/* -- */


/* support widget  position*/

body.fixed-nav .zEWidget-launcher { margin-left:60px!important;}
body.fixed-nav.mini-navbar .zEWidget-launcher { margin-left:20px!important;}

/* -- */

/*@media only screen and (max-width:1400px) {
    .account-info { margin-right:6px; font-size:0.9em;}
    .navbar-header .breadcrumb {font-size:0.9em;}
    .nav.navbar-top-links > li > a {padding: 10px 6px; min-height: 50px; font-size:17px;}
    .navbar-top-links > li > a.lnk-google-translate {padding:7px 6px 0px 6px}
    .navbar-top-links > li > a.lnk-google-translate a.goog-te-menu-value, 
    .navbar-top-links > li > a.lnk-google-translate .goog-te-gadget-simple > span > a {font-size: 21px;}
}
*/
.navbar-top-links .dropdown-menu {width:220px;font-size:inherit;padding:5px;}
.navbar-top-links .dropdown-menu ul {padding-left:0;list-style-type:none;}
.navbar-top-links .dropdown-menu li {display:block;white-space:nowrap;}
.navbar-top-links .dropdown-menu li.header {text-transform:uppercase;font-weight:bold;}
.navbar-top-links .dropdown-menu li.header:not(:first-child){margin-top:15px;}
.navbar-top-links .dropdown-menu li a {padding:8px 12px;font-size:1em;display:block;color:inherit;}
.navbar-top-links .dropdown-menu li a:hover, .navbar-top-links .dropdown-menu li a:focus {background-color: var(--side-nav-hover-bg-color)!important;color: var(--side-nav-fore-color)!important;border-radius:4px;}
.navbar-top-links .dropdown-menu li i {font-size: 1.2em;margin-right: 14px;vertical-align: middle;}

/* alert box */
.dropdown-menu-alerts {width: 350px !important;padding: 5px !important;}
.alert-box { max-height:400px;}
.al-list { font-size:0.9em; }
.al-list li a {padding:10px!important;border-radius:4px;}
.al-list li a.no-link {cursor:default;}
.al-list .al-title {font-weight:bold;}
.al-list .al-time {float:right;font-size:0.9em;color:#999;} 
.al-list .al-msg {margin:10px 0 0;} 
.al-list li.divider:last-child {display:none;}
.dropdown-menu .menu-divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5; }

/* alert box */

.h-switch { position: relative;display: inline-block;width: 45px;height: 20px;font-weight: normal;line-height: 20px;color: #ffffff;text-align: left;margin-bottom:0;font-size:10px;vertical-align:middle;}
.h-switch input { opacity: 0;width: 0;height: 0;}
.h-switch .h-slider {  position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #a7b1c2;transition: .4s;border-radius: 20px;display:inline-block;vertical-align:middle;}
.h-slider:before { position: absolute;content: "";height: 16px;width: 16px;left: 2px;bottom: 2px;background-color: white;transition: .4s;border-radius: 16px;}
.h-switch .h-slider:after {content: 'OFF';display: inline-block;padding-left: 20px;}
.h-switch input:checked + .h-slider {background-color: #5cb85c;}
.h-switch input:checked + .h-slider:before {transform: translateX(24px);}
.h-switch input:checked + .h-slider:after { content: 'ON';padding-left: 8px;}
.h-switch.status-loading:before {background-size:23px 23px;}

.fa-help {vertical-align: middle;color: #337ab7;margin-left:4px;font-size:1.4rem;}

.nav-hover-item {position:absolute;font-size:13px;padding:18px 14px 14px 0;background-color:#28388f;white-space:nowrap;margin-left:10px;z-index:9999;font-weight:600;
                border-top-right-radius:4px;border-bottom-right-radius:4px;}

/* Knowledge base */

body.kb-article .kb-box, body.kb-article .chat-ai-box {display:block;}
body.kb-article.show-article .kb-box, body.kb-article.show-chat .chat-ai-box  {right:0;}
body.kb-article.show-article .content-box, body.kb-article.show-article .footer,
body.kb-article.show-chat .content-box, body.kb-article.show-chat .footer{ width:calc(100% - 400px)!important;}
body.kb-article.show-article .kb-box .btn-help { display:none; position:static;font-size:1em;box-shadow:none;height:auto;width:unset;height:unset;border-radius:4px;margin-top:0;padding:5px 10px;}
body.kb-article.show-article .kb-box .btn-help span {display:initial;top:auto;position:static;margin-left:10px;}
body.kb-article.show-article .chat-ai-box .btn-chat { display:none;}

body.kb-article.show-chat .chat-ai-box .btn-chat { display:none; position:static; font-size:1em; box-shadow:none; height:auto; width:unset; 
	height:unset; border-radius:4px; margin-top:0; padding:5px 10px;}
body.kb-article.show-chat .chat-ai-box .btn-chat span { display:initial; top:auto; position:static; margin-left:10px; }
body.kb-article.show-chat .kb-box .btn-help { display:none;}

      
.kb-box, .chat-ai-box {width:400px;background-color:#fff;height:calc(100vh - 50px);border-left:1px solid #ddd;position:fixed;right:-400px;top:51px;transition:all 0.4s;z-index:9999;}
.kb-box .btn-help {position: absolute;left: -40px;width:40px; box-shadow: 0 5px 15px rgba(0, 0, 0, .5); border-radius: 25px 0px 0px 25px;font-size:1.25em;
                   background-color:#1B56A6;color:#fff;transition:all 0.4s;padding:8px 12px;top:70px; }
.kb-box .btn-help span {display:none;text-align:center;position:relative;top:115px;}
.kb-box .btn-help span i {vertical-align:middle;font-size:1.3em;margin-left:5px;}

.chat-ai-box .btn-chat { position:absolute; left:-40px; width:40px; box-shadow:0 5px 15px rgba(0, 0, 0, .5); border-radius:25px 0px 0px 25px; 
		font-size:1.25em; background-color:#1B56A6; color:#fff; transition:all 0.4s; padding:8px 12px; top:120px; }
.chat-ai-box .btn-chat span { display:none; text-align:center; position:relative; top:115px; }
.chat-ai-box .btn-chat span i { vertical-align:middle; font-size:1.3em; margin-left:5px; }


.pnl-article .pnl-body {padding:10px;line-height:1.7em;height:Calc(100vh - 100px)!important;}
.pnl-article .pnl-body .help-loading {margin-top:100px;text-align:center;width:100%;font-size:1.2em;}
.pnl-article .pnl-body .no-help {width:100%;padding: 30px 60px;font-weight:bold;color:#777;}
.pnl-article .pnl-body .no-help h3 {font-size:2.5em;font-weight:bold;line-height:1.3em;margin-bottom:50px;}
.pnl-article .pnl-body .no-help p {font-size:1.2em;}
.pnl-article .pnl-body .help-loading img { margin-bottom: 15px;}

.pnl-article .pnl-head {height:50px;padding:10px;border-bottom:1px solid #ddd;display:flex;align-items:center;justify-content:space-between;}
.pnl-article .hlp-title {line-height:1.5em;margin-top:0;margin-bottom:10px;}
.pnl-article img, .pnl-article iframe { max-width:100%; }
.pnl-article .pnl-head .lnk-hlp, .pnl-article .pnl-head .lnk-hlp1, .pnl-article .pnl-head .links a {font-size:1.5em;color:#777!important;}
.pnl-article .pnl-head .links a {margin-right:10px;}

body.show-article .back-to-top, body.show-chat .back-to-top {right:410px;z-index:105;}

.disable { pointer-events: none; cursor: not-allowed; background-color: grey !important; }

/* Knowledge base */

.navbar-side .nav > li > a.lnk-google-translate {padding:0;}
.goog-te-gadget-simple {display:block!important;padding:10px 20px 10px 25px!important;}
.goog-te-gadget-simple > span > a:before {font-size:1.2em;color:var(--side-nav-fore-color);line-height:1.2em;vertical-align:middle;}
.goog-te-gadget-simple > span > a:after{display:inline-block;content:'Language';margin-left:13px;color:var(--side-nav-fore-color);}
body.mini-navbar .goog-te-gadget-simple > span > a:before {font-size:1.4em;}
body.mini-navbar .goog-te-gadget-simple > span > a:after {content:''}

/* button styles */
.btn {border-radius:12px;}
.btn-primary, .btn-success {background-color:var(--btn-primary-bg);border-color:transparent;color:var(--btn-primary-fore-color);}
.btn-primary:hover, .btn-success:hover {background-color: var(--btn-primary-hover);}
.btn-primary:focus, .btn-success:focus  {background-color: var(--btn-primary-focus);}
.btn-primary.disabled, .btn-success.disabled  {background-color: var(--btn-primary-disabled);}

.btn-default {background-color:var(--btn-default-bg);border-color:#E4E7EC;color:var(--btn-primary-bg);}
.btn-default:hover {border-color:var(--btn-default-border);color: var(--btn-primary-hover)}
.btn-default:focus {color:var(--btn-primary-bg);border-color:var(--btn-primary-hover)}
.btn-default.disabled {color: var(--btn-default-disabled-fore-color);border-color: var(--btn-default-border);background-color: var(--btn-default-disabled)} 


.btn-out-primary {color: #2e6da4 !important;border-color: #2e6da4;background-color: #fff;}
/* button styles */

.block {display:block;}

.switch.simulation {width:50px;margin:0 50px;}
.switch.simulation input:checked + .slider {background-color:var(--bg-primary-color);}
.switch.simulation input:checked + .slider:before {-webkit-transform: translateX(23px);transform: translateX(23px);}
.simulation-label {color:#ff0000;font-weight:bold;}

.app-loader, .divWaiting {position: fixed;background-color: #FAFAFA;z-index: 9998!important;opacity: 0.8;text-align: center;top: 0;left: 0;height: 100%;width: 100%;}
.app-loader div, .divWaiting div {position: absolute;left: 50%;top: 50%;height: 100px;width: 200px;margin-top: -50px;margin-left: -100px;font-size: 20px;color: #777777;}
select.btn {text-align:left;}

/* new */
@media (max-width: 768px) {
    .body-sm .navbar-static-side {display: block;z-index: 999;width: 0;overflow: hidden;}
    .body-sm.mini-navbar .navbar-static-side {overflow:visible;}
    .navbar-static-top .navbar-header { display: inline;float: left;}
    .body-sm.mini-navbar.navbar-static-top .navbar-header .user-profile {display: inline;float: left;}
    #btnInvite, .account-info, .simulation-label {display: none !important;}
    .switch.simulation {margin:0;}
    .modal-content {width:90%}
    .footer {font-size: 0.9em;text-align: center;}
    .footer .links {display: none;}
}

@media (max-width:  450px) {
    body.kb-article.show-article .kb-box, body.kb-article.show-chat .chat-ai-box {width: 100vw;}
}

@media print {
    #main-wrapper {padding: 0 !important;width: 100%;margin: 0 !important;}
    .navbar-top-container, .navbar-static-side, .footer, .zEWidget-launcher, #slideOut, #slideOutCart, .sim-switch, body.kb-article .kb-box {display: none;}
    .content-box {margin: 0;border: none;}
}

/* -- New SG UI added */
/* -- page title styles */
.page-title {
    color: black;
    font-size: 14px;
    font-weight: bold;
}

    .page-title .page-title-content {
        margin-top: 7px;
        font-size: 14px;
        font-style: normal;
        font-weight: 600;
        line-height: 20px;
    }

/* -- panel widget styles */
.panel-widget-green {
    background: #e3ffe7;
    border-radius: 15px;
    padding: 20px;
    color: #1c1c1c;
    margin: 15px 0;
}

.panel-widget-red {
    background: #f6e5e5;
    border-radius: 15px;
    padding: 20px;
    color: #1c1c1c;
    margin: 15px 0;
}

.panel-widget-top {
    overflow: hidden;
}

    .panel-widget-top .widget-top-title {
        font-size: 14px;
        font-weight: bold;
    }

.panel-widget-bottom {
    overflow: hidden;
    margin-top: 5px;
}

    .panel-widget-bottom .widget-bottom-title {
        font-size: 24px;
        font-weight: bold;
    }

    .panel-widget-bottom .sub-widget-bottom-title {
        font-size: 20px;
        font-weight: bold;
    }

    .panel-widget-bottom .widget-bottom-prct-spend {
        font-size: 10px;
        float: right;
        padding-top: 5px;
    }

.panel-widget .prct, .pnl-sub-widget .prct {
    display: inline-block;
    text-align: center;
    padding: 5px;
    background: #f5f5f5;
}

.panel-widget .prct-spend {
    font-size: 1.2em;
}

/* -- content panel styles */
.panel-heading {
    color: black;
    font-size: 14px;
    font-weight: bold;
}

.panel {
    background-color: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 15px !important;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05)
}

.panel-default > .panel-heading {
    background-color: white !important;
    border-top-right-radius: 15px !important;
    border-top-left-radius: 15px !important;
}

.content-panel {
    margin: 15px 0;
    padding: 15px;
    background-color: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 16px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05)
}

.content-panel-body {
    padding: 0;
}

.content-panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid #d8d8d8;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: #f7f7f7;
    border-radius: 16px 16px 0 0;
}

.content-panel-title {
    color: black;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 7px;
    height: 35px;
}

    .content-panel-title div:first-child {
        padding: 0 !important;
        margin-top: 7px;
    }

    .content-panel-title div {
        padding: 0 !important;
    }

.content-panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.content-panel-default {
    border-color: #ddd
}

.form-control {
    font-size: 0.95em;
    border-radius: 10px;
}

/* -- console page styles */
/* -- console widget styles */
.console-widget-green {
    background: #e3ffe7;
    border-radius: 15px;
    padding: 20px;
    color: #1c1c1c;
    margin: 15px 0;
}

.console-widget-red {
    background: #f6e5e5;
    border-radius: 15px;
    padding: 20px;
    color: #1c1c1c;
    margin: 15px 0;
}

.console-widget-top {
    overflow: hidden;
}

    .console-widget-top .console-widget-top-title {
        font-size: 14px;
        font-weight: bold;
    }

.console-widget-bottom {
    overflow: hidden;
    margin-top: 5px;
}

    .console-widget-bottom .console-widget-bottom-title {
        font-size: 24px;
        font-weight: bold;
    }

    .console-widget-bottom .console-sub-widget-bottom-title {
        font-size: 24px;
        font-weight: bold;
    }


.console-widget-top .console-widget-top-icon-green {
    font-size: 24px;
    float: right;
    padding-top: 0;
    color: #00570c;
    margin-top: -5px;
}

.console-widget-top .console-widget-top-icon-red {
    font-size: 24px;
    float: right;
    padding-top: 0;
    color: #526b8e;
    margin-top: -5px;
}

.console-widget-bottom .console-widget-bottom-prct-spend {
    font-size: 12px;
    float: right;
    padding-top: 0;
}

.console-widget .prct, .pnl-sub-widget .prct {
    display: inline-block;
    text-align: center;
    padding: 5px;
    background: #f5f5f5;
}

.console-widget .prct-spend {
    font-size: 1.2em;
}

/* -- console panel styles */

.console-panel {
    background-color: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 16px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05)
}

.console-panel-body {
    padding: 0 0 20px 0;
}

    .console-panel-body .console-panel {
        margin: 0;
        border: 1px solid #d8d8d8;
        border-bottom: none;
    }

    .console-panel-body p {
        margin: 15px;
    }

    .console-panel-body table thead {
        background-color: #f7f7f7;
    }

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    padding: 15px;
    font-size: 0.95em;
    color: black;
}


.console-panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid #d8d8d8;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: #f7f7f7;
    border-radius: 16px 16px 0 0;
    height: 55px;
}

.console-panel-title {
    color: black;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
}

    .console-panel-title div:first-child {
        padding: 0 !important;
        margin-top: 7px;
    }

    .console-panel-title div {
        padding: 0 !important;
    }


.console-panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px
}

.console-panel-default {
    border-color: #ddd
}


.button-status-green, a.button-status-green:hover {
    border-radius: 10px;
    border: 1px solid #79B450;
    background: #F2FFE9;
    color: #79B450;
    text-align: center;
    font-size: 12px;
    line-height: 12px;
    padding: 8px;
}

.button-status-yellow {
    border-radius: 10px;
    border: 1px solid #E7B400;
    background: #FFFFE9;
    color: #E7B400;
    text-align: center;
    font-size: 12px;
    line-height: 12px;
    padding: 8px;
}

.button-status-blue {
    border-radius: 10px;
    border: 1px solid #C7C7C7;
    background: #FEFEFE;
    color: #B4B4B4;
    text-align: center;
    font-size: 12px;
    line-height: 12px;
    padding: 8px;
}
/*._pendo-badge, ._pendo-image {width:50px!important;height:50px!important;}*/
body.show-article ._pendo-badge, body.show-article ._pendo-resource-center-global-container,
body.show-chat ._pendo-badge, body.show-chat ._pendo-resource-center-global-container {right: 410px!important;}

.position-relative {position:relative;}
.chat-box p {padding:10px; background-color:#f5f5f5; border-radius:10px; color:#000000; text-align:justify; justify-content:start;}
.chat-box .message.sent p {background-color:transparent; text-align:right; display:flex; justify-content:end;}
.chat-box .message.sent p span {background-color:#0a323f;}
.chat-box .message.sent p p {background-color:#0a323f; color:white;}
.chat-box .card {background-color:transparent !important;}
.pnl-chat .pnl-chat-head .lnk-chat, .pnl-chat .pnl-chat-head .lnk-hlp1, .pnl-chat .pnl-chat-head .links a {font-size: 1.5em;color: #777 !important;}
.pnl-chat .pnl-chat-head .links a {margin-right: 10px;}

/* scrollbar */
.chat-ai-box.pnl-chat .pnl-chat-history::-webkit-scrollbar, .chat-ai-box.pnl-chat .chat-box::-webkit-scrollbar {width:5px; height:5px;}
.chat-ai-box.pnl-chat .pnl-chat-history::-webkit-scrollbar-track, .chat-ai-box.pnl-chat .chat-box::-webkit-scrollbar-track {-webkit-box-shadow:inset 0 0 6px rgba(0, 0, 0, 0.3); 
	-webkit-border-radius:10px; border-radius:10px;}
.chat-ai-box.pnl-chat .pnl-chat-history::-webkit-scrollbar-thumb, .chat-ai-box.pnl-chat .chat-box::-webkit-scrollbar-thumb {-webkit-border-radius:10px; border-radius:10px; 
			background:rgba(255, 255, 255, 0.3); -webkit-box-shadow:inset 0 0 6px rgba(0, 0, 0, 0.5);}
.chat-ai-box.pnl-chat .pnl-chat-history::-webkit-scrollbar-thumb:window-inactive, .chat-ai-box.pnl-chat .chat-box::-webkit-scrollbar-thumb:window-inactive {background:rgba(255, 255, 255, 0.3);}
.plr-10 {padding-left:10px; padding-right:10px;}
.tooltip {z-index:9999;}
.message-content {color:#000;}

.c-yellow {color:var(--color-yellow);}

.private-file-wrapper { text-align: center;border-radius: 10px;}
.private-file-wrapper span.label {z-index: 0;display: inline-block;cursor: pointer;color: #fff;padding: 0 1px;text-transform: uppercase;font-size: 12px;}
#fileInput {display: inline-block;position: absolute;z-index: 1;height: 50px;top: 0;opacity: 0;cursor: pointer;}
.textarea-container {position: absolute;top: 5px;right: 20px;}
.send-message {margin-right: 5px;border-radius: 10px;}