body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12pt;
  font-weight: normal;
  color: #000000;
}
#clientBodyMain .card-body.hmSeparators hr {
  margin-left: calc(var(--bs-card-spacer-x) * -1);
  margin-right: calc(var(--bs-card-spacer-x) * -1);
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
/** 
  used to prevent body from scrolling on modal open
  ref https://stackoverflow.com/questions/55241028/prevent-body-from-scrolling-when-modal-open-and-jump-to-top/55243791#55243791
*/
.no-scroll{
    overflow: hidden;
}

/** special borders to make sticky table headers work */
table.hmStickyTableHeader {
  border-collapse: separate;
  border-spacing: 0;
}
table.hmStickyTableHeader thead {
  position: sticky;
  top: 0;
  background-color: #EEEEEE;
}
table.hmStickyTableHeader thead th {
  border-top: none;
  border-left: 1px solid black;
  border-bottom: 1px solid black;
  border-right: none;
}
table.hmStickyTableHeader thead tr:first-child th {
  border-top: 1px solid black;
}
table.hmStickyTableHeader thead th:last-child {
  border-right: 1px solid black;
}

/** for now, must also have hmStickyTableHeader to fix the borders */
table.hmStickyTableFirstCol th:first-child, table.hmStickyTableFirstCol td:first-child {
  position: sticky;
  left: 0;
  background-color: #EEEEEE;
}
table.hmStickyTableHeader.tablesorter tr th {
  font-size: 12pt;
}
table.hmStickyTableHeader.tablesorter tr td {
  font-size: 12pt;
  border: 1px solid #ccc;
}

.prevent-select {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

.errorMessage {
  font-weight: bold;
  color: red;
}
.errorDiv {
  font-weight: bold;
  color: red;
  border: 2px solid red;
  padding: 2px;
}
.errorDivInline {
  font-weight: bold;
  color: red;
  border: 2px solid red;
  padding: 2px;
  display: inline-block;
}
.warningDivInline {
  font-weight: bold;
  color: orange;
  border: 2px solid orange;
  padding: 2px;
  display: inline-block;
}
.editError, .form-control.editError:focus {
  background: red;
  color: white;
}
.editError::-webkit-input-placeholder { /* WebKit, Blink, Edge */
   color:    black;
}
.editError:-moz-placeholder { /* Mozilla Firefox 4 - 18 */
   color:    black;
}
.editError::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    black;
}
.editError:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    black;
}
.editError::-ms-input-placeholder { /* Microsoft Edge */
   color:    black;
}
.okMsg {
  position: absolute;
  background-color: darkolivegreen;
  color: white;
  z-index: 100000;
  padding: 2px;
  text-align: center;
}
.okDiv {
  background-color: darkolivegreen;
  color: white;
}
.unsaved {
  background-color: orange;
}
.warning {
  background-color: yellow;
}
.warningMessage {
  font-weight: bold;
  color: orange;
}
.notice {
  font-weight: bold;
}
.noticeDiv {
  font-weight: bold;
  border: 2px solid black;
  padding: 2px;
}
.noticeDivInline {
  font-weight: bold;
  border: 2px solid black;
  padding: 2px;
  display: inline-block;
}
.instructions {
  
}

.hidden {
  display: none;
}
.rel {
  position: relative;
}
.nobr {
  white-space: nowrap;
}
.noline {
  text-decoration: none;
}
.hmDraggable {
  cursor: grab;
}
.custFlagWarn {
  color: red;
  margin-left: 0.25em;
}
.custFlagWarnSep {
  color: red;
}

#moreOptionsMenuDiv {
  z-index: 100;
  position: absolute;
  top: 2em;
  left: 0;
  border: 5px solid #966233;
  box-shadow: 5px 5px 5px #EB9950;
}

#topNav {
  position: relative;
  padding: 0.5em;
  border-bottom: 1px solid #0881D8;
}
#topNav .clientInfo {
  display: inline-block;
  padding-right: 3px;
}
#topNav .appInfo {
  display: inline-block;
  border-left: 1px dashed #0881D8;
  padding-left: 6px;
  width: 100%;
}
#mainClientSearch {
  float: right;
}
#topNav .appInfo .line1 {
  font-weight: bold;
}
#topNav .links {
  float: right;
}
#topNav .links .linkSection {
  text-align: right;
}
#topNav .links a {
  margin-left: 0.5em;
}
#clientBodyWrapper {
  min-height: 600px;
}
#clientBodyWrapperPopup {
  
}
#clientBodyMain {
  padding: 0.5em;
  position: relative;
}
#clientFooter {
  padding: 0.5em;
  border-top: 1px solid #0881D8;
}
#clientFooter img {
  vertical-align: middle;
}
#clientFooter .priv {
  float: right;
  font-size: smaller;
}
#clientFooter .hostname {
  font-size: smaller;
  margin-left: 2em;
}
#dashboardLinks .app {
  font-weight: bold;
}
#dashboardLinks a {
  display: inline-block;
  margin-left: 1em;
  padding: 2px;
}
#dashboardLinks .changelog a {
  display: inline;
  margin-left: auto;
  padding: 0;
}
.changelog div {
  margin-bottom: 1em;
}
.changelog .changeLogDate {
  background-color: lightgray;
  padding: 2px;
}
.changelog .title {
  font-weight: bold;
}
#popupTitle {
  background-color: #966233;
  color: white;
  text-align: center;
  font-weight: bold;
}
#nextPageArea {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
}
.section {
  border: 1px solid #999999;
  padding: 0.5em;
  display: inline-block;
  vertical-align: top;
}
.section .title {
  background-color: #966233;
  color: white;
  text-align: center;
  font-weight: bold;
  margin: -0.5em -0.5em 0.5em -0.5em;
  padding: 0 2px 0 2px;
}
.section .title2 {
  background-color: #0A85FF;
}
.section .subtitle {
  background-color: #966233;
  color: white;
  text-align: center;
  font-weight: bold;
  margin: 0.5em -0.5em 0.5em -0.5em;
  padding: 0 2px 0 2px;
}
.section .subtitle2 {
  background-color: #A3CAF1;
}
.section .titleCaption {
  margin-top: -0.5em;
}
.sectionLeft {
  float: left;
  margin-right: 1em;
}
.stacked {
  margin-bottom: 1em;
}
.buttonsTop {
  margin-bottom: 0.5em;
}
.sectionSep {
  clear:  both;
  height: 0.5em;
}
.spacerVert {
  margin-top: 0.5em;
}
.sectionSmall {
  border: 1px solid #999999;
  padding: 0;
  display: inline-block;
  vertical-align: top;
}
.block {
  display: block;
}
.custEmphasize {
  color: #007100;
}
.iblock {
  display: inline-block;
}
table.topper tr td {
  vertical-align: top;
}
.labelCell {
  text-align: right;
  padding-right: 0.5em;
}
.bottomMarg {
  margin-bottom: 0.5em;
}
.topMarg {
  margin-top:0.5em;
}
.topMargLarge {
  margin-top:1em;
}
.leftMarg {
  margin-left: 0.5em;
}
.leftMargBig {
  margin-left: 1.5em;
}
.rightMarg {
  margin-right: 0.5em;
}
.cb {
  clear:  both;
}
.top {
  vertical-align: top;
}
.buttonsRight {
  display: inline-block;
  vertical-align: top;
  margin-left: 1em;
}
.buttonsRight button {
  display: block;
  margin-top: 0.5em;
}

.formSubmitOuter {
  margin-top: 0.5em;
}
.formSubmitOuter button {
  margin-right: 1em;
}
.formSubmitOuterBottom {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #333; 
  color: white;
  padding: 10px;
  text-align: center;
  z-index: 1000;
}
.formSubmitOuterBottom a {
  color: white;
}
.formSubmitOuterBottom a:hover {
  color: lightblue;
}

.formInputLabel {
  margin-top: 0.5em;
}

.formInput.vertical label {
  display: block;
  margin-bottom: 0.5em;
}

.reportParm option {
  font-family: monospace;
}

.editableField {
  background-color: rgba(0, 255, 0, 0.1);
  cursor: pointer;
}

table.t1 {
  border-collapse: collapse;
}
table.t1 tr td,th {
  border: 1px solid black;
  padding: 3px;
  vertical-align: top;
}
table.t1 tr th {
  background-color: #CCCCCC;
}
table.t1.tablesorter tr th {
  padding-right: 20px;
  font-size: 12pt;
}
table.t1.tablesorter tr td {
  font-size: 12pt;
}
table.t1 tr.summary td {
  font-weight: bold;
}
table.t1 tr.emphasize td {
  font-style: italic;
}
table.t1 tr td.num {
  text-align: right;
}
table.t1 tr td.center {
  text-align: center;
}
table.t1 tr:nth-child(odd) {
  background-color: #C0F6FF;
}
table.t1.nostripe tr:nth-child(odd) {
  background-color: inherit;
}
table.t1 tr.selected {
  background-color: rgba(150, 98, 51, 0.5);
}
table.t1 tr th.selected {
  background-color: rgba(150, 98, 51, 0.5);
}
table.t1 tr td.selected {
  background-color: rgba(150, 98, 51, 0.5);
}
table.t1 tr.disabled {
  color: #666666;
}
table.t1.nostripe tr.odd {
  background-color: #C0F6FF;
}
table.t1 tr.pointer {
  cursor: pointer;
}
.nostripe {
  background-color: white;
}

table.tbForm {
  border-collapse: collapse;
}
table.tbForm tr.labels td {
  font-weight: bold;
  text-align: left;
  padding-right: 0.5em;
}
table.tbForm tr.inputs td {
  font-weight: bold;
  text-align: left;
  padding-right: 0.5em;
}

table.lblNum tr td {
  text-align: right;
}
table.lblNum tr.summ {
  font-weight: bold;
}
.pointer {
  cursor: pointer;
}
.normal {
  font-weight: normal;
}

.canceled {
  color: #C00000; 
  font-weight: bold;
}
.canceledInList {
  text-decoration: line-through;
}
.dueCredit {
  color: #009000;
}
.dueDue {
  color: #C00000; 
  font-weight: bold;
}
.orderDetailSummary span {
  margin-right: 1em;
  white-space: nowrap;
}

#reportMain {
  position: fixed;
  top: 50px;
  left: 200px;
  background: white;
  z-index: 100;
}
.reportListCategory {
  font-weight: bold;
  text-transform: capitalize;
}
.reportListReport {
  margin-left: 1em;
  margin-top: 0.25em;
}

.partnerSelect {
  white-space: nowrap;
  display: inline-block;
  margin-right: 1em;
  margin-bottom: 1em;
}

table.heEdit tr td {
  vertical-align: top;
}
.heEditDate {
  width: 100%;
  text-align: right;
  color: #666666;
}

.heEditLink.finalized {
  font-weight: bold;
}

.imgMgrFileOuterDir {
  font-weight: bold;
}
.imgMgrFileOuterFile {
  
}
.imgMgrFileNew {
  background-color: yellow;
}
.imgMgrImgLink {
  text-decoration: underline dotted;
}
.imgMgrUp {
  font-weight: bold;
  margin-bottom: 1em;
}
.imgMgrThumb {
  margin-left: 1em;
}
.imgMgrThumb img {
  vertical-align: middle;
}

/** jQuery UI overrides */
.ui-tabs .ui-tabs-panel {
  padding: 0.5em 1em 0.5em 0;
}
.myTabs .ui-widget-header {
  background: none;
  border: 1px solid #0669B3;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
  padding: 0.1em 0.5em;
}
.ui-widget {
  font-family: inherit;
  font-size: inherit;
}

.prodEditPreview {
  border: 1px solid black;
  padding: 0.5em;
  margin-left: 510px;
}
.prodEditInputLeft {
  float: left;
  width: 500px;
}
.prodEditInputLeft textarea {
  width: 95%;
}
.hhBold {
  font-weight: bold;
}
.hmItalics {
  font-style: italic;
}
.productSku {
  cursor: grab;
}
.prodEditImgPreview img {
  max-width: 100px;
  max-height: 100px;
}

#catProductList li {
  cursor: grab;
  margin-bottom: 0.5em;
}

table.t1 tr td.prodEditImgRemoveCell {
  text-align: center;
  padding-top: 1em;
}
tr.prodEditImgRow {
  cursor: grab;
}

.assetEditFolderName {
  font-weight: bold;
}
.assetEditFile, .assetAddFile {
  margin-left: 2em;
  margin-bottom: 0.5em;
}
.assetAddFolder {
  margin-bottom: 0.5em;
}
.assetEditFileList .assetEditFile {
  cursor: grab;
}
.assetEditFolder {
  cursor: grab;
}

.hmLossCodeName, .hmHowHeardDesc {
  cursor: pointer;
}

tr.hmLossReportRow {
  cursor: pointer;
}
tr.hmLossReportRow.selected {
  background-color: #333333;
}

.allocBulkSkuOuter {
  border-bottom: 1px solid black;
  margin-top: 1em;
  padding-bottom: 1em;
}
.allocBulkSkuOuter .info {
  font-weight: bold;
}
.allocBulkSkuBreedOuter {
  margin-left: 1em;
}

#asmtAllocBulkTable {
  border-collapse: collapse;
}
#asmtAllocBulkTable th {
  border: 1px solid black;
  background-color: #966233;
  color: white;
}
#asmtAllocBulkTable td {
  border: 1px solid black;
  padding: 2px;
}
#asmtAllocBulkTable td.info {
  font-weight: bold;
}
#asmtAllocBulkTable td.num {
  text-align: right;
}

#bugReportOuter {
  position: fixed;
  bottom: 20px;
  right: 20px;
}
#bugDialogPopup {
  display: none;
  position: absolute;
  background-color: white;
  z-index: 2000;
  box-shadow: 10px 10px 5px #888888;
  max-width: 500px;
}
#bugDialogPopup textarea {
  width: 90%;
}

.alert-slim {
  padding: 4px;
  margin-bottom: 0;
}
.alert-very-slim {
  padding: 2px;
  margin-bottom: 0;
}
.alert-inline {
  display: inline-block;
}
.btn-small {
  padding: 2px;
}

.hmHelpIcon {
  display: inline;
  margin-left: 0.5em;
}
.hmHelpIcon.close {
  margin-left: 0;
}

#hmFooterRemoveExtraCss {
  margin-left: 0.5em;
}

.mmAjaxSpinner {
  margin-right: 6px;
}

.hmTableStickyHeader thead {
  position:sticky;
  top: 0;    
  background-color: #CCCCCC;
  color: black;
}

/** web chat */
.hmChatWindow {
  height: 70vh;
}
.hmChatWindowMessageOuter .hmChatWindowMessageHeader {
  font-weight: bold;
  margin-bottom: -0.4em;
}
.hmChatWindowMessageOuter.out .hmChatWindowMessageHeader {
  color: blue;
}
.hmChatWindowMessageOuter.in .hmChatWindowMessageHeader {
  color: darkcyan;
}

.hmChatWindowMessageOuter.out.SMS.delivered .hmChatWindowMessageBody,
.hmChatWindowMessageOuter.out.SMS.chat_closed .hmChatWindowMessageBody{
  color: black;
}
.hmChatWindowMessageOuter.out.SMS.sent .hmChatWindowMessageBody,
.hmChatWindowMessageOuter.out.SMS.sending .hmChatWindowMessageBody,
.hmChatWindowMessageOuter.out.SMS.queued .hmChatWindowMessageBody {
  color: orange;
}
.hmChatWindowMessageOuter.out.SMS .hmChatWindowMessageBody {
  color: red;
}
.hmChatTabLink {
  cursor: pointer;
}
.hmWebChatNumberGrouping {
  background-color: yellow;
  cursor: pointer;
}
img.hmChatWindowMessageImage {
  display: inline-block;
  margin-right: 20px;
  margin-top: 10px;
}
a.hmChatWindowMessageMedia {
  display: block;
  margin-bottom: 10px;
}

/** Bootstrap Overrides */
.form-label {
  margin-bottom: 0;
}
.hm-fs-7 {
  font-size: 0.9rem;
}

#hmScreenResolution::before {
  content: 'xs ';
}

/** sm >= 576 px */
@media (min-width: 576px) {
  #hmScreenResolution::before {
    content: 'sm ';
  }
}
/** md >= 768 px */
@media (min-width: 768px) {
  #hmScreenResolution::before {
    content: 'md ';
  }
}
/** lg >= 992 px */
@media (min-width: 992px) {
  #hmScreenResolution::before {
    content: 'lg ';
  }
}
/** xl >= 1200 px */
@media (min-width: 1200px) {
  #hmScreenResolution::before {
    content: 'xl ';
  }
}
/** xxl >= 1400 px */
@media (min-width: 1400px) {
  #hmScreenResolution::before {
    content: 'xxl ';
  }
}