.pp-datapoint-value {
  background-color: white;
}

.manual-operation-menu-popup {
  height: 95%;
  max-height: 95%;
  min-width: 1100px;
}
.manual-operation-menu-popup .dxbl-modal-body {
  padding: 0.25rem !important;
}
.manual-operation-menu-popup .dxbl-modal-body .manual-operation-view .eas-card {
  margin-bottom: 0rem;
  margin: 0.125rem;
}
.manual-operation-menu-popup .dxbl-modal-body .manual-operation-view .eas-card .card-body {
  padding-top: 0.5em;
  padding-bottom: 0.5em;
}
.manual-operation-menu-popup .dxbl-modal-body .manual-operation-view .movement-buttons-and-values .card-body {
  padding-top: 0.2em !important;
  padding-bottom: 1em !important;
}
.manual-operation-menu-popup .dxbl-modal-body .manual-operation-view .movement-buttons-and-values .card-footer .manual-operation-plc-values {
  margin: unset;
  padding: 0.7em 1% 0.7em 1%;
}
.manual-operation-menu-popup .dxbl-modal-body .manual-operation-view .manual-operation-alarm-table .card-body {
  padding-top: 0.2em;
  padding-bottom: 0.2em;
}
.manual-operation-menu-popup .dxbl-modal-body .manual-operation-view .manual-operation-alarm-table .card-footer {
  padding-top: 0.2em;
  padding-bottom: 0.2em;
}

.dxbl-modal {
  --dxbl-popup-border-width: 3px;
}

:root {
  --border-radius: 3px;
  --btn-border-radius: 2px;
  --element-gap: 3px;
  --coffin-cad-background-color: rgb(227, 227, 227);
  --coffin-cad-text-color: rgb(128, 128, 128);
  --bootstrap-bg-danger: #dc3545;
}

.pp-linechart .dx-chart-root {
  background-color: inherit;
}

.customerLogo {
  width: auto;
  height: 100%;
  padding: 0.2em;
  margin-right: 1em;
  border-right: 2px solid #fff;
  border-right-color: var(--dxbl-body-color);
}

.customer-logo {
  height: 20vh;
}

.navbar-project-name {
  display: none;
}

.visibility-hidden {
  visibility: hidden;
}

.dasfl-view-popup {
  height: 80%;
  max-width: 80% !important;
}

.board-configurator-popup, .coffin-configurator-popup {
  height: 80% !important;
  max-width: 80% !important;
  min-height: 480px;
  min-width: 480px;
}
.board-configurator-popup .dxbl-modal-content, .coffin-configurator-popup .dxbl-modal-content {
  overflow: hidden;
}
.board-configurator-popup .dxbl-modal-content .dxbl-modal-body, .coffin-configurator-popup .dxbl-modal-content .dxbl-modal-body {
  min-height: 0;
}
.board-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content, .coffin-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content {
  align-items: end;
  display: grid;
  grid-template-rows: calc(100% - 4rem) 4rem;
  height: 100%;
}
.board-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content .content-buttons, .coffin-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content .content-buttons {
  display: flex;
  gap: 1rem;
  justify-content: end;
  width: 100%;
}
.board-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content .content-buttons .alert, .coffin-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content .content-buttons .alert {
  height: fit-content;
  margin: 0;
  width: 100%;
}
.board-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content .content-buttons > button, .coffin-configurator-popup .dxbl-modal-content .dxbl-modal-body .popup-content .content-buttons > button {
  margin: 0;
  min-width: 80px;
}

.wendel-production-view {
  border: none;
  border-radius: var(--border-radius);
  height: 100%;
  width: 100%;
  overflow: auto;
}
.wendel-production-view h5 {
  cursor: context-menu;
  font-size: 1.1rem;
  margin: 0;
}
.wendel-production-view .row-container {
  align-items: center;
  display: flex;
  flex-direction: row;
  font-size: 0.9rem;
  justify-content: space-between;
}
.wendel-production-view .configurations {
  display: grid;
  gap: var(--element-gap);
  grid-template-columns: auto auto;
}
.wendel-production-view .configurations .saw-left {
  grid-row: 0/span 1;
  grid-column: 1/span 1;
}

.coffin-product-selection {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 100%;
  height: 99.5%;
  grid-gap: 10px;
}
.coffin-product-selection .coffin-selection {
  grid-column: 1/span 1;
}
.coffin-product-selection .product-selection {
  grid-column: 2/span 1;
}
.coffin-product-selection .coffin-selection .pp-coffin-combobox, .coffin-product-selection .coffin-selection .pp-productcombobox, .coffin-product-selection .product-selection .pp-coffin-combobox, .coffin-product-selection .product-selection .pp-productcombobox {
  padding: 0;
}
.coffin-product-selection .coffin-selection .pp-coffin-combobox .dxbl-text-edit-input, .coffin-product-selection .coffin-selection .pp-productcombobox .dxbl-text-edit-input, .coffin-product-selection .product-selection .pp-coffin-combobox .dxbl-text-edit-input, .coffin-product-selection .product-selection .pp-productcombobox .dxbl-text-edit-input {
  font-size: 1.5rem;
}

.selection-grid {
  height: 100%;
  width: 100%;
  display: grid;
  grid-gap: 5px;
  grid-template-rows: 50px calc(100% - 330px) 270px;
}
.selection-grid .selection {
  grid-row: 1/span 1;
  width: 100%;
}
.selection-grid .cad {
  grid-row: 2/span 1;
  height: 99.5%;
  width: 100%;
}
.selection-grid .cad > div {
  width: 100%;
  height: 100%;
}
.selection-grid .cad > div > .board-config > canvas, .selection-grid .cad > div .coffin-config > canvas {
  height: 100%;
  width: 100%;
  border-radius: var(--border-radius);
}
.selection-grid .cad > div .cad-placeholder {
  height: 100%;
  background-color: var(--coffin-cad-background-color);
  color: var(--coffin-cad-text-color);
  border-radius: var(--border-radius);
}
.selection-grid .information {
  grid-row: 3/span 1;
  /* height: 0px;
  visibility: hidden;*/
}
.selection-grid .information .card-body {
  overflow-x: hidden;
  overflow-y: hidden;
}

.pp-coffin-pruduct-selection .pp-coffin-combobox .dxbl-text-edit, .pp-product-information .pp-coffin-combobox .dxbl-text-edit, .pp-coffin-selection .pp-coffin-combobox .dxbl-text-edit, .pp-coffin-information .pp-coffin-combobox .dxbl-text-edit {
  font-size: unset;
  --dxbl-text-edit-font-size: unset;
}
.pp-coffin-pruduct-selection h5, .pp-product-information h5, .pp-coffin-selection h5, .pp-coffin-information h5 {
  font-size: unset;
}
.pp-coffin-pruduct-selection .card-body, .pp-product-information .card-body, .pp-coffin-selection .card-body, .pp-coffin-information .card-body {
  overflow-y: hidden;
}
.pp-coffin-pruduct-selection .card-body table, .pp-product-information .card-body table, .pp-coffin-selection .card-body table, .pp-coffin-information .card-body table {
  width: 100%;
}

.pp-coffin-pruduct-selection, .pp-coffin-selection {
  height: 100%;
}
.pp-coffin-pruduct-selection .information, .pp-coffin-selection .information {
  grid-row: 2/span 1;
  visibility: visible;
  height: 100%;
}
.pp-coffin-pruduct-selection .coffin-product-selection, .pp-coffin-selection .coffin-product-selection {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 100%;
  height: 100%;
  grid-gap: 4px;
}
.pp-coffin-pruduct-selection .coffin-product-selection .coffin-selection, .pp-coffin-selection .coffin-product-selection .coffin-selection {
  grid-row: 1/span 1;
  grid-column: 1/span 1;
}
.pp-coffin-pruduct-selection .coffin-product-selection .product-selection, .pp-coffin-selection .coffin-product-selection .product-selection {
  grid-row: 2/span 1;
  grid-column: 1/span 1;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid, .pp-coffin-selection .coffin-product-selection .selection-grid {
  height: 100%;
  width: 100%;
  display: grid;
  grid-gap: 5px;
  grid-template-rows: auto auto auto;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection, .pp-coffin-selection .coffin-product-selection .selection-grid .selection {
  grid-row: 1/span 1;
  width: 100%;
  height: 100%;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox, .pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox {
  height: 100%;
  --product-btn-bg-color: var(--card-background-color);
  --table-background-color: var(--product-btn-bg-color);
  --bg-color-contrast-light: var(--product-btn-bg-color);
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-text-edit, .pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-text-edit, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-text-edit, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-text-edit {
  border-radius: var(--border-radius);
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-btn-group, .pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-btn-group, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-btn-group, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-btn-group {
  border-radius: var(--border-radius);
  --dxbl-text-edit-btn-disabled-bg: var(--product-btn-bg-color);
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-btn-group button, .pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-btn-group button, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-btn-group button, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-btn-group button {
  width: 2rem;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-btn-group button svg, .pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-btn-group button svg, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-productcombobox .dxbl-btn-group button svg, .pp-coffin-selection .coffin-product-selection .selection-grid .selection .pp-coffin-combobox .dxbl-btn-group button svg {
  height: 1.5rem;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .cad, .pp-coffin-selection .coffin-product-selection .selection-grid .cad {
  grid-row: 3/span 1;
  height: 5%;
  width: 100%;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .cad > div, .pp-coffin-selection .coffin-product-selection .selection-grid .cad > div {
  width: 100%;
  height: 100%;
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .cad > div > .board-config > canvas, .pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .cad > div .coffin-config > canvas, .pp-coffin-selection .coffin-product-selection .selection-grid .cad > div > .board-config > canvas, .pp-coffin-selection .coffin-product-selection .selection-grid .cad > div .coffin-config > canvas {
  height: 100%;
  width: 100%;
  border-radius: var(--border-radius);
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .cad > div .cad-placeholder, .pp-coffin-selection .coffin-product-selection .selection-grid .cad > div .cad-placeholder {
  height: 100%;
  background-color: var(--coffin-cad-background-color);
  color: var(--coffin-cad-text-color);
  border-radius: var(--border-radius);
}
.pp-coffin-pruduct-selection .coffin-product-selection .selection-grid .card-body, .pp-coffin-selection .coffin-product-selection .selection-grid .card-body {
  overflow-y: hidden;
}

.pp-productcombobox, .pp-coffin-combobox {
  height: 100%;
  --product-btn-bg-color: var(--card-background-color);
  --table-background-color: var(--product-btn-bg-color);
  --bg-color-contrast-light: var(--product-btn-bg-color);
}
.pp-productcombobox .dxbl-text-edit, .pp-coffin-combobox .dxbl-text-edit {
  border-radius: var(--border-radius);
  height: 50px;
}
.pp-productcombobox .dxbl-text-edit .dxbl-btn-group, .pp-productcombobox .dxbl-text-edit .dxbl-btn-group-right, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group-right {
  border-radius: var(--border-radius);
  --dxbl-text-edit-btn-disabled-bg: var(--product-btn-bg-color);
}
.pp-productcombobox .dxbl-text-edit .dxbl-btn-group .dxbl-btn, .pp-productcombobox .dxbl-text-edit .dxbl-btn-group-right .dxbl-btn, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group .dxbl-btn, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group-right .dxbl-btn {
  border-radius: var(--border-radius);
}
.pp-productcombobox .dxbl-text-edit .dxbl-btn-group button, .pp-productcombobox .dxbl-text-edit .dxbl-btn-group-right button, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group button, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group-right button {
  border-radius: var(--border-radius);
  width: 45px;
}
.pp-productcombobox .dxbl-text-edit .dxbl-btn-group button svg, .pp-productcombobox .dxbl-text-edit .dxbl-btn-group-right button svg, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group button svg, .pp-coffin-combobox .dxbl-text-edit .dxbl-btn-group-right button svg {
  height: 40px;
  width: 40px;
}

.coffin-selection-container {
  height: 100%;
  width: 100%;
  display: grid;
  grid-template-rows: 60px calc(100% - 60px);
  padding-top: 5px;
  padding-bottom: 5px;
}
.coffin-selection-container .coffin-selection {
  grid-row: 1/span 1;
}
.coffin-selection-container .coffin-cad {
  grid-row: 2/span 1;
}
.coffin-selection-container .coffin-cad .coffin-config-placeholder {
  height: 100%;
  width: 100%;
  background-color: var(--coffin-cad-background-color);
  color: var(--coffin-cad-text-color);
  border-radius: var(--border-radius);
}

.coffin-config-placeholder {
  height: 100%;
  width: 100%;
  background-color: var(--coffin-cad-background-color);
  color: var(--coffin-cad-text-color);
  border-radius: var(--border-radius);
}

.place-data-popup {
  --dxbl-popup-border-width: 3px;
}
.place-data-popup table {
  width: 100%;
}
.place-data-popup table th {
  width: 50%;
}

.twin-place-widget {
  width: 75px;
}
.twin-place-widget .place {
  height: 24px;
  width: 100%;
  --border-width: 1px;
  --border-radius: 4px;
  border: var(--border-width) solid black;
  border-radius: var(--border-radius);
  --place-occupied-border-radius: calc(var(--border-radius) - var(--border-width));
}
.twin-place-widget .place .place-occupied {
  height: 100%;
  width: 100%;
  background-color: var(--success);
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: var(--place-occupied-border-radius);
}
.twin-place-widget .place .place-not-occupied {
  height: 100%;
  width: 100%;
  background-color: unset;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.twin-place-widget .place .occupied-text {
  padding-inline: 0.1rem;
  text-align: center;
}

.twin-place-button button {
  color: var(--text-color);
  background-color: rgba(65, 75, 88, 0.8);
}

.text-align-end {
  text-align: end;
}

.visibility-hidden {
  visibility: hidden;
}

.pp-element {
  background-color: var(--card-background-color);
  border-radius: var(--border-radius);
  padding-inline: 10px;
  padding-block: 5px;
  color: var(--card-text-color);
  height: 100%;
}

.value-item {
  width: 100%;
  align-items: center;
  background-color: transparent;
  display: flex;
  justify-content: space-between;
  cursor: context-menu;
}
.value-item h1 {
  font-size: 0.8rem;
  margin: 0;
}
.value-item h2 {
  font-size: 1.1rem;
  margin: 0;
}
.value-item p {
  color: var(--text-color-2);
  font-size: 0.8rem;
  margin: -2px 0 0 0;
}

.buttons-row {
  display: flex;
  flex-direction: row;
}

.button-area {
  padding-top: 4px;
  padding-bottom: 4px;
  padding-right: 5px;
}

.active-button-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.btn-animated {
  background-color: var(--body-background-color);
  cursor: pointer;
  color: var(--text-color);
  border-radius: var(--btn-border-radius);
  height: clamp(1rem, 4vh, 2.7rem);
  width: clamp(1rem, 4vh, 2.7rem);
  display: flex;
  align-items: center;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6901960784);
}
.btn-animated:hover {
  opacity: 0.8;
}
.btn-animated:active {
  box-shadow: 2px 2px 2px black;
  opacity: 0.6;
}
.btn-animated span {
  font-size: clamp(1rem, 2.5vh, 1.8rem);
  width: 100%;
  vertical-align: middle;
  text-align: center;
}

.target-counter {
  border-style: solid;
  border-width: 3px;
  border-color: var(--text-color);
  padding-block: 2px;
  padding-inline: 7px;
}

.board-counter {
  display: flex;
  justify-content: space-between;
}

.bg-error {
  background-color: var(--bootstrap-bg-danger);
}

.bg-disabled {
  border-color: var(--card-background-color);
}

.bg-not-reached {
  opacity: 0.8;
  color: var(--card-background-color);
  background-color: whitesmoke;
  border-color: whitesmoke;
}

.bg-reached {
  background-color: var(--success);
}

.das-fl-product-popup .dxbl-modal-body label {
  word-break: normal;
}
.das-fl-product-popup table {
  padding-top: 20px;
}
.das-fl-product-popup table, .das-fl-product-popup th, .das-fl-product-popup td {
  border: 1px solid rgba(245, 245, 245, 0.5);
  border-collapse: collapse;
  padding-inline: 10px;
}
.das-fl-product-popup td {
  white-space: nowrap;
}

.place-buttons {
  padding-top: 10px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 20px;
}
.place-buttons > * {
  height: 40px;
}