/* These styles are generated from project.scss. */

:root {
  font-size: 15px;
  --color-main-gray: rgba(0, 0, 0, 0.5);
  --color-sub-light: #f6f6f6;
  --color-disabled: #adadad;
}

html,
body {
  height: 100%;
}

body {
  font-family: 'Roboto', sans-serif;
}

a {
  color: inherit;
  text-decoration: inherit;
}

a:hover {
  color: inherit;
}

.alert-debug {
  color: black;
  background-color: white;
  border-color: #d6e9c6;
}

.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

.bg-white {
  background-color: white !important;
}

.bg-blue {
  background-color: var(--mdc-theme-primary) !important;
}

.text-blue {
  color: var(--mdc-theme-primary) !important;
}

.bg-teal {
  background-color: #00b5b1 !important;
}

.bg-orange {
  background-color: #ffa83a !important;
}

.bg-navy {
  background-color: #000050 !important;
}

.status-badge {
  height: 1.7em !important;
  min-width: 9em !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
  cursor: default !important;
  box-shadow: none !important;
}

.circle {
  border-radius: 50% !important;
}

.chip-clear-icon {
  padding: 0 !important;
  min-width: 16px !important;
  height: 16px !important;
}

.icon-32px {
  width: 32px !important;
  height: 32px !important;
}

.icon-42px {
  min-width: 42px !important;
  height: 42px !important;
}

.icon-46px {
  width: 46px !important;
  height: 46px !important;
}

.filter-icon {
  font-size: 1.5rem !important;
  top: -3px;
  left: 1px;
}

.button-icon-smaller {
  width: 1.4rem !important;
  height: 1.4rem !important;
  font-size: 1.25rem !important;
  padding-top: 2px !important;
}

.button-icon {
  width: 1.6rem !important;
  height: 1.6rem !important;
  font-size: 1.6rem !important;
}

.check-mark-icon-standalone {
  font-size: 1.25rem !important;
  width: 1.4rem !important;
  height: 1.4rem !important;
  padding-top: 2px;
  padding-left: 1px;
}

.header-logo {
  max-height: 46px;
}

.header-avatar {
  border-radius: 6px;
}

.header-dropdown-menu {
  top: 62px !important;
}

.cursor-pointer {
  cursor: pointer !important;
}

.cursor-default {
  cursor: default !important;
}

.header-email {
  font-size: smaller;
  text-transform: none;
}

.header-menu-item {
  font-size: small;
}

.mdc-select--outlined .mdc-select__anchor {
  height: 50px !important;
}

.mdc-checkbox__native-control:checked~.mdc-checkbox__background {
  border-color: var(--mdc-theme-primary) !important;
  background-color: var(--mdc-theme-primary) !important;
}

.mdc-dialog .mdc-dialog__surface {
  min-width: 320px !important;
}

.mdc-chip {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.order-modification-date {
  font-size: small;
}

.login-page-content {
  margin-top: 10vh;
}

.spinner-icon {
  animation: rotate 1s linear infinite;
}

@keyframes rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

tr.deleted {
  background-color: #FDA5A6;
}

tr.deleted:hover {
  background-color: #f89d9e !important; /* Use important to override MDC table's hover */
}

tr.edited {
  background-color: #febe89;
}

tr.edited:hover {
  background-color: #fda45a !important; /* Use important to override MDC table's hover */
}


tr.mdc-data-table__row.condensed {
  height: 44px;
}

.header-environment {
  font-weight: bolder;
  color: white;
}

.order-page-container {
  height: calc(100vh - 100px);  /* Calculates remaining space for content (page height - (max header height + 10px gap)) */
}

.order-page-container .mdc-data-table__pagination {
  /* Disable shrink of paginator */
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
}

.order-page-container .mdc-data-table {
  max-height: 100% !important; /* Limit table to max allowed height */
}

.order-count-message {
  color: var(--bs-body-color);
  margin: 1%;
}

.order-count-values {
  font-size: 12pt;
  font-weight: bolder;
}
.multiselect-dropdown {
  width: 100%;
  position: relative;
  display: inline-block;
  background-color: unset;
}

.multiselect-dropdown-results {
  width: 100%;
  padding: 3.5%;
  height: 10%;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--color-main-gray);
  border-radius: 4px;
}

.multiselect-dropdown-content {
  display: none;
  position: absolute;
  background-color: var(--color-sub-light);
  min-width: 230px;
  overflow: auto;
  z-index: 1;
}

.multiselect-dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.show-filter-options {display: block;}

.align-order-count-values {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 1%;
}

.dropdown-result-text {
  flex: 1;
  overflow-x: hidden; /* Hide horizontal scrollbar */
  overflow-y: scroll; /* Add vertical scrollbar */
  max-height: 200px;
}

.filter-search-input {
  width: 90%;
  border: 1px solid var(--color-main-gray);
  border-radius: 4px;
  padding: 1%;
  margin: 3%;
}

.dropdown-result-text-element {
  background-color: var(--mdc-theme-primary);
  color: white;
  padding: 2px 4px;
  margin: 1%;
  border-radius: 5px;
  width: fit-content;
}

.no-space-config {
  margin: unset;
  padding: unset;
}

.order-preview-dialog {
  width: 80%;
  height: 80%;
  max-width: 1500px;
}

.order-preview-frame-container {
  width: 100%;
  height: 90%;
  overflow-y: scroll;
}

#order-preview-frame {
  width: 75vw;
  height: 450vh;
  pointer-events: none;
}

.order-preview-close-button-container {
  width: fit-content;
  height: 10%;
  float: right;
  align-items: center;
  display: flex;
}

.order-preview-close-button {
  cursor: pointer;
  padding: 8px 16px;
  background-color: #00244b;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 16px;
}

.disabled-link {
  pointer-events: none;  /* Disable pointer events to make it unclickable */
}

.disabled-link-icon {
  color: var(--color-disabled);
}

.disabled-button-icon {
  background-color: var(--color-disabled);
}

.custom-mdc-button {
  min-width: 45px;
}

.filter-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.custom-cleat-button {
  color: #fff !important;
  background-color: #dc3545 !important;
  border-color: #dc3545 !important;
}