@import url("open-iconic/font/css/open-iconic-bootstrap.min.css");
.dw.BottomAppBar .ActionButton,
.dw.BottomAppBar .FloatingActionButton {
  --foreground: hsl(200, 10%, 80%);
  --background: hsl(216, 27%, 44%);
}
.dw.BottomAppBar .ActionButton .Icon,
.dw.BottomAppBar .FloatingActionButton .Icon {
  --foreground: hsl(200, 10%, 80%);
  --background: hsl(216, 27%, 44%);
}

.dw.BottomAppBar .FloatingActionButton {
  --foreground: hsl(0, 0%, 100%);
  --background: hsl(216, 27%, 44%);
}
.dw.BottomAppBar .FloatingActionButton .Icon {
  --foreground: hsl(0, 0%, 100%);
  --background: hsl(216, 27%, 44%);
}

.dw.AppBar button {
  display: inline-block;
  padding: 0;
  border-style: none;
  background-color: transparent;
  cursor: pointer;
  font-family: initial;
  outline: none;
  text-decoration: none;
  vertical-align: middle;
  white-space: nowrap;
  width: 1.5rem;
  height: 1.5rem;
}

.table-primary tr.placeholder > td > span {
  padding: 0.5rem;
  background-color: rgb(214, 214, 214);
}

.dw.SelectDropdown > button {
  padding: 0.5rem;
  border-radius: 100rem;
}

.dw.AppBar {
  --foreground: hsl(200, 5%, 90%);
  --background: hsl(230, 60%, 16%);
}
.dw.AppBar .NavigationIcon {
  color: hsl(0, 0%, 100%);
}
.dw.AppBar .Icon {
  width: 1.5rem;
  height: 1.5rem;
  color: hsl(0, 0%, 100%);
}
.dw.Avatar {
  --background: #e9ecef;
}
.dw.BottomDrawer {
  z-index: z-index(nav-drawer);
  border-top: 1px solid hsl(200, 5%, 90%);
  box-shadow: var(--elevation-7);
  --bottom: 3.5rem;
  padding-bottom: 3rem;
  max-height: calc(100vh - 8rem);
}
.dw.Dialog.full {
  max-width: 48rem;
  border-style: none;
  border-radius: 0.5rem;
  padding: 3rem;
  box-shadow: var(--elevation-dialog);
  background-color: white;
  /*        border-style: none;
  border-radius: 4px;
  padding: 16px;
  box-shadow: 0 5px 10px 2px rgba(34, 60, 80, 0.2);
  max-width: 48rem;*/
}
.dw.Dialog button.cross[type=reset] {
  position: absolute;
  top: 2rem;
  right: 2rem;
  display: flex;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border-style: none;
  background-color: transparent;
  outline-style: none;
}
.dw.Dialog button.cross[type=reset]:focus {
  outline-style: none;
}
.dw.Dialog footer {
  text-align: center;
}
.dw.Dialog footer button[type=reset] {
  display: inline-block;
  margin-top: 1rem;
  margin-right: auto;
  margin-left: auto;
}
.dw.Icon {
  width: 1.5rem;
  height: 1.5rem;
}
.dw.Icon.system {
  width: 1.5rem;
  height: 1.5rem;
}
.dw.NavigationDrawer {
  min-width: 14rem;
  max-width: 17.5rem;
  background-color: hsl(0, 0%, 100%);
}
@media (min-width: 768px) {
  .dw.NavigationDrawer {
    background-color: hsl(230, 60%, 16%);
    max-width: calc(100vw - 56px);
  }
}
@media (min-width: 376px) {
  .dw.NavigationDrawer {
    max-width: 320px;
  }
}
@media (max-width: 991.98px) {
  .dw.NavigationDrawer[data-open] {
    --elevation: var(--elevation-nav-drawer);
  }
}
.dw.SelectDropdown > button {
  white-space: nowrap;
}
@media (max-width: 991.98px) {
  .dw.NavigationDrawer[data-open] + .NavigationDrawer-Scrim {
    z-index: z-index(nav-drawer-scrim);
    opacity: 1;
    visibility: visible;
  }
}
.dw.WindowsLoader {
  --dot-background-color: #0d6efd;
}
.dw.DashboardLayout {
  --drawer-width: 160px;
  --drawer-width-sm: 70px;
  --aside-width: 240px;
}
.dw.CalendarDay {
  --foreground: #666;
}
.dw.CalendarDay.selected {
  --background: #e9ecef;
}
.dw.TimeRangePicker {
  --foreground: #212529;
}
.dw.TimeRangePicker-Handler {
  cursor: pointer;
  fill: var(--foreground, #666);
}
.dw.TimeRangePicker-Bar {
  stroke: var(--foreground, #666);
}
.dw.TimeRangePicker-Tick.Major {
  stroke: var(--foreground, #666);
}
.dw.TabList {
  border-bottom: 1px solid #ccc;
}
.dw.Tab {
  --background: p.$background;
  border-bottom: 2px solid transparent;
  transition: background-color 0.3s;
  /*    &:hover {
    border-color: var(--hover-border-color);
  }*/
  /*    // border
  --border-radius: 0.25rem;
  --hover-border-color: #aaa;
  border: 1px solid transparent;
  border-top-left-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
  border-bottom-style: none;*/
}
.dw.Tab[aria-selected=true] {
  border-bottom-color: hsl(216, 27%, 44%);
}
.dw.Tab:active {
  --background: #eee;
}

.Button, .PrimaryButton, .SecondaryButton, .ZeroButton, .ToolButton {
  display: inline-flex;
  align-items: center;
  user-select: none;
  padding: 0.375rem 0.75rem;
  border-radius: 0.25rem;
  border: 1px solid transparent;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  font-size: 1rem;
  line-height: 1.5;
  cursor: pointer;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.Button:hover, .PrimaryButton:hover, .SecondaryButton:hover, .ZeroButton:hover, .ToolButton:hover {
  text-decoration: none;
}
.Button:focus, .PrimaryButton:focus, .SecondaryButton:focus, .ZeroButton:focus, .ToolButton:focus {
  outline: 0;
  box-shadow: 0 0 0 0.25rem var(--glow-color);
}
.Button:focus, .PrimaryButton:focus, .SecondaryButton:focus, .ZeroButton:focus, .ToolButton:focus, .Button:hover, .PrimaryButton:hover, .SecondaryButton:hover, .ZeroButton:hover, .ToolButton:hover {
  text-decoration: none;
}
.Button:disabled, .PrimaryButton:disabled, .SecondaryButton:disabled, .ZeroButton:disabled, .ToolButton:disabled {
  pointer-events: none;
  opacity: 0.5;
  box-shadow: none;
}
.Button:active:focus, .PrimaryButton:active:focus, .SecondaryButton:active:focus, .ZeroButton:active:focus, .ToolButton:active:focus {
  box-shadow: 0 0 0 0.25rem #ddd;
}
.Button i, .PrimaryButton i, .SecondaryButton i, .ZeroButton i, .ToolButton i {
  margin-right: 0.75rem;
}

.ToolButton {
  border-radius: 50%;
  display: inline-flex;
  background-color: transparent;
  padding: 0.75rem;
  border-style: none;
  outline-style: none;
}
.ToolButton:hover {
  background-color: rgba(102, 102, 102, 0.219);
}
.ToolButton:focus {
  outline-style: none;
}

.container-1 {
  background-color: #fff;
}

.layout-1 {
  position: relative;
  display: flex;
  flex-direction: column;
}

.table-wrapper {
  position: relative;
}

.table-wrapper-2 {
  background-color: #fff;
  padding: 1rem;
  overflow-y: auto;
  padding-top: 0;
}

.PrimaryButton {
  color: #eee;
  background-color: #666;
  --glow-color: #999;
}
.PrimaryButton:hover {
  background-color: #555;
}
.PrimaryButton:active {
  background-color: #777;
}

.SecondaryButton {
  color: #eee;
  background-color: #999;
  --glow-color: #aaa;
}
.SecondaryButton:hover {
  background-color: #888;
}
.SecondaryButton:active {
  background-color: #aaa;
}

.Button {
  color: #000;
  background-color: #ddd;
  --glow-color: #eee;
}
.Button:hover {
  background-color: #ccc;
}
.Button:active {
  background-color: #eee;
}

.ZeroButton {
  background-color: transparent;
  width: min-content;
}

caption {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  text-align: left;
}

th {
  text-align: inherit;
  text-align: -webkit-match-parent;
}

thead,
tbody,
tfoot,
tr,
td,
th {
  border-width: 0;
  border-style: solid;
  border-color: inherit;
}

/*
an optional <caption> element,
zero or more <colgroup> elements,
an optional <thead> element,
either one of the following:
zero or more <tbody> elements
one or more <tr> elements
an optional <tfoot> element

*/
/*product-icon: 48px,*/
/*system-icon: 24px,*/
#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}
#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

.blazor-error-boundary {
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
  padding: 1rem 1rem 1rem 3.7rem;
  color: white;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}

::-webkit-scrollbar-thumb {
  background: #e1e1e1;
  border: 15px none #ffffff;
  border-radius: 50px;
}
::-webkit-scrollbar-thumb:hover {
  background: #ffffff;
}
::-webkit-scrollbar-thumb:active {
  background: #be8282;
}

::-webkit-scrollbar-track {
  background: #666666;
  border: 0px none #ffffff;
  border-radius: 50px;
}
::-webkit-scrollbar-track:hover {
  background: #666666;
}
::-webkit-scrollbar-track:active {
  background: #333333;
}

::-webkit-scrollbar-corner {
  background: transparent;
}

html,
body {
  height: 100%;
}

#app {
  height: 100%;
  background-color: white;
}
#app > .loader {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
#app > .loader > div {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}

.table-primary {
  width: 100%;
  font-size: 0.875rem;
  background-color: #fff;
}
.table-primary > :not(caption) > * > * {
  border-bottom: 1px solid #ced4da;
}
.table-primary > thead {
  font-size: 0.75rem;
}
.table-primary > thead > tr > th {
  background-color: #f6f8fa;
}
.table-primary th,
.table-primary td {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border-top: none;
  border-bottom: none;
}
.table-primary ::deep .WorkTaskRow {
  background-color: #f9fafb;
  color: #797b7c;
}
.table-primary th {
  border-top-width: 0;
  background-color: #272b30;
}
.table-primary tr {
  border-bottom: #ced4da;
}
.table-primary th {
  padding-top: 1rem;
}

table.WorkTaskManagementTable {
  background-color: #fff;
}
@media (min-width: 992px) {
  table.WorkTaskManagementTable > :not(caption) > * > * {
    padding: 0.25rem;
  }
}
table.WorkTaskManagementTable .tel a {
  cursor: pointer;
  text-decoration: none;
}
table.WorkTaskManagementTable .tel a:hover {
  text-decoration: underline;
}
table.WorkTaskProcessing col.project {
  width: auto;
}
table.WorkTaskProcessing col.date {
  width: 6rem;
}
table.WorkTaskProcessing col.status {
  width: 8rem;
}
table.WorkTaskProcessing col.note {
  width: auto;
}
table.WorkTaskProcessing col.tel {
  width: 12rem;
}
table.WorkTaskProcessing col.supplier {
  width: 2rem;
}

input[type=password]::-ms-reveal {
  display: none;
}

:root {
  --elevation-1: 0px 2px 1px -1px rgba(0, 0, 0, 0.2),
    0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --elevation-2: 0px 3px 1px -2px rgba(0, 0, 0, 0.2),
    0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --elevation-3: 0px 3px 3px -2px rgba(0, 0, 0, 0.2),
    0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
  --elevation-4: 0px 2px 4px -1px rgba(0, 0, 0, 0.2),
    0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --elevation-5: 0px 3px 5px -1px rgba(0, 0, 0, 0.2),
    0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
  --elevation-6: 0px 3px 5px -1px rgba(0, 0, 0, 0.2),
    0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --elevation-7: 0px 4px 5px -2px rgba(0, 0, 0, 0.2),
    0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
  --elevation-8: 0px 5px 5px -3px rgba(0, 0, 0, 0.2),
    0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --elevation-9: 0px 5px 6px -3px rgba(0, 0, 0, 0.2),
    0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
  --elevation-10: 0px 6px 6px -3px rgba(0, 0, 0, 0.2),
    0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
  --elevation-11: 0px 6px 7px -4px rgba(0, 0, 0, 0.2),
    0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
  --elevation-12: 0px 7px 8px -4px rgba(0, 0, 0, 0.2),
    0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
  --elevation-13: 0px 7px 8px -4px rgba(0, 0, 0, 0.2),
    0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
  --elevation-14: 0px 7px 9px -4px rgba(0, 0, 0, 0.2),
    0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
  --elevation-15: 0px 8px 9px -5px rgba(0, 0, 0, 0.2),
    0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
  --elevation-16: 0px 8px 10px -5px rgba(0, 0, 0, 0.2),
    0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --elevation-17: 0px 8px 11px -5px rgba(0, 0, 0, 0.2),
    0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
  --elevation-18: 0px 9px 11px -5px rgba(0, 0, 0, 0.2),
    0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
  --elevation-19: 0px 9px 12px -6px rgba(0, 0, 0, 0.2),
    0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
  --elevation-20: 0px 10px 13px -6px rgba(0, 0, 0, 0.2),
    0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
  --elevation-21: 0px 10px 13px -6px rgba(0, 0, 0, 0.2),
    0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
  --elevation-22: 0px 10px 14px -6px rgba(0, 0, 0, 0.2),
    0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
  --elevation-23: 0px 11px 14px -7px rgba(0, 0, 0, 0.2),
    0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
  --elevation-24: 0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
  --elevation-dialog: var(--elevation-24);
  --elevation-picker: var(--elevation-24);
  --elevation-nav-drawer: var(--elevation-16);
  --elevation-right-drawer: var(--elevation-16);
  --elevation-dialog-bottom-sheet: var(--elevation-16);
  --elevation-button-floating-action-pressed: var(--elevation-12);
  --elevation-sub-menu: var(--elevation-9);
  --elevation-bottom-navigation-bar: var(--elevation-8);
  --elevation-menu: var(--elevation-8);
  --elevation-card-picked-up: var(--elevation-8);
  --elevation-raised-button-pressed: var(--elevation-8);
  --elevation-button-floating-action: var(--elevation-6);
  --elevation-snackbar: var(--elevation-6);
  --elevation-app-bar: var(--elevation-4);
  --elevation-refresh-indicator: var(--elevation-3);
  --elevation-quick-entry-3: var(--elevation-3);
  --elevation-search-bar-scrolled: var(--elevation-3);
  --elevation-card: var(--elevation-2);
  --elevation-raised-button: var(--elevation-2);
  --elevation-quick-entry: var(--elevation-2);
  --elevation-search-bar: var(--elevation-2);
  --elevation-switch: var(--elevation-1);
}

.modal-body {
  color: white !important;
}

.btn-circle.btn-sm {
  width: 30px;
  height: 30px;
  padding: 6px 0px;
  border-radius: 15px;
  font-size: 8px;
  text-align: center;
}

.btn-circle.btn-md {
  width: 50px;
  height: 50px;
  padding: 7px 10px;
  border-radius: 25px;
  font-size: 10px;
  text-align: center;
}

.btn-circle.btn-lg {
  width: 70px;
  height: 70px;
  padding: 10px 16px;
  border-radius: 35px;
  font-size: 12px;
  text-align: center;
}

.btn-circle.btn-xl {
  width: 70px;
  height: 70px;
  padding: 10px 16px;
  border-radius: 35px;
  font-size: 12px;
  text-align: center;
}

.top-row {
  display: flex;
  height: 3.5rem;
  align-items: center;
}

.main .top-row {
  justify-content: flex-end;
  border-bottom: 1px solid #d6d5d5;
  background-color: #f7f7f7;
}

.main .top-row > a,
.main .top-row .btn-link {
  margin-left: 1.5rem;
  white-space: nowrap;
}

.main .top-row a:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
}

.content {
  min-height: 100%;
  padding-top: 1.1rem;
  background-color: yellowgreen;
}

.navbar-toggler {
  background-color: rgba(255, 255, 255, 0.1);
}

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid red;
}

.validation-message {
  color: red;
}

@media (max-width: 767.98px) {
  .main .top-row:not(.auth) {
    display: none;
  }
  .main .top-row.auth {
    justify-content: space-between;
  }
  .main .top-row a,
  .main .top-row .btn-link {
    margin-left: 0;
  }
}
@media (min-width: 768px) {
  .main .top-row {
    position: sticky;
    top: 0;
  }
  .navbar-toggler {
    display: none;
  }
}
.SortIcon {
  --size: 0.75rem;
}
.SortIcon[data-hidden] {
  visibility: hidden;
}

@media (max-width: 991.98px) {
  .dw.Table {
    display: block;
    width: auto;
  }
  .dw.Table > colgroup {
    display: none;
  }
  .dw.Table > thead {
    display: none;
  }
  .dw.Table > tbody {
    --hover-background-color: #eef0f8;
    display: block;
  }
  .dw.Table > tbody > tr {
    margin-bottom: 0.125rem;
    display: grid;
    min-width: 0; /* NEW; needed for Firefox */
    min-height: 0; /* NEW */
    padding: 0.5rem;
    background-color: #ffffff;
    border-radius: 0.125rem;
    color: dimgray;
    font-family: "SegoeUI", sans-serif;
    font-size: 0.875rem;
    gap: 0.5rem 0.5rem;
    grid-auto-flow: row;
    grid-auto-rows: 1fr;
    grid-template-areas: "project project project tel date check" "status operator note note note check";
    grid-template-columns: auto auto 1fr auto auto 2rem;
    grid-template-rows: auto auto;
  }
  .dw.Table > tbody > tr > th,
  .dw.Table > tbody > tr > td {
    display: block;
  }
  .dw.Table > tbody > tr > td:nth-child(1) {
    display: none;
  }
  .dw.Table > tbody > tr > td:nth-child(2) {
    align-self: center;
    grid-area: check;
    justify-self: center;
  }
  .dw.Table > tbody > tr > td:nth-child(3) {
    align-self: center;
    grid-area: status;
    justify-self: center;
  }
  .dw.Table > tbody > tr > td:nth-child(3) .Icon {
    width: 1rem;
    height: 1rem;
  }
  .dw.Table > tbody > tr > td .number {
    font-weight: bold;
    grid-area: number;
  }
  .dw.Table > tbody > tr > td:nth-child(4) {
    grid-area: status;
  }
  .dw.Table > tbody > tr > td:nth-child(5) {
    overflow: hidden;
    min-width: 0; /* NEW; needed for Firefox */
    font-weight: bold;
    grid-area: project;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dw.Table > tbody > tr > td:nth-child(6) {
    grid-area: operator;
  }
  .dw.Table > tbody > tr > td:nth-child(7) {
    font-size: 12px;
    font-style: italic;
    grid-area: date;
  }
  .dw.Table > tbody > tr > td:nth-child(8) {
    overflow: hidden;
    color: grey;
    font-size: 0.875rem;
    font-style: italic;
    grid-area: note;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dw.Table > tbody > tr > td:nth-child(9) {
    overflow: hidden;
    min-width: 0;
    font-size: 12px;
    grid-area: tel;
    justify-self: end;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dw.Table > tbody > tr > td:nth-child(9) a {
    color: inherit;
    text-decoration: none;
  }
  .dw.Table > tbody > tr > td:nth-child(9) .Icon {
    display: none;
  }
}
.dw.NavigationDrawer {
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 1600;
  transform: translate3d(-100%, 0, 0);
  transition-duration: 0.2s;
}
.dw.NavigationDrawer[data-open] {
  transform: none;
}

.dw.NavigationDrawer-Scrim {
  grid-area: "1 / 1 / -1 / -1";
}

.TopMainLayout {
  display: grid;
  grid-template: "top" auto "main" 1fr/1fr;
}

.TopMainFooterLayout {
  display: grid;
  grid-template: "top" auto "main" 1fr "footer" auto/1fr;
}

.foo-fix {
  position: sticky;
  bottom: 0;
}

.dw.BottomDrawer.standard {
  z-index: 10000;
  position: static;
  max-height: calc(100% - 1rem);
  align-self: end;
}

.FlexColumnLayout {
  display: flex;
  flex-direction: column;
}
.FlexColumnLayout .FlexColumnLayout-Centered {
  align-self: center;
  margin-top: auto;
  margin-bottom: auto;
}

.scrollable {
  overflow: auto;
  height: 100%;
}

.ScrollableLoaderContainer {
  position: relative;
  display: grid;
  height: 100%;
  grid-template-areas: "c";
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}
.ScrollableLoaderContainer > .WindowsLoader,
.ScrollableLoaderContainer > .Scroller {
  grid-area: c;
}
.ScrollableLoaderContainer > .WindowsLoader {
  align-self: start;
  margin-right: 1rem;
  margin-left: 1rem;
}

.layout-flex-center-center {
  display: flex;
  justify-content: center;
  align-items: center;
}