/* TESS core globals and component styles — safe on Inspinia and legacy themes. */

* {
    margin: 0;
}

body {
    /*color: wwhite;   cannot set white, will ruin EXT objects */
    height: 100%;
}

html {
    height: 100%;
}

input, select, textarea {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

body, table, tr, img {
    border: 0px none;
    padding: 0px;
    margin: 0px;
    /*font-family: Calibri,Helvetica, Arial, sans-serif;*/
    /*font-size: 10pt;*/
    /*font-weight: lighter;*/
    line-height: 1.6em;
}

table {
    border-collapse: collapse;
}

a {
    text-decoration: none;
}
.copyright {
    font-size: 8pt;
}

.copyright a {
    color: #01aded;
}

.news a, .news a:visited {
    color: #12a8cd;
    text-decoration: none;
}

.contactform {
    width: 600px;
}

.contactform table tr td {
    padding-bottom: 0px;
    padding-right: 20px;
}

/*
.contactform input, #name, #email {
  width:100%;
  height:20px;
}
*/
.contactform .bottom2 {
    width: 100%;
    padding: 2px;
}

.contactform #submit {
    width: 200px;
    height: 20px;
    background-color: #CCA248;
    border: 0px none;
    /*border-color: #CCA248;*/
}

.contactform textarea {
    width: 100%;
    height: 350px;
    border: 0px none;
    padding: 0px;
    margin-bottom: 0px;
}

.message_ack {
    margin-bottom: 20px;
}

.message_ack td {
    vertical-align: top;
    padding-right: 10px;
}

.searchinput {
    /*color: rgb(255,100,100);*/
    /*font-family: Calibri, Verdana;*/
    font-weight: normal;
    font-size: 15px;
    padding: 5px;
    width: 180px;
    background-color: rgba(150, 150, 150, 0.3);
    border: 1px dashed rgba(50, 50, 50, 0.5);
    border-radius: 0;
}

.searchinput:focus {
    border: 1px solid rgba(50, 50, 50, 1);
    background-color: rgba(150, 150, 150, 0.5);
    box-shadow: 0 1px 2px rgba(20, 20, 20, 0.8) inset;
}

.searchlabel {
    color: #AAAAAA;
    font-family: var(--theme-body-font-family, var(--tess-font-sans));
    font-size: 14px;
}

.searchsubmit {
    border: 1px solid #c3c3c3;
    font-family: var(--theme-body-font-family, var(--tess-font-sans));
    color: #0066CC;
    font-size: 11px;
    background-color: #e4e3e3;
    height: 25px;
}

.logarea {
    font-size: 10px;
}

abbr {
    cursor: help;
    border-bottom: none;
}

img.screen {
    border: solid thin #34334f;

}

.whitetext {
    color: white;
}

.x-form-taskfield {
    color: orange;
    font-size: 200%;
}

.x-form-title {
    color: gray;
    font-size: 200%;
}

.popupDialog {
    position: absolute;
    visibility: hidden;
    background: #444;
    color: black;
    /*    background-image: url('panel.png');*/
    border-top: 2px solid white;
    border-left: 2px solid white;
    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
    padding: 0px;
    text-align: center;
}

.centertable {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

table.statistic td {
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    border: 1px solid #aaa;
}

table.statistic tr.number td {
    text-align: center;
    color: white;
}

table.candidates td {
    color: white;
    padding-left: 5px;
    padding-right: 5px;
    border: 2px solid black;
}

/* contact notes */
table.note {
    margin: 5px 5px 5px 5px;
    border-spacing: 5px;
    border-collapse: separate;
    -moz-border-radius: 9px 9px 9px 9px;
    -webkit-border-radius: 9px 9px 9px 9px;
    -khtml-border-radius: 9px 9px 9px 9px;
    border-radius: 9px 9px 9px 9px;
    color: #444;
    box-shadow: 1px 1px 5px #222, 0 0 0 #000000 inset;
    text-align: left;
}

.note-simple {
    border: 1px solid orange;
    background-color: #FFE437;
}

.note-related {
    opacity: 0.4;
}

.note-phone {
    border: 1px solid lightblue;
    background-color: #88BBFF;
}

.contactnote {
    float: left;
}

.contactnoteinput {
    background-color: #FEB;
    color: black;
    border: 1px orange;
    font-family: inherit;
    padding-left: 4px;
    padding-right: 4px;
    margin-bottom: 5px;
    min-width: 300px;
    min-height: 50px;
}

.contactnoteinput:focus {
    outline: 0;
}

.contactnotemini { /* used in workrecords table */
    background-color: #FFFF65;
    border: 1px solid orange;
    width: 10px;
    height: 10px;
    margin-top: 2px;
    margin-right: 3px;
    float: left;
    box-shadow: 0 0 5px #CCCCCC, 0 0 0 #000000 inset;
}

img.note-simple {
    border: 1px solid orange;
}

img.note-phone {
    border: 1px solid lightblue;
}

img.note {
    width: 32px;
    float: left;
    margin: 0px 3px 3px 0;
    box-shadow: 0 0 5px #CCCCCC, 0 0 0 #000000 inset;
}

table.note-phone th {
    background-color: #BDF;
    border: 1px solid lightblue;
}

table.note-simple th {
    background-color: #FFFF65;
    border: 1px solid orange;
}

table.note th {
    padding: 0px 3px 0px 3px;
    font-weight: normal;
    text-align: left;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -khtml-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
}

table.note td {
    padding: 2px 3px 2px 3px;
    font-size: 100%;
    font-weight: bold;
    -moz-border-radius: 9px 9px 9px 9px;
}

/* contact notes end*/

.qrcode {
    border: 2px solid red;
    margin: 5px;
}

/* AJAX drag-drop file upload */

.drop-area {
    /*    border:2px solid black;*/
    padding: 5px;
    background-size: contain;
    min-height: 20px;
    overflow: auto
}

.drop-area.hover {
    border: 2px dashed red
}

.drop-area div {
    /*    width:150px;*/
    /*    height:150px;*/
    /*    border:1px solid #CCC;*/
    font-size: .8em;
    padding: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    float: left;
    margin: 10px;
    word-wrap: break-word
}

.drop-status {
    /*    background-color:black;*/
    /*    color:white;*/
    /*    padding:5px 20px;*/
    /*    margin-bottom:10px*/
}

.docattachment {
    background-color: grey;
    padding: 2px;
    margin: 3px;
    opacity: 0.8;
    border: 1px solid silver;
    width: content-box;
    text-align: left;
    display: inline-block;
    -moz-border-radius: 6px 6px 3px 3px;
    -webkit-border-radius: 6px 6px 3px 3px;
    -khtml-border-radius: 6px 6px 3px 3px;
    border-radius: 6px 6px 3px 3px;
    -moz-box-shadow: 2px 2px 3px grey;
    -webkit-box-shadow: 2px 2px 3px grey;
    box-shadow: 2px 2px 3px grey;

}

.code { /* NOTE: if this definition is changed, it must also be changed inside tinymce-content.css */
    color: red;
    font-family: var(--tess-font-mono);
}

.keyword { /* NOTE: if this definition is changed, it must also be changed inside tinymce-content.css */
    border-bottom: 1px dashed red;
}

.sborder {
    border: 1px solid #DDDDDD;
    box-shadow: 0 0 5px #CCCCCC, 0 0 0 #000000 inset;
}

.tborder {
    box-shadow: 1px 1px 5px #222, 0 0 0 #000000 inset;
}

.iborder {
    box-shadow: 1px 1px 7px 2px #222 inset;
}

@font-face {
    font-family: 'Armata';
    font-style: normal;
    font-weight: 400;
    src: local('Armata'), local('Armata-Regular'), url(Armata.woff) format('woff');
}

.dhtmlxcalendar_container {
    z-index: 9999;
}

.sshoutput {
    font-size: 90%;
    text-align: left;
    width: 100%;
    line-height: 90%;
}

.bubble {
    border: 2px solid red;
    position: absolute;
    display: none;
    padding: 8px;
    background-color: #EFE;
    font-size: 110%;
    border: 1px solid #AFA;
    box-shadow: 0 0 5px #CCCCCC, 0 0 0 #000000 inset;
    text-align: left;
    line-height: 100%;
    max-width: 200px;
    color: black;
}

.shadowtext {
    text-shadow: 1px 1px #AAA;
}

.niceContact {
    color: inherit;
    line-height: 12px;
    font-family: var(--theme-body-font-family, var(--tess-font-sans));
}

.iosicon {
    border-radius: 12px;
}

.divlink {
    cursor: pointer;
}

.cs_colorBox {
    float: right;
}

.livicon-16 {
    display: inline-block;
    line-height: inherit;
    vertical-align: middle;
    height: 18px !important;
}

.livicon-32 {
    display: inline-block;
    line-height: inherit;
    vertical-align: middle;
    height: 34px !important;
}

.livicon.shadowed {
    -webkit-filter: drop-shadow(1px 1px 0 rgba(50, 50, 50, 0.25));
    filter: drop-shadow(1px 1px 0 rgba(50, 50, 50, 0.25));
}

.clientstatus, .casestatus {
    border: 1px solid #AAA;
    border-radius: 3px;
    padding: 3px;
    line-height: 24px;
}

.phonelocation {
    font-size: 80%;
    color: #666
}

.default_contact_info {
    font-weight: bold;
}

.roundborder {
    text-align: center;
    border: 1px solid #AAA;
    border-radius: 3px;
    padding: 0 2px;
}

.icons {
    width: 32px;
    margin: 5px;
}

.valigned16 {
    vertical-align: middle;
    line-height: 16px;
    height: 16px;
}

.valigned18 {
    vertical-align: middle;
    line-height: 18px;
    height: 18px;
}

.dialogButtonOK {
    background-color: lightgreen !important;
    color: green !important;
}

.dialogButtonCancel {
    background-color: pink !important;
    color: red !important;
}

.tooltip-tess {
    min-width: 1px;
    min-height: 8px;
}

.saturate {
    -webkit-filter: saturate(3);
    filter: saturate(3);
}

img.grayscale {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

img.grayscale:hover {
    filter: none;
    -webkit-filter: grayscale(0%);
}

.contrast {
    -webkit-filter: contrast(160%);
    filter: contrast(160%);
}

.brightness {
    -webkit-filter: brightness(0.25);
    filter: brightness(0.25);
}

.blur {
    -webkit-filter: blur(3px);
    filter: blur(3px);
}

.invert {
    -webkit-filter: invert(100%);
    filter: invert(100%);
}

.sepia {
    -webkit-filter: sepia(100%);
    filter: sepia(100%);
}

.huerotate {
    -webkit-filter: hue-rotate(180deg);
    filter: hue-rotate(180deg);
}

.rss.opacity {
    -webkit-filter: opacity(50%);
    filter: opacity(50%);
}

html,
body {
    height: 100%;
    margin: 0
}

.box {
    /*display: flex;*/
    /*flex-flow: column;*/
    /*overflow-x:auto;*/

    display: flex;
    flex-flow: column;
    min-height: 100vh;
    /*
    overflow-x: hidden;
    overflow-y: visible;
     */
    /*min-width: 880px;*/
}

.box .row {

}

.box .row.header {
    flex: 0 1 auto;
    /* The above is shorthand for:
    flex-grow: 0,
    flex-shrink: 1,
    flex-basis: auto
    */
}

.box .row.content {
    padding-left: 15px;
    margin-right: 15px;
    right: 15px;
    flex: 1 1 auto;
    /*overflow-x: auto;*/ /* removed this to make fixedTableHeader work */
    /* overflow-x: scroll; /* to make page left-right scrollable, esp for mobile; but then it will make the footer visible always */
}
@media (max-width: 767px){
    .box .row.content::-webkit-scrollbar {
        display: none;
    }
}
@media (min-width: 768px){
    .box .row.content::-webkit-scrollbar {
        display: inherit;
    }
}


.box .row.footer {
    padding-left: 0px;
    margin: 0px;
    flex: 0 1 40px;
    position: relative;
}

.benchmarktable > tbody > tr > td {
    padding: 0 5px;
}

.tessbadge {
    font-family:inherit !important;
    line-height:16px !important;
}

/* Bootbox / modal width — set --tess-modal-width on .tessmodal-sized (px); clamped in JS (500–1100). */
.bootbox.modal.tessmodal-sized,
.modal.tessmodal-sized {
    --tess-modal-width: 800px;
    --theme-modal-width: var(--tess-modal-width);
}

.bootbox.modal.tessmodal-sized .modal-dialog,
.modal.tessmodal-sized .modal-dialog {
    width: min(var(--tess-modal-width), 95vw);
    min-width: min(var(--tess-modal-width), 95vw);
    max-width: min(var(--tess-modal-width), 95vw);
}

/* Inspinia 5 zoom-in on .modal-dialog reads as a width jump — keep fade only for bootbox */
.bootbox.modal .modal-dialog {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
}

.bootbox.modal.fade .modal-dialog {
    transform: none !important;
    transition: opacity 0.15s linear;
}

/* Legacy extra-wide popups (was .tessmodal) */
.bootbox.modal.tessmodal-wide .modal-dialog,
.modal.tessmodal-wide .modal-dialog {
    width: min(1200px, 95vw);
    min-width: min(1200px, 95vw);
    max-width: min(1200px, 95vw);
}

/* Plain bootbox without explicit width — closer to old BS3 default than BS5 500px */
.bootbox.modal:not(.tessmodal-sized):not(.tessmodal-wide) .modal-dialog {
    --theme-modal-width: min(600px, 95vw);
}

.bootbox.modal .modal-dialog.modal-lg {
    --theme-modal-width: min(800px, 95vw);
}

.tess-overflow {
    overflow: hidden;
}

.tess-overflow-overlay {
    border: 1px dashed #333;
    background-color: rgba(240,250,220,0.9);
    z-index: 99999;
}

.sales-widget-text{
    margin-top: 3px;
    line-height: 13px;
    opacity:0.5
}

.sales-widget-text:hover {
    color: white;
}

.silver-bg {
    background-color: silver;
    color: #555;
}

.todo-section {
    padding-right:2px;
    display: table-cell;
    white-space: nowrap;
}

.contact-todo-list .tess-todo-item {
    border-left: 3px solid #cbd5e1;
}

.contact-todo-list .tess-todo-item.todo-overdue:not(.todo-completed),
.contact-todo-list .tess-todo-item:has(.todotext-overdue-notdone):not(.todo-completed) {
    border-left: 3px solid var(--tess-text-error, #ed5565);
}

.contact-todo-list .tess-todo-item.todo-today:not(.todo-completed),
.contact-todo-list .tess-todo-item:has(.todotext-today-notdone):not(.todo-completed) {
    border-left: 3px solid #f8ac59;
}

.contact-todo-list .tess-todo-item.todo-completed {
    border-left: 3px solid #1ab394;
}

.tess-ingest-feedback-line {
    margin: 0 0 8px;
    line-height: 1.45;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 4px;
}

.tess-ingest-feedback-line--stacked {
    display: block;
}

.tess-ingest-inline-chip {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    line-height: 1.2;
}

.tess-ingest-inline-chip > span {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

.tess-ingest-inline-chip .dragsource {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
}

.tess-ingest-inline-chip .dragsource > div {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    vertical-align: middle;
}

.minibutton {
    padding: 1px 4px 1px 4px;
}
.flagdiv {
    white-space:nowrap;height:10px;
}

/* Inspinia theme header (engine::layouts.inspinia-theme-header) — in tess-core so rules load with core CSS */
@font-face {
    font-family: 'cjk';
    src: local('STXihei'), local('微软雅黑'), local('Microsoft YaHei');
    unicode-range: U+3000-30FF, U+FF00-FFEF, U+4E00-9FAF;
}

body.tess-inspinia-header-fonts,
body.tess-inspinia-header-fonts table,
body.tess-inspinia-header-fonts tr,
body.tess-inspinia-header-fonts img {
    font-size: 10pt;
    font-family: cjk, 'Gill Sans MT', 'Lucida Grande', 'Century Gothic',
        '微软雅黑', 'Microsoft YaHei', 'Microsoft Yahei',
        STXihei, Arial, helvetica, sans-serif;
    letter-spacing: 0;
}

#not-page-wrapper.tess-page-shell {
    padding: 0;
}

.tess-page-header.row {
    padding: 0;
    margin: 0;
}

#navbar.tess-navbar-collapse {
    height: 50px !important;
}

ul#header-item-pagename_menu_quickmenu.tess-nav-main-left {
    display: inline-block;
}

#header-item-pagename_menu_quickmenu .tess-nav-page-icon {
    max-height: 32px;
    padding: 0;
}

.tess-nav-menu-link {
    padding-top: 5px;
    padding-bottom: 5px;
}

.tess-nav-menu-link--nowrap {
    padding-top: 5px;
    padding-bottom: 5px;
    white-space: nowrap;
}

.tess-nav-menu-btn {
    margin: 3px;
    padding: 9px 5px 9px 5px;
}

#header-item-pagename_menu_quickmenu .tess-nav-menu-icon {
    max-height: 28px;
}

.tess-nav-dropdown {
    padding-top: 2px;
}

#header-item-pagename_menu_quickmenu li.quickmarker .tess-quickmenu-link {
    display: inline;
}

#header-item-pagename_menu_quickmenu li.quickmarker .tess-quickmenu-icon {
    max-height: 18px;
    padding: 0;
}

.header-item-logininfo-wrap {
    margin-top: 5px;
    display: inline-block;
    float: left;
}

.header-item-logininfo-user {
    float: left;
    height: 50px;
    padding-right: 10px;
}

.header-item-logininfo-user p,
.header-item-logininfo-cell {
    display: table-cell;
    height: 50px;
    vertical-align: middle;
}

/* Beat .top-navigation .nav > li > a { padding: 15px 20px } — must match former inline styles */
.top-navigation #header-item-logininfo.navbar-top-links > li > a.count-info.tess-nav-count-info {
    float: left;
    padding: 18px 0 0 0;
    width: 26px;
    margin-right: 0;
    min-height: 50px;
}

.top-navigation #header-item-logininfo.navbar-top-links > li > a.count-info.tess-nav-count-info--settings {
    float: left;
    padding: 18px 2px 0 0;
    width: auto;
    margin-right: 0;
    min-height: 50px;
}

.top-navigation #header-item-logininfo.navbar-top-links > li > a.count-info.tess-nav-count-info--logout {
    float: left;
    padding: 18px 0 0 0;
    width: auto;
    margin-right: 0;
    min-height: 50px;
}

.header-item-logininfo-mini-panel {
    position: absolute;
    top: 60px;
}

.header-item-logininfo-mini-user {
    display: table-cell;
    height: 50px;
    vertical-align: middle;
    width: 150px;
}

.tess-nav-count-info--mini {
    padding: 20px 10px;
    position: relative;
}

.tess-nav-count-info-label {
    position: absolute;
}

.header-item-logininfo-mini-actions {
    margin: 5px auto;
    width: 50px;
    position: relative;
}

.header-item-logininfo-mini-actions a.tess-float-left {
    float: left;
}

.header-item-logininfo-mini-actions a.tess-float-right {
    float: right;
}

.header-item-logininfo-mini-lang {
    position: relative;
    margin: 30px auto 0 auto;
}

.tess-main-content.row {
    display: block;
}

/* Side panel layout (Inspinia) — flex on #ins; legacy table rules kept for non-Inspinia */
.sidepanel-layout-table,
.sidepanel-layout-flex {
    width: 100%;
    min-height: 92vh;
    --tess-sidepanel-bg: #3f5060;
    --tess-sidepanel-fg: #ccc;
    --tess-sidepanel-muted: #a7b1c2;
    --tess-sidepanel-button-bg: #2f4050;
    --tess-sidepanel-button-hover-bg: #335566;
    --tess-sidepanel-button-active-bg: #446677;
}

.sidepanel-layout-table {
    table-layout: fixed;
}

.sidepanel-layout-flex {
    display: flex;
    align-items: stretch;
}

.sidepanel-layout-flex .sidepanel {
    flex: 0 0 auto;
}

.sidepanel-layout-flex .sidepanelmainpart {
    flex: 1 1 auto;
    min-width: 0;
}

.sidepanel-layout-table .sidepanel,
.sidepanel-layout-flex .sidepanel {
    padding: 0 0 30px 0;
    vertical-align: top;
    background-color: var(--tess-sidepanel-bg);
    color: var(--tess-sidepanel-fg);
}

.sidepanel-layout-table .sidepanelmainpart,
.sidepanel-layout-flex .sidepanelmainpart {
    vertical-align: top;
    text-align: center;
    padding-left: 5px;
    padding-top: 5px;
    border-top: 0 solid var(--tess-sidepanel-fg);
}

.sidepanel-layout-table .sidepanelseparator,
.sidepanel-layout-flex .sidepanelseparator {
    height: 1px;
    margin-top: 6px;
    margin-bottom: 6px;
}

.sidepanel-layout-table .sidepanelgroup,
.sidepanel-layout-flex .sidepanelgroup {
    margin-top: 0;
    margin-bottom: 10px;
}

.sidepanel-layout-flex .sidepanelgroup-sub {
    border-left: 2px solid var(--tess-text-highlight, #1ab394);
    margin: 4px 6px 8px 12px;
    opacity: 0.95;
}

.sidepanel-layout-flex .sidepanelgroup-sub > .sidepanelgrouphead {
    font-size: 92%;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding-left: 8px;
    text-transform: none;
}

.sidepanel-layout-flex .sidepanelgroup-sub .sidepanelbutton,
.sidepanel-layout-flex .sidepanelgroup-sub .sidepanellink_sub {
    padding-left: 12px;
}

.sidepanel-layout-table .sidepanelgrouphead,
.sidepanel-layout-flex .sidepanelgrouphead {
    text-align: left;
    overflow: hidden;
    cursor: pointer;
    font-weight: bold;
    font-size: 100%;
    padding: 5px;
    color: var(--tess-sidepanel-muted);
}

.sidepanel-layout-table .sidepanelbutton,
.sidepanel-layout-flex .sidepanelbutton {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    margin: 0;
    text-align: left;
    overflow: hidden;
    border-left: 2px solid var(--tess-text-highlight, #1ab394);
    border-right: 2px solid transparent;
    background-color: var(--tess-sidepanel-button-bg);
    color: var(--tess-sidepanel-muted);
    box-sizing: border-box;
}

.sidepanel-layout-table .sidepanelbuttonlink:focus,
.sidepanel-layout-flex .sidepanelbuttonlink:focus {
    outline: 0;
}

.sidepanel-layout-flex .sidepanelbuttonlink {
    display: block;
    text-decoration: none;
    color: inherit;
}

/* Flex buttons: padding-left on <table> is ignored by browsers; on <div> it is real.
   Zero it out here and let the icon cell provide the indentation. */
.sidepanel-layout-flex .sidepanelbutton,
.sidepanel-layout-flex .sidepanellink_sub {
    display: flex;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
}

.sidepanel-layout-table .sidepanelbuttonicon,
.sidepanel-layout-flex .sidepanelbuttonicon {
    min-width: 5px;
    text-align: center;
    vertical-align: middle;
    padding-left: 3px;
    padding-right: 3px;
    color: inherit;
}

.sidepanel-layout-flex .sidepanelbuttonicon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sidepanel-layout-table .sidepanelbutton:hover,
.sidepanel-layout-flex .sidepanelbutton:hover,
.sidepanel-layout-flex .sidepanelbuttonlink:hover > .sidepanelbutton:not(.sidepanelbuttonactive) {
    background-color: var(--tess-sidepanel-button-hover-bg);
    color: #fff;
    border-right: 2px solid var(--tess-text-highlight, #1ab394);
    border-left: 2px solid #fff;
}

.sidepanel-layout-table .sidepanelbuttonactive,
.sidepanel-layout-flex .sidepanelbuttonactive {
    background-color: var(--tess-sidepanel-button-active-bg);
    border: 2px solid var(--tess-text-highlight, #1ab394);
    color: #fff;
}

.sidepanel-layout-table .sidepanelbuttontext,
.sidepanel-layout-table .sidepanellink_subtext,
.sidepanel-layout-flex .sidepanelbuttontext,
.sidepanel-layout-flex .sidepanellink_subtext {
    width: 100%;
    font-weight: normal;
    overflow: hidden;
    height: 100%;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 5px;
    color: var(--tess-sidepanel-muted);
}

.sidepanel-layout-flex .sidepanelbuttontext,
.sidepanel-layout-flex .sidepanellink_subtext {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    color: inherit;
}

.sidepanel-layout-flex .sidepanelbuttonlabel {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidepanel-layout-flex .sidepanelbuttonbadges {
    flex: 0 0 auto;
    margin-left: auto;
    white-space: nowrap;
    line-height: 1;
    vertical-align: middle;
}

.sidepanel-layout-table .sidepanellink_subtext,
.sidepanel-layout-flex .sidepanellink_subtext {
    font-size: 90%;
    line-height: 97%;
}

.sidepanel-layout-table .sidepanellink_sub,
.sidepanel-layout-flex .sidepanellink_sub {
    background-color: var(--tess-sidepanel-button-bg);
    color: var(--tess-sidepanel-muted);
    width: 97%;
    margin-left: 3%;
    height: 20px;
}

.sidepanel-layout-table .sidepanellink_sub:hover,
.sidepanel-layout-flex .sidepanellink_sub:hover,
.sidepanel-layout-flex .sidepanelbuttonlink:hover > .sidepanellink_sub:not(.sidepanelbuttonactive) {
    background-color: var(--tess-sidepanel-button-hover-bg);
    color: #fff;
    border-right: 1px solid var(--tess-text-highlight, #1ab394);
}

.sidepanel-layout-table .sidepanelrighticon,
.sidepanel-layout-flex .sidepanelrighticon {
    float: right;
    padding: 3px;
}

.sidepanel-main-inner {
    min-height: 600px;
}

.sidepanel-toggle {
    position: relative;
    height: 0;
    padding: 0 15px;
    width: 100px;
    top: -50px;
    z-index: 9999;
    color: var(--tess-text-warning, #E29E38);
    font-size: 20px;
    opacity: 1;
}

.tess-missing-page-button {
    float: left;
    padding: 10px;
}

.tess-command-output {
    background-color: white;
    color: black;
}

/* P1 — theme token consumers (body vars from Theme::getThemeCssVariablesInline()) */
body.tess-theme-body {
    background-color: var(--tess-background);
    color: var(--tess-text);
    font-family: var(--theme-body-font-family, var(--tess-font-sans));
    font-size: var(--theme-body-font-size, var(--tess-font-size-base));
    font-weight: var(--theme-body-font-weight, var(--tess-font-weight-normal));
    line-height: var(--theme-body-line-height, var(--tess-line-height-base));
}

/* Tooltips/popovers append to body — use Inspinia5 body font when loaded */
.tooltip,
.tooltip .tooltip-inner,
.bs-tooltip,
.bs-tooltip .tooltip-inner,
.ui-tooltip,
.qtip,
.qtip-content,
.tooltipster-content {
    font-family: var(--theme-body-font-family, var(--tess-font-sans));
    font-size: var(--tess-font-size-sm);
    line-height: var(--theme-body-line-height, var(--tess-line-height-base));
}

.popover,
.popover-header,
.popover-body {
    font-family: var(--theme-body-font-family, var(--tess-font-sans));
    font-size: var(--tess-font-size-sm);
    line-height: var(--theme-body-line-height, var(--tess-line-height-base));
}

td {
    color: var(--tess-text);
}

.sidepanellink {
    color: var(--tess-text-widget);
    background-color: var(--tess-background-widget);
}

.footer-td {
    color: var(--tess-text-footer);
}

.progressDiv {
    filter: alpha(opacity=80);
    opacity: 0.8;
    margin: 0;
    padding: 0;
    left: 0;
    top: 0;
    position: absolute;
}

/* xmlreq slow-response dialog — above progressDiv (inline z-index 9999) */
.bootbox.modal.tess-xmlreq-timeout-dialog {
    z-index: 10050 !important;
}

.modal-backdrop.tess-xmlreq-timeout-backdrop {
    z-index: 10040 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary {
    color: #fff;
    background-color: var(--tess-text-highlight);
    border-color: var(--tess-text-highlight);
}

.input-group.note-editor .input-group-btn .tess-search-go-btn,
.input-group.note-editor .input-group-btn .tess-search-help-btn {
    height: 30px;
    line-height: 1;
}

.input-group.note-editor .input-group-btn .tess-search-help-btn {
    background-color: #fff;
    border: 1px solid #d1dade;
    color: #676a6c;
    font-weight: 600;
    min-width: 30px;
}

.sk-spinner-wave div {
    background-color: var(--tess-text-highlight);
}

.pace .pace-progress {
    background: var(--tess-text-highlight);
}

.divlink:hover {
    color: var(--tess-text-highlight) !important;
}

.contacticon {
    border: 1px solid var(--tess-text-highlight);
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
}

.bootbox.modal-backdrop {
    z-index: 3040 !important;
}

.bootbox.modal {
    z-index: 3050 !important;
}

.bootbox.modal,
.modal {
    --theme-modal-header-padding-y: 0.5rem;
    --theme-modal-header-padding-x: 1rem;
    --theme-modal-header-padding: 0.5rem 1rem;
}

.bootbox.modal .modal-content,
.modal .modal-content {
    background-color: var(--tess-background-td1, #fff);
    border: 1px solid var(--tess-background-th, #e7eaec);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.bootbox .formdiv,
.bootbox .formtable,
.bootbox .tess-form-bootstrap-rows,
.jqmWindow.jqmodal-dialog-div .formdiv,
.jqmWindow.jqmodal-dialog-div .formtable,
.jqmWindow.jqmodal-dialog-div .tess-form-bootstrap-rows {
    font-size: var(--theme-body-font-size, var(--tess-font-size-base, 0.813rem));
    line-height: var(--theme-body-line-height, var(--tess-line-height-base, 1.5));
}

/* Popup forms: inline form width is content width — do not add formdiv padding/margin outside the modal */
.bootbox .formdiv,
.jqmWindow.jqmodal-dialog-div .formdiv {
    background: transparent;
    box-shadow: none;
    box-sizing: border-box;
    margin: 0;
    max-width: 100%;
    padding: 0;
    width: 100% !important;
}

.bootbox .formtable,
.jqmWindow.jqmodal-dialog-div .formtable {
    box-sizing: border-box;
    margin: 0;
    max-width: 100%;
    width: 100%;
}

.bootbox .formdiv form,
.jqmWindow.jqmodal-dialog-div .formdiv form {
    max-width: 100%;
}

.bootbox .formlabel,
.bootbox .formfield,
.bootbox .niceCombo,
.bootbox .niceComboText,
.bootbox .popupinput,
.bootbox .popupinput-simple,
.jqmWindow.jqmodal-dialog-div .formlabel,
.jqmWindow.jqmodal-dialog-div .formfield,
.jqmWindow.jqmodal-dialog-div .niceCombo,
.jqmWindow.jqmodal-dialog-div .popupinput,
.jqmWindow.jqmodal-dialog-div .popupinput-simple {
    font-size: inherit;
    line-height: inherit;
}

.bootbox .popupinput,
.bootbox .popupinput-simple,
.jqmWindow.jqmodal-dialog-div .popupinput,
.jqmWindow.jqmodal-dialog-div .popupinput-simple {
    min-height: 0;
}

/* Bootbox uses .bootbox-close-button.close (BS3); button.css styles all <button> — reset and top-right align */
.bootbox.modal .modal-header,
.modal .modal-header {
    align-items: center;
    display: flex;
    gap: 0.25rem;
    min-height: 0;
    padding: 0.5rem 1rem;
}

.bootbox.modal .modal-header .modal-title,
.modal .modal-header .modal-title {
    flex: 1 1 auto;
    font-size: var(--theme-body-font-size, var(--tess-font-size-base, 0.813rem));
    font-weight: 600;
    line-height: 1.25;
    margin: 0;
    min-width: 0;
}

.bootbox.modal .modal-header .bootbox-close-button,
.bootbox.modal .modal-header .bootbox-close-button.close,
.modal .modal-header .btn-close,
.modal .modal-header button.close {
    -webkit-appearance: none;
    appearance: none;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0.25rem;
    box-shadow: none !important;
    color: #676a6c;
    cursor: pointer;
    display: block;
    flex: 0 0 auto;
    float: none;
    font-size: 1.125rem;
    font-weight: 700;
    height: auto;
    line-height: 1;
    margin: 0 0 0 auto !important;
    min-width: 0;
    opacity: 0.65;
    padding: 0.125rem 0.25rem !important;
    position: static;
    width: auto;
}

.modal .modal-header .btn-close {
    height: 0.65rem;
    padding: 0;
    width: 0.65rem;
}

.bootbox.modal .modal-header .bootbox-close-button::after,
.bootbox.modal .modal-header .bootbox-close-button:after {
    content: none !important;
    display: none !important;
}

.bootbox.modal .modal-header .bootbox-close-button:hover,
.bootbox.modal .modal-header .bootbox-close-button:focus,
.modal .modal-header .btn-close:hover,
.modal .modal-header .btn-close:focus,
.modal .modal-header button.close:hover,
.modal .modal-header button.close:focus {
    background-color: transparent !important;
    color: #676a6c;
    opacity: 1;
    outline: none;
}

.bootbox .modal-footer .btn .tess-btn-icon-leading,
.bootbox .modal-footer .btn i.fa,
.bootbox .modal-footer .btn i.far,
.bootbox .modal-footer .btn i.fas {
    margin-right: 0.35em;
}

a.btn:not(.tess-btn-icon-leading):not(.tess-nicetable-inline-btn) > i:first-child:not(:only-child),
button.btn:not(.tess-btn-icon-leading):not(.tess-nicetable-inline-btn) > i:first-child:not(:only-child) {
    margin-right: 0.35em;
}

.btn.tess-btn-icon-leading {
    align-items: center;
    display: inline-flex;
    gap: 0.35em;
}

.bootbox .modal-footer .btn,
.bootbox .modal-footer button {
    border-style: solid;
    border-width: 1px;
}

#navidiv.tess-nav-popup {
    opacity: 0.9;
    background-color: var(--tess-background-widget);
    top: -100px;
    position: absolute;
    z-index: 999;
    -moz-box-shadow: 3px 3px 3px 3px var(--tess-text-shadow);
    -webkit-box-shadow: 3px 3px 3px 3px var(--tess-text-shadow);
    box-shadow: 5px var(--tess-text-shadow);
}

.tess-boxwidget-head {
    background-color: rgba(220, 220, 220, 0.8);
}

.tess-boxwidget-title {
    color: var(--tess-text-color, var(--tess-text, #666));
}

.dashboard-header .set-sub-color-1 a,
.dashboard-header .set-sub-color-1 a:hover,
.dashboard-header .set-sub-color-1 a:active {
    color: #fff;
}

.dashboard-header .set-sub-color-1 a:hover {
    color: #e8f8f4;
}

.tess-log-file-viewer,
.tess-license-file-content {
    text-align: left;
    overflow-x: auto;
}

.tess-itp-identity-table {
    margin: 0 auto;
}

.tess-log-search-syntax {
    margin: 0 auto 0 5px;
}

.tess-punchcard-missing-push-form {
    text-align: center;
}

.tess-punchcard-roster-actions {
    margin-top: 1rem;
}

.tess-punchcard-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
    margin: 1.5rem auto;
}

.tess-punchcard-btn {
    width: 200px;
    height: 150px;
    text-align: center;
}

.tess-punchcard-btn-label {
    font-size: 20px;
    font-weight: bold;
}

.tess-punchcard-notices {
    margin-bottom: 1rem;
}

.tess-page-notice {
    margin: 1rem 0;
}

.tess-form-bootstrap-rows {
    padding: 0.5rem 1rem 0;
    max-width: 640px;
    margin: 0 auto;
    font-size: var(--theme-body-font-size, var(--tess-font-size-base, inherit));
    line-height: var(--theme-body-line-height, var(--tess-line-height-base, 1.5));
}

.bootbox .tess-form-bootstrap-rows,
.jqmWindow.jqmodal-dialog-div .tess-form-bootstrap-rows {
    max-width: 100%;
}

.tess-form-row-bootstrap .formlabel {
    font-size: inherit;
    margin-bottom: 0;
}

.tess-form-row-bootstrap .popupinput,
.tess-form-row-bootstrap .popupinput-simple {
    font-size: var(--theme-font-size-base, inherit);
}

.tess-form-row-bootstrap {
    align-items: center;
    margin-bottom: 0.35rem;
}

.tess-form-row-bootstrap:has(textarea) {
    align-items: flex-start;
}

.tess-form-row-bootstrap:has(textarea) .formlabel {
    padding-top: 0.45rem;
}

.tess-form-row-bootstrap .formfield {
    padding: 5px;
    min-height: 0; /* flex col-* must not grow to fit absolutely positioned combo lists */
}

.tess-form-row-bootstrap .formfield .niceCombo {
    position: relative;
}

.tess-form-row-bootstrap .popupinput-simple {
    max-width: 100%;
}

.tess-form-row-bootstrap .formfield textarea.popupinput-simple {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
}

.tess-form-row-bootstrap .formfield .mce-tinymce,
.tess-form-row-bootstrap .formfield .tox-tinymce {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
}

.tess-form-checkbox-inline {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.35rem;
    text-align: left;
    padding: 5px;
    line-height: 1;
}

.tess-form-checkbox-inline input[type="checkbox"] {
    margin: 0;
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    vertical-align: middle;
}

.tess-form-checkbox-inline label.formlabel.formlabel-checkbox {
    margin: 0 !important;
    padding: 0;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
}

.tess-page-notice-extra {
    margin-top: 0.75rem;
}

.tess-page-content {
    text-align: left;
}

.tess-innodb-status-pre {
    text-align: left;
    white-space: pre-wrap;
    word-break: break-word;
}

.tess-stacked-section + .tess-stacked-section {
    margin-top: 1.5rem;
}

.tess-devel-api-list {
    text-align: left;
    padding: 20px;
}

.tess-devel-build-server-link {
    margin: 1rem 0;
}