@charset "UTF-8";
/* qCalc Default Theme */
/* qCalc Vibe Theme */
/* 0.82rem, 0.906 */
/* 500 */
/* colors */
/* rgb(0,53,102) rgb(0,8,54), #1a9f8b; */
/* Page Grid */
.page-grid .row {
  display: flex;
  flex-wrap: wrap;
}

.page-grid .col {
  flex: 1; /* Allow columns to grow equally */
  min-width: 150px;
}

/**/
/* Scrollable region */
.scrollable {
  width: 22.125rem; /* Width of the scrollable area */
  max-height: 200px; /* Maximum height for the scrollable area */
  border: 1px solid #ddd; /* Optional: Add a border */
  padding: 10px;
  overflow-y: auto; /* Enable vertical scrolling when needed */
}

.scrollable a {
  display: block;
  padding: 5px;
  text-align: left;
}

/**/
.inputfile + label {
  width: 225px;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  padding: 10px 10px;
  border: 1px solid #ddd;
}

/* Full Screen */
.fullscreen {
  background: white;
  padding: 20px;
  z-index: 9999;
  overflow: auto; /* Enables scrolling when content overflows */
}

.elem-wrapper {
  position: relative;
  display: inline-block;
}

.fullscreen-square {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  height: 20px;
  border: 2px solid #eee;
  background-color: transparent;
  cursor: pointer;
  border-radius: 4px;
  box-sizing: border-box; /* Ensures padding and border don't affect size */
}

.fullscreen-square:hover {
  border-color: #ddd;
}

/**/
/* CSS to remove '/' from all breadcrumb items */
.breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: "";
}

.clickable {
  cursor: pointer;
}

.navbar-brand img {
  height: 1.5rem;
}

.navbar-brand {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

#navbar-footer {
  font-size: 0.82rem;
}

body {
  font-family: "Roboto", "Open Sans", "Lato", "Montserrat", Arial, sans-serif;
  font-weight: 400;
  font-size: 0.94rem;
  line-height: 1.6;
  /* !important: Reset line-height for Tabulator table later */
}

.dropdown-menu {
  font-size: 0.94rem;
}

.content-wrapper {
  overflow: hidden; /* Hide overflow to prevent double scrollbar */
}

.info {
  width: 12px;
  padding-bottom: 0.2rem;
}

label.required::after {
  content: " *";
  color: red;
}

.dropdown-item {
  padding-top: 0.2rem;
  padding-left: 1.4rem;
}

.dropdown-item-checked::before {
  position: absolute;
  left: 0.4rem;
  content: "✓";
  font-weight: 500;
}

.hidden {
  display: none;
}

.section-input {
  background-color: GhostWhite;
  padding-top: 0.25rem;
  padding-bottom: 1rem;
}

.section-output1 {
  background-color: white;
  padding-top: 0.25rem;
  padding-bottom: 1rem;
  margin-right: -0.625rem;
  margin-left: -0.625rem;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
}

.section-output2 {
  background-color: white;
  padding-top: 0.25rem;
  padding-bottom: 1rem;
  margin-right: -0.625rem;
  margin-left: -0.625rem;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
}

.btncmd {
  border: 1px solid;
  background: LightSteelBlue;
  margin-top: 2px; /* looks best below a input table e.g. umatrix() */
  margin-right: 8px;
  padding: 3px 8px 3px 8px;
  height: 32px;
  min-width: 24px;
  border-radius: 4px;
}

.nowrap {
  white-space: nowrap;
}

.wrap {
  white-space: normal;
}

a:link {
  color: #369;
}

a:visited {
  color: #369;
}

a:hover {
  color: red;
}

/* nav-sidebar */
.sidebar-secondary {
  font-size: 0.82rem !important;
}

.nav-sidebar > .nav-item > .nav-link {
  font-weight: 400;
}

button, input, optgroup, select, textarea {
  margin-bottom: 0.25rem;
  /* border-radius: 4px; */
}

textarea {
  resize: both;
  max-width: 100%;
  overflow: auto;
}

.texte {
  width: auto;
  height: auto;
}

/* select2 */
.select2-results {
  font-size: 0.82rem !important;
}

.select2-selection {
  font-weight: 500;
}

.select2-container--default .select2-selection--single {
  border-radius: 4px;
  margin-bottom: 0.25rem;
  margin-top: 0rem;
  height: 1.879rem;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1.6rem;
}

.select2-container {
  width: auto;
}

/* spinner */
.spinner {
  border: 4px solid rgba(255, 255, 255, 0.1);
  border-left: 4px solid #fff;
  border-radius: 50%;
  width: 15px;
  height: 15px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* tabulator */
/* Reset line-height for Tabulator table */
/* Tabulator tables rely on precise layout and alignment to ensure that rows and cells display correctly */
.tabulator {
  line-height: normal;
}

.tabulator .tabulator-header,
.tabulator .tabulator-cell {
  line-height: normal;
}

/* table */
.table {
  border-color: rgb(170, 170, 170);
}

.table thead, .table th, .table td, .table tr {
  border-color: rgb(221, 221, 221);
}

/* search-container */
.categ {
  cursor: pointer;
  font-weight: bold;
  color: #369;
}

.desc {
  margin-top: 0.4rem;
  margin-bottom: 0rem;
}

.tdesc {
  margin-top: 0rem;
  margin-bottom: 0.2rem;
}

#search-container ul {
  padding-left: 1rem;
  list-style-type: none;
}

#search-container li {
  padding-left: 0rem;
  margin-bottom: 0.2rem;
}

#search-container i {
  margin-right: 0.75rem;
}

/*
ul {
  padding-left: 1rem;
  }

ol {
  padding-left: 1rem;
  }
*/
li:not(.nav-item) {
  /* !otherwise this will shift nav-item icons to the right */
  padding-left: 0.75rem;
  margin-bottom: 0.2rem;
}

div.radio, div.mcheck {
  padding-left: 1rem;
  padding-top: 0.3rem;
}

label {
  margin-bottom: 0.1rem;
  font-weight: 500; /* 600 */
  margin-right: 0.4rem;
}

.content {
  padding: 1rem;
}

.container-fluid {
  padding-left: 0rem;
  padding-right: 0rem;
}

.qhtml {
  border: 1px solid #ccc;
  padding: 2px;
  display: inline-block;
}

.list-icons {
  font-size: 1rem;
}

.qty-s {
  font-size: 0.75rem;
  margin-left: 2px;
}

/* Card */
.card {
  background-color: #fff;
  border-radius: 6px;
}

.card-header:first-child {
  border-radius: 6px 6px 0 0;
}

.bg-card-header {
  background-color: rgb(77, 177, 223) !important; /* logo blue */
  /* background-color: #17a2b8 !important; */
}

.card-title {
  color: #fff;
}

.card-collapse {
  margin-right: 8px;
}

.card-collapse:after {
  font-family: "icomoon";
  float: right;
  content: "\ede4"; /*icon-circle-up2*/
}

.card-collapse.collapsed:after {
  font-family: "icomoon";
  content: "\ede6"; /*icon-circle-down2*/
}

.card-close:after {
  font-family: "icomoon";
  content: "\ed63"; /*icon-cancel-circle2*/
}

.card-help:after {
  font-family: "icomoon";
  content: "\ed53"; /*icon-question4*/
}

.card-menu:after {
  font-family: "icomoon";
  content: "\e9f3"; /*icon-list-unordered*/
}

.image {
  max-width: 100%;
  height: auto;
}

.img-plot {
  max-width: 100%;
  min-width: 320px !important;
  height: auto;
}

.btn {
  font-weight: 400;
}

.btnimg {
  height: 36px;
  width: 36px;
  padding-left: 8px;
}

/* sizes - large */
.chr {
  width: 12rem;
} /* short char */
.uom {
  width: 12rem;
} /* lone uom */
.val {
  width: 12rem;
} /* lone val */
.val-p {
  width: 12rem;
} /* val with part - qchar, qfl, qin */
.val-pp {
  width: 10rem;
} /* val parts - qchar, qfl, qin _part */
.val-q {
  width: 12rem;
} /* qty val with uom */
.uom-q {
  width: 10rem;
} /* qty uom */
.val-pq {
  width: 9rem;
} /* qty val with part */
.uom-pq {
  width: 9rem;
} /* qty uom part */
.oval-q {
  width: 12rem;
} /* output qty val with uom */
.ouom-q {
  width: 9rem;
} /* output qty uom */
.inp {
  width: 22.125rem;
} /* text, str input */
.texta {
  width: 22.125rem;
  height: 5rem;
}

.vt {
  width: 3rem;
}

.htmx-indicator {
  display: none;
}

.htmx-request .htmx-indicator {
  display: inline;
}

div.calc {
  min-width: 375px;
}

/* >= 1568px */
@media screen and (min-width: 1568px) {
  div.calc {
    min-width: 500px;
  }
}
/* >= 410px */
@media screen and (min-width: 421px) {
  .calimg {
    display: none;
  }
}
/* <= 409px */
@media screen and (max-width: 420px) {
  .notxt {
    /* hide caption on small screen */
    display: none;
  }
  .btncal {
    height: 36px;
    width: 36px;
    padding-left: 8px;
  }
  /* sizes - medium */
  .chr {
    width: 11rem;
  }
  .uom {
    width: 11rem;
  }
  .val {
    width: 11rem;
  }
  .val-p {
    width: 11rem;
  }
  .val-pp {
    width: 9rem;
  }
  .val-q {
    width: 11rem;
  }
  .uom-q {
    width: 9rem;
  }
  .val-pq {
    width: 9rem;
  }
  .uom-pq {
    width: 9rem;
  }
  .oval-q {
    width: 11rem;
  }
  .ouom-q {
    width: 8rem;
  }
  .inp {
    width: 20.125rem;
  }
  .texta {
    width: 20.125rem;
    height: 5rem;
  }
  .img-plot {
    min-width: 200px !important;
  }
}
/* <= 369px */
@media screen and (max-width: 375px) {
  div.calc {
    min-width: 300px;
  }
  /* sizes small */
  .chr {
    width: 10rem;
  }
  .uom {
    width: 10rem;
  }
  .val {
    width: 10rem;
  }
  .val-p {
    width: 10rem;
  }
  .val-pp {
    width: 8rem;
  }
  .val-q {
    width: 10rem;
  }
  .uom-q {
    width: 8rem;
  }
  .val-pq {
    width: 8rem;
  }
  .uom-pq {
    width: 8rem;
  }
  .oval-q {
    width: 10rem;
  }
  .ouom-q {
    width: 7rem;
  }
  .inp {
    width: 18.125rem;
  }
  .texta {
    width: 18.125rem;
    height: 5rem;
  }
  .btnimg, .btncal {
    height: 28px;
    width: 28px;
    padding-left: 5px;
    padding-top: 3px;
  }
}
span.mark2 {
  display: inline-block;
  background: papayawhip; /* #ffb82e; */
  color: #1b1c1e;
  padding: 0 3px;
  height: 16px;
  border-radius: 2px;
  line-height: 16px;
  font-size: 0.82rem;
  overflow: hidden;
  position: relative;
  bottom: -2px;
  left: 6px;
}

/*# sourceMappingURL=qcalc-default.css.map */
