:root {

    --im-primary:       #0278FF;
    --im-primary-deep:  #0455B5;
    --im-primary-ink:   #013A80;
    --im-primary-soft:  #3B95FF;
    --im-primary-wash:  #E7F1FF;
    --im-secondary:     #0455B5;
    --im-accent:        #02E6FF;
    --im-text:          #0A1B33;
    --im-muted:         #6B7E99;
    --im-paper:         #F2F7FF;
    --im-line:          #DCE8F8;

    --im-font-brand: 'Nunito', 'Open Sans', system-ui, sans-serif;

    --im-warm:          #FF8000;
    --im-warm-ink:      #C25E00;
    --im-warm-wash:     #FFF3E6;
    --im-warm-line:     #FFD0A3;
    --im-muted-soft:    #9AAAC0;

    --im-chrome-ink:    var(--im-primary);

    --System-theme-BackGroundColor: var(--im-primary);
    --System-theme-FontColor: #F7F7F7;
}

.im-fx-lockup {
    display: inline-flex;
    align-items: center;
    gap: .2em;
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1;
    white-space: nowrap;
    color: var(--im-text);
    font-family: var(--im-font-brand);
}
.im-fx-lockup__mark {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    height: .96em;
    color: currentColor;
    transform: translateY(-.17em);
}
.im-fx-lockup__mark svg { height: 100%; width: auto; display: block; }
.im-fx-lockup__mark svg g,
.im-fx-lockup__mark svg path,
.im-fx-lockup__mark svg circle { stroke: currentColor; }

.im-fx-lockup em {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: .3em;
    font-style: normal;
    font-weight: 900;
    color: #fff;

    padding: calc(.12em + .01em) .42em .15em .4em;
    background: linear-gradient(120deg, var(--im-primary-deep) 0, var(--im-primary) 52%, var(--im-accent) 100%);

    border-radius: .22em .6em .22em .45em;
    box-shadow:
        0 .34em .9em rgba(0, 120, 200, .5),
        inset 0 .05em 0 rgba(255, 255, 255, .45),
        inset 0 -.06em .18em rgba(0, 60, 120, .38);
}

.im-fx-lockup em::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: .045em;
    background: linear-gradient(120deg, rgba(2,230,255,.85), #fff 45%, rgba(4,85,181,.85));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
            mask-composite: exclude;
    pointer-events: none;
}

.im-fx-lockup--topbar { font-size: 22px; }
.im-fx-lockup--login  { font-size: 46px; }
.im-fx-lockup--small  { font-size: 27px; }
.im-fx-lockup--light  { color: #fff; }

.navbar-branding {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}
.navbar-branding .navbar-brand { padding-left: 12px; padding-right: 0; }
.navbar-branding #toggle_sidemenu_l { flex: 0 0 auto; }

#sidebar_left .sidebar-menu > li > a,
#sidebar_left .sidebar-menu > li > ul > li > a {
    transition: background-color .18s ease, color .18s ease;
}

#sidebar_left .sidebar-menu > li.active > a > span,
#sidebar_left .sidebar-menu > li.active > a > i,
#sidebar_left .sidebar-menu > li > ul > li.active > a > span,
#sidebar_left .sidebar-menu > li > ul > li.active > a > i { color: #fff !important; }

#sidebar_left .sidebar-menu > li.active > a,
#sidebar_left .sidebar-menu > li > ul > li.active > a {
    background-color: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--im-accent);
    font-weight: 700;
}

#sidebar_left .sidebar-menu > li > a:hover,
#sidebar_left .sidebar-menu > li > ul > li > a:hover {
    background-color: rgba(255, 255, 255, .10) !important;
    color: #fff !important;
}
#sidebar_left .sidebar-menu > li > a:hover > span,
#sidebar_left .sidebar-menu > li > a:hover > i { color: #fff !important; }

body.sb-l-m #sidebar_left .sidebar-menu > li.active > a {
    box-shadow: inset 4px 0 0 var(--im-accent);
}

#sidebar_left .sidebar-menu > li.sidebar-label {
    color: rgba(255, 255, 255, .72) !important;
    letter-spacing: .08em;
}

#sidebar_left .sidebar-menu > li:not(.sidebar-label) { padding: 0 !important; }
#sidebar_left .sidebar-menu > li.sidebar-label {
    padding: 22px 0 8px !important;
    line-height: 1.1;
}
#sidebar_left .sidebar-menu > li > a {
    height: 48px !important;
    padding: 0 !important;
    line-height: 48px !important;
}

#sidebar_left .sidebar-menu > li > a > span,
#sidebar_left .sidebar-menu > li > a > i {
    height: 48px !important;
    line-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
}
#sidebar_left .sidebar-menu > li > a > span[class*="fa"],
#sidebar_left .sidebar-menu > li > a > span[class*="glyphicon"],
#sidebar_left .sidebar-menu > li > a > i {
    font-size: 18px;
    text-align: center;
}

#sidebar_left .sidebar-menu .sidebar-title,
#sidebar_left .sidebar-menu > li > ul .sidebar-title { background: transparent !important; }

body.sb-l-m #sidebar_left .sidebar-menu > li > a > .sidebar-title {
    background: #1183FF !important;
    font-family: var(--im-font-brand);
    font-weight: 800;
    height: 48px !important;
    line-height: 48px !important;
    padding: 0 18px !important;
    box-shadow: 0 10px 28px rgba(4, 24, 47, .28);

    width: 260px !important;
    box-sizing: border-box;
}

#sidebar_left .sidebar-menu > li > a > .caret {
    top: 0 !important;
    bottom: 0 !important;
    height: 48px !important;
    line-height: 48px !important;
    margin: 0 !important;
}

#sidebar_left .sidebar-menu > li > a > .sidebar-title { padding-right: 26px; }

#sidebar_left .sidebar-menu > li > a > .sidebar-menu-arrow,
#sidebar_left .sidebar-menu > li > a > .caret { line-height: 48px !important; }

#sidebar_left .sidebar-menu > li > ul > li > a {
    height: 42px !important;
    line-height: 42px !important;
    padding: 0 0 0 18px !important;
}
#sidebar_left .sidebar-menu > li > ul > li > a > span,
#sidebar_left .sidebar-menu > li > ul > li > a > i {
    height: 42px !important;
    line-height: 42px !important;
    font-size: 15px;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > ul {

    width: 260px !important;
    min-width: 260px !important;

    margin-top: 0 !important;
    border-top: 2px solid var(--im-accent) !important;
    background-color: var(--im-primary-deep) !important;
    box-shadow: 0 10px 28px rgba(4, 24, 47, .28);
    border-radius: 0 6px 6px 0;
    overflow: hidden;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li > a {
    display: block !important;
    color: #fff !important;
    font-family: var(--im-font-brand);
    font-size: 14px;
    height: 48px !important;
    line-height: 48px !important;
    padding: 0 18px !important;
    width: auto !important;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li { padding: 0 !important; }

body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li > a > span,
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li > a > i {
    height: 48px !important;
    line-height: 48px !important;
    vertical-align: top;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > a > .sidebar-title {

    top: 0 !important;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li { position: relative; }
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li:hover {
    background-color: rgba(255, 255, 255, .14) !important;
}
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li.active {
    background-color: rgba(255, 255, 255, .18) !important;
    box-shadow: inset 3px 0 0 var(--im-accent);
}
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li > a:hover,
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li.active > a {
    background-color: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > ul { padding-bottom: 0 !important; }
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li:last-child { margin-bottom: 0 !important; }
body.sb-l-m #sidebar_left .sidebar-menu > li > ul > li:last-child > a {
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
}

body.sb-l-m #sidebar_left .sidebar-menu { padding-top: 0 !important; }

body.sb-l-m #sidebar_left .sidebar-menu > li:first-child { padding-top: 0 !important; }

.dropdown-toggle,
#toggle_sidemenu_l,
.ad-screen-full,
.topbar-menu-toggle,
.navbar-brand { color: var(--im-chrome-ink) !important; }

#sidebar_left .sidebar-toggle-mini { display: none !important; }


#content a:not(.btn):not(.im-fx-lockup),
.admin-form a:not(.btn) { color: var(--im-primary) !important; }
#content a:hover:not(.btn) { color: var(--im-primary-deep) !important; }

.navbar .nav > li.dropdown.open .dropdown-menu,
.navbar .nav > li.dropdown .open .dropdown-menu,
.dropdown-menu { border-top-color: var(--im-primary) !important; }
.navbar .nav > li.dropdown.open .dropdown-menu:after,
.navbar .nav > li.dropdown .open .dropdown-menu:after,
.dropdown-menu:after { border-bottom-color: var(--im-primary) !important; }
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus { background-color: var(--im-primary) !important; }

.admin-form .gui-input:focus,
.admin-form .gui-textarea:focus,
.admin-form .select > select:focus,
.form-control:focus,
input:focus, select:focus, textarea:focus {
    border-color: var(--im-primary) !important;
    box-shadow: 0 0 0 2px rgba(2, 120, 255, .18) !important;
    outline-color: var(--im-primary) !important;
}

.text-primary { color: var(--im-primary) !important; }
.bg-primary, .btn-primary, .label-primary, .badge-primary,
.panel-primary > .panel-heading { background-color: var(--im-primary) !important; }
.btn-primary { border-color: var(--im-primary) !important; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--im-primary-deep) !important;
    border-color: var(--im-primary-deep) !important;
}
.panel-primary, .panel-primary > .panel-heading { border-color: var(--im-primary) !important; }

.navbar-branding .navbar-brand {
    display: flex !important;
    align-items: center !important;
    height: 60px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > ul {
    border-radius: 0 0 6px 0 !important;
}

#sidebar_left .sidebar-menu > li.sidebar-label { padding-left: 18px !important; }

body.sb-l-o #sidebar_left > .nano-content { overflow-x: hidden !important; }

body.sb-l-o #sidebar_left > .nano-content::-webkit-scrollbar {
    display: block !important;
    width: 6px;
}
body.sb-l-o #sidebar_left > .nano-content::-webkit-scrollbar:horizontal { display: none !important; }
body.sb-l-o #sidebar_left > .nano-content::-webkit-scrollbar-track { background: transparent; }
body.sb-l-o #sidebar_left > .nano-content::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .3);
    border-radius: 3px;
}
body.sb-l-o #sidebar_left > .nano-content::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, .5);
}

body.sb-l-m #sidebar_left .sidebar-menu > li.im-session-item { display: block !important; }

body.sb-l-m #sidebar_left .sidebar-menu > li.im-session-item > a > .sidebar-title { left: 60px; }

#sidebar_left .sidebar-menu > li > ul {
    background-color: var(--im-primary-deep) !important;
    filter: none !important;
}

body.sb-l-o #sidebar_left .sidebar-menu > li.im-session-label,
body.sb-l-o #sidebar_left .sidebar-menu > li.im-session-item {
    position: sticky;
    z-index: 3;
    background-color: var(--im-primary);
}
body.sb-l-o #sidebar_left .sidebar-menu > li.im-session-label {
    bottom: 52px;
    box-shadow: 0 -1px 0 rgba(255, 255, 255, .16);

    opacity: 1 !important;
    color: rgba(255, 255, 255, .7) !important;
}
body.sb-l-o #sidebar_left .sidebar-menu > li.im-session-item { bottom: 0; }

body.sb-l-o #sidebar_left > .nano-content > .sidebar-menu {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

body.sb-l-o #sidebar_left .sidebar-menu > li.im-session-label { margin-top: auto; }

body.sb-l-o #sidebar_left .sidebar-menu > li { flex: 0 0 auto; }


body.sb-l-m .navbar-branding {
    width: 250px !important;
    overflow: visible !important;
}

#content .pagination > .active > a,
#content .pagination > .active > a:hover,
#content .pagination > .active > a:focus,
#content .pagination > .active > span,
#content .dataTables_paginate .paginate_button.current,
#content .dataTables_paginate .paginate_button.current:hover,
#content .bg-primary a:not(.btn),
#content .label-primary a:not(.btn),
#content .panel-primary > .panel-heading a:not(.btn),
#content .btn-primary,
#content .im-cta a:not(.btn) { color: #fff !important; }

#content .bg-primary .text-muted,
#content .bg-primary .text-muted small,
#content .panel-primary > .panel-heading .text-muted {
    color: rgba(255, 255, 255, .82) !important;
}

:root { accent-color: var(--im-primary); color-scheme: light; }

input, textarea, select, [contenteditable] { caret-color: var(--im-primary); }

::selection { background: rgba(2, 230, 255, .32); }
::-moz-selection { background: rgba(2, 230, 255, .32); }

* { -webkit-tap-highlight-color: rgba(2, 230, 255, .28); }

html { scrollbar-color: rgba(2, 120, 255, .45) transparent; }
body.sb-l-o #sidebar_left > .nano-content { scrollbar-color: rgba(255, 255, 255, .35) transparent; }

@media (max-width: 991px) {
    body.sb-l-o #sidebar_left {
        position: fixed;

        top: 60px;
        left: 0;
        bottom: 0;

        z-index: 1020;
        box-shadow: 6px 0 24px rgba(4, 24, 47, .28);

        padding-top: 0 !important;
    }

    #sidebar_left .media-links a {
        display: inline-block;
        padding: 12px 4px;
        margin: -12px 0;
    }

    body.sb-l-o #content_wrapper { margin-left: 45px !important; }

    body.sb-l-o .navbar-branding {

        width: 250px !important;
        max-width: none !important;
        overflow: visible !important;
    }
}

.admin-form .switch-primary > input:checked + label,
div.switch.switch-primary input:checked + label {
    background: var(--im-primary);
    border-color: var(--im-primary);
}

.admin-form .switch-primary > input:checked + label::after { color: var(--im-primary); }

.admin-form .switch-primary > input:checked:focus + label {
    background: var(--im-primary-deep);
    border-color: var(--im-primary-deep);
}

a { color: var(--im-primary); }
a:hover,
a:focus { color: var(--im-primary-deep); }

#content .admin-form a.button,
#content .admin-form a.button:hover,
#content .admin-form a.button:focus,
.admin-form a.button.btn-primary,
.admin-form a.button.btn-primary:hover,
.admin-form a.button.btn-primary:focus { color: #fff !important; }

.label-primary,
.badge-primary { background-color: var(--im-primary) !important; }

.label-info,
.badge-info,
.bg-info { background-color: var(--im-primary-soft) !important; color: #fff !important; }

.label-warning,
.badge-warning,
.bg-warning { background-color: var(--im-warm) !important; color: #fff !important; }

.label-default,
.badge-default { background-color: var(--im-muted) !important; color: #fff !important; }

.label-muted { background-color: var(--im-muted-soft) !important; color: #fff !important; }

.text-info { color: var(--im-primary-soft) !important; }
.text-warning { color: var(--im-warm) !important; }

.btn-info,
.btn-info:focus { background-color: var(--im-primary-soft); border-color: var(--im-primary-soft); color: #fff; }
.btn-info:hover,
.btn-info:active { background-color: var(--im-primary); border-color: var(--im-primary); color: #fff; }

.btn-warning,
.btn-warning:focus { background-color: var(--im-warm); border-color: var(--im-warm); color: #fff; }
.btn-warning:hover,
.btn-warning:active { background-color: var(--im-warm-ink); border-color: var(--im-warm-ink); color: #fff; }

.alert-info {
    background-color: var(--im-primary-wash);
    border-color: #C7DDFB;
    color: var(--im-primary-ink);
}

.alert-warning {
    background-color: var(--im-warm-wash);
    border-color: var(--im-warm-line);
    color: var(--im-warm-ink);
}

.panel-info > .panel-heading { background-color: var(--im-primary-soft); border-color: var(--im-primary-soft); color: #fff; }

.external-page .navbar,
.external-page .admin-form .panel-info.heading-border:before,
.external-page .admin-form .panel-info .heading-border:before { background-color: var(--im-primary); }.external-page .admin-form .btn-primary { background-color: var(--im-primary); }.external-page .admin-form .btn-primary:hover,
.external-page .admin-form .btn-primary:focus,
.external-page .admin-form .btn-primary:active { background-color: var(--im-primary-deep); }.external-page .admin-form .switch-primary > input:checked + label {
    background: var(--im-primary);
    border-color: var(--im-primary);
}.external-page #main {
    padding-top: 30px;
    background-color: #fff;
}.external-page .im-logo {
    margin: 0;
    line-height: 1;
}.external-page .im-logo img {
    height: 140px;
    margin-top: -50px;
}.external-page .im-logo-small {
    margin: 0;
    line-height: 1;
    text-align: left;
}.external-page .im-logo-small img {
    height: 80px;
    margin-top: -40px;
}.external-page .im-is-hidden { display: none !important; }.external-page .im-login-alert { margin: 0 0 15px; }.external-page .admin-form .gui-input {
    transition: border-color .18s ease-out, box-shadow .18s ease-out;
}.external-page .admin-form .gui-input:focus {
    transition: none;
    border-color: var(--im-primary);
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(99, 145, 231, .55);
}.external-page .navbar .navbar-nav > li > a,
.external-page .navbar .navbar-nav > li > a > span {
    color: #fff;
}.external-page .navbar .navbar-nav > li > a:hover,
.external-page .navbar .navbar-nav > li > a:focus {
    background-color: rgba(255, 255, 255, .12);
    color: #fff;
}.external-page .request-fullscreen.im-is-active { background-color: rgba(255, 255, 255, .2); }.external-page .im-remembered-avatar {
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
}.external-page .navbar .dropdown-toggle,
.external-page .navbar .dropdown-toggle:hover,
.external-page .navbar .dropdown-toggle:focus,
.external-page .navbar .ad-screen-full,
.external-page .navbar .request-fullscreen,
.external-page .navbar .fa-link { color: #fff !important; }.external-page .navbar .dropdown-toggle:hover .fa-link,
.external-page .navbar .request-fullscreen:hover { color: var(--im-accent) !important; }.external-page .im-tagline {
    display: block;
    white-space: nowrap;
    font-size: clamp(10.5px, 3.4vw, 15px);
    color: var(--im-muted);
}.external-page .im-tagline > .fa { margin-right: 8px; }.external-page .im-fx-lockup--login { font-size: clamp(37px, 11.7vw, 46px); }.external-page .navbar .nav > li.hidden-xs:has(.request-fullscreen) { display: block !important; }

@media (max-width: 767px) {.external-page .navbar .nav > li > a.request-fullscreen { display: inline-block; }
}

@media (max-width: 767px) {.external-page #login1 { display: flex; flex-direction: column; }.external-page #login1 > #im-block-remembered,
.external-page #login1 > #im-block-full { order: 1; }.external-page #login1 > .im-login-forgot { order: 2; margin-top: 4px; }.external-page #login1 > .im-login-actions { order: 3; margin-top: 12px; }.external-page .im-login-actions { text-align: center !important; }.external-page .im-login-actions > .button { width: 100%; }
}.external-page .admin-form a.button,
.external-page .admin-form a.button:hover,
.external-page .admin-form a.button:focus { color: #fff; text-decoration: none; }.external-page #im-block-full .panel-footer {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
}.external-page #im-block-full .panel-footer .switch { margin: 0 !important; }.external-page #im-block-full .panel-footer .button { float: none; }.external-page #im-block-full .panel-footer::before,
.external-page #im-block-full .panel-footer::after { display: none; }.external-page #im-block-full .panel-footer .button { margin-right: 0 !important; }

.navbar .nav > li.open > a,
.navbar .nav > li:hover > a,
.navbar .nav > li:focus > a,
.navbar .nav > li.active > a,
.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus { background-color: rgba(255, 255, 255, .9) !important; }

#topbar.alt { background: #FAFAF5; }

#tr-center-principal { background-color: #F5F5F5; }

.btn-info.dark,
.btn-info.dark:focus {
    background-color: var(--im-primary) !important;
    border-color: var(--im-primary) !important;
}

.btn-info.dark:hover,
.btn-info.dark:active,
.btn-info.dark.active {
    background-color: var(--im-primary-deep) !important;
    border-color: var(--im-primary-deep) !important;
}

#sidebar_left {
    background-color: var(--im-primary) !important;
    font-size: calc(12.3px + 1px);
}

.sidebar-title {
    background-color: var(--im-primary) !important;
    color: #f7f7f7 !important;
}

.sidebar-menu li a {
    height: 55px;
    padding-top: 10px;
    border-bottom: 1px solid #5586E1;
    color: #f7f7f7;
}

.sidebar-menu li a:hover { color: #f7f7f7; }

.sidebar-menu > li > a > span:nth-child(1) { line-height: 38px !important; font-size: 14px; }

.sidebar-menu > li > a > span:nth-child(2) { padding-left: 10px; }

.sidebar-menu > li > a > span.caret { top: 10px; color: #f7f7f7; }

.sidebar-menu > li > a:active,
.sidebar-menu > li > a:focus { color: #f7f7f7; }

.sidebar-menu li ul li a,
.sidebar-menu li > a.menu-open > span.caret { color: #f7f7f7 !important; }

.sidebar-menu li ul li.active a { color: #f7f7f7; }

.sidebar-menu .sidebar-label { color: #f7f7f7; opacity: .7; }

.sidebar-menu > li > ul {
    background-color: var(--im-primary) !important;
    filter: brightness(96%);
}

.sidebar-menu > li > ul > li > a {
    height: 47px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.sidebar-menu > li > ul > li:first-child > a { padding-top: 0; }

.sidebar-menu > li > ul > li.active > a > span:nth-child(1),
.sidebar-menu > li > ul > li > a.menu-open > span:nth-child(1) { color: #f7f7f7; }

.sidebar-toggle-mini { padding: 0 !important; }

.sidebar-toggle-mini span { color: #f7f7f7; }

.sidebar-widget.author-widget .media-links a { margin-top: 0; }

.media-body a { color: #f7f7f7; }

.media-body .media-links a { color: #f7f7f7 !important; opacity: .8; }

.bg-primary,
.bg-primary.light {
    background-color: var(--im-primary) !important;
    color: #f7f7f7 !important;
}

.admin-form .gui-input,
.admin-form .select > select,
.form-control {
    transition: border-color .18s ease-out, box-shadow .18s ease-out;
}

.admin-form .gui-input:focus,
.admin-form .select > select:focus,
.form-control:focus,
.input-group > .input-group-addon:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group > .gui-input,
.input-group > .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group:focus-within {
    border-radius: 3px;
    box-shadow: 0 0 8px rgba(92, 141, 232, .55);
}

.input-group:focus-within > .input-group-addon {
    border-color: var(--im-primary);
    color: var(--im-primary);
}

.input-group:focus-within > .gui-input:focus,
.input-group:focus-within > .form-control:focus {
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.bg-primary .btn-info.dark,
.bg-primary .btn-info.dark:focus {
    background-color: #fff !important;
    border-color: #fff !important;
    color: #3f6fc4 !important;
}

.bg-primary .btn-info.dark:hover,
.bg-primary .btn-info.dark:active {
    background-color: var(--im-primary-wash) !important;
    border-color: var(--im-primary-wash) !important;
    color: #2f5aa8 !important;
}

body.sb-l-m .sidebar-menu > li > a > span,
body.sb-l-m .sidebar-menu > li > a > span:nth-child(1) {
    color: #f7f7f7;
}

body.sb-l-m .sidebar-menu > li > a { border-bottom-color: rgba(255, 255, 255, .12); }

body.sb-l-m .sidebar-menu > li > a:hover { background-color: rgba(255, 255, 255, .12); }

@media (max-width: 1100px) {
    body #content_wrapper,
    body.sb-l-o #content_wrapper {
        left: 0;
        margin-left: 250px;
    }
    body.sb-l-m #content_wrapper {
        left: 0;
        margin-left: 60px;
    }
}

@media (max-width: 900px) {
    body.sb-l-m #content_wrapper { margin-left: 45px; }
}

.external-page .admin-form .button.btn-info { background-color: var(--im-primary); border-color: var(--im-primary); color: #fff; }

.external-page .admin-form .button.btn-info:hover,
.external-page .admin-form .button.btn-info:focus,
.external-page .admin-form .button.btn-info:active { background-color: var(--im-primary-deep); border-color: var(--im-primary-deep); color: #fff; }

#sidebar_left .sidebar-menu > li > a.accordion-toggle.menu-open {
    background-color: rgba(255, 255, 255, .16) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--im-accent);
    font-weight: 700;
}

body.sb-l-m #sidebar_left .sidebar-menu > li > a.accordion-toggle.menu-open { background-color: rgba(255, 255, 255, .16) !important; box-shadow: inset 4px 0 0 var(--im-accent); }

body.dashboard-page { min-height: 100vh !important; }

#sidebar_left { min-height: 100vh !important; }

body.dashboard-page #main {
    margin-top: -60px;
    padding-top: 60px;
}

body.dashboard-page .tray-center { height: auto !important; }

body.dashboard-page #main { background-color: #f5f5f5; }

body.sb-l-o #sidebar_left > .nano-content {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

body.sb-l-o #sidebar_left > .nano-content > .sidebar-menu {
    flex: 1 1 auto;
    min-height: 0 !important;
}

#sidebar_left,
#sidebar_left .sidebar-menu > li > a,
#sidebar_left .sidebar-menu > li > ul > li > a { font-family: var(--im-font-brand); }

#content .pagination > li > a,
#content .pagination > li > span {
    border-color: var(--im-line);
    color: var(--im-primary);
}

#content .pagination > li > a:hover,
#content .pagination > li > span:hover {
    background-color: var(--im-primary-wash);
    border-color: var(--im-line);
    color: var(--im-primary-deep);
}

#content .pagination > .active > a,
#content .pagination > .active > span,
#content .pagination > .active > a:hover,
#content .pagination > .active > span:hover,
#content .pagination > .active > a:focus,
#content .pagination > .active > span:focus {
    background-color: var(--im-primary) !important;
    border-color: var(--im-primary) !important;
    color: #fff !important;
}

#content .pagination > .disabled > a,
#content .pagination > .disabled > span {
    border-color: var(--im-line);
    color: var(--im-muted-soft);
}

#sidebar_left {
    top: 0 !important;
    padding-top: 0 !important;
}

body.sb-l-o #sidebar_left {
    top: 60px !important;
    height: calc(100% - 60px) !important;
    min-height: 0 !important;
}

body.sb-l-m #sidebar_left {
    position: fixed !important;

    top: 60px !important;
    height: calc(100% - 60px) !important;
    min-height: 0 !important;
}

#sidebar_left > .nano-content > .sidebar-menu,
#sidebar_left > .sidebar-menu { padding-top: 6px !important; }

.im-font-size {
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 2px;
    background-color: rgba(0, 0, 0, .043);
    overflow: hidden;
}

.navbar .im-font-size { padding: 0; }

.im-font-size > .btn {
    height: 28px;
    min-width: 28px;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
    color: var(--im-chrome-ink);
}

.im-font-size > .btn + .btn { border-left: 1px solid rgba(0, 0, 0, .12); }

.im-font-size > .btn:hover,
.im-font-size > .btn:focus { color: var(--im-primary-deep); }


body[data-im-font="sm"] #content_wrapper { zoom: .92 !important; }

body[data-im-font="lg"] #content_wrapper { zoom: 1.1 !important; }

body[data-im-font="xl"] #content_wrapper { zoom: 1.25 !important; }


#content.table-layout > .tray-center {
    padding-top: 23px;
    padding-left: 23px;
    padding-right: 23px;
}

body { font-family: var(--im-font-brand); }

.im-font-size-label {
    display: inline-block;
    font-family: var(--im-font-brand);
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
}

.im-font-size-sign {
    margin-left: 1px;
    font-size: 11px;
    font-weight: 700;
    vertical-align: super;
}

/* Keep wide icons clear of the active marker and vertically centered. */
#sidebar_left .sidebar-menu > li > a > span.fa:first-child,
#sidebar_left .sidebar-menu > li > a > span.glyphicon:first-child {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 38px;
    height: 48px !important;
    line-height: normal !important;
    padding: 0 !important;
    overflow: visible;
}
body.sb-l-o #sidebar_left .sidebar-menu > li > a > span.fa:first-child,
body.sb-l-o #sidebar_left .sidebar-menu > li > a > span.glyphicon:first-child {
    margin-left: 6px !important;
}
#sidebar_left .sidebar-menu > li > a > span.fa:first-child::before,
#sidebar_left .sidebar-menu > li > a > span.glyphicon:first-child::before {
    display: block;
    line-height: 1.4;
    padding: 2px;
}

/* Keep nanoScroller content and submenu arrows inside the expanded sidebar. */
body.sb-l-o #sidebar_left.nano > .nano-content {
    right: 0 !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}
body.sb-l-o #sidebar_left .sidebar-menu {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
body.sb-l-o #sidebar_left .sidebar-menu > li > a {
    position: relative;
    width: 100%;
    box-sizing: border-box;
}
body.sb-l-o #sidebar_left .sidebar-menu > li > a > .caret {
    right: 12px !important;
}

/* Align responsive branding and content with the theme's 1080px breakpoint. */
body .navbar .navbar-branding {
    display: flex;
    width: 250px !important;
    max-width: 100vw !important;
    align-items: center;
    overflow: visible !important;
}
body .navbar-branding .navbar-brand {
    display: flex !important;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    overflow: hidden;
}
body .navbar-branding #toggle_sidemenu_l {
    display: block !important;
    position: static !important;
    flex: 0 0 40px;
    width: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 60px;
    text-align: center;
    visibility: visible !important;
}
.navbar-branding .im-fx-lockup--topbar { font-size: 20px; white-space: nowrap; }
@media (min-width: 1080px) {
    body.sb-l-o #sidebar_left { width: 230px; }
    body.sb-l-o #content_wrapper { left: 0; margin-left: 230px !important; }
    body.sb-l-m #content_wrapper { left: 0; margin-left: 60px !important; }
}
@media (max-width: 1079px) {
    body.sb-l-o #sidebar_left { position: fixed; left: 0; width: 230px; z-index: 1020; }
    body.sb-l-c #sidebar_left { left: -230px; }
    body.sb-l-o #content_wrapper, body.sb-l-c #content_wrapper { left: 0; margin-left: 0 !important; }
}
