body {
  margin: 0;
  padding: 0 120px 100px 120px;
  box-sizing: border-box;
  min-width: fit-content;
  color: #0A0A0A;
  background: #F5F5F5;
  font-family: "Geist", sans-serif;
}

.transition-500 {
  transition: 0.5s;
}

.swipe-out {
  opacity: 0;
  transform: translateX(-40%);
  transition: 0.5s;
}

.no-select {
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+/Edge */
  user-select: none; /* Standard */
}

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

h2 {
  font-weight: 600;
  font-size: 18px;
  line-height: 28px;
  margin: 0;
}

.hidden {
  display: none !important;
}

.invisible {
  opacity: 0 !important;
}

.font-xs {
  font-size: 12px;
  line-height: 16px;
}

.font-sm {
  font-size: 14px;
  line-height: 20px;
}

input, select {
  padding: 2px 12px;
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  line-height: 20px;
  font-size: 14px;
}
input::placeholder, select::placeholder {
  color: #737373;
}
input.disabled, select.disabled {
  pointer-events: none;
  opacity: 50%;
  background: #F5F5F5;
}

.icon-16 {
  width: 16px;
  height: 16px;
}

.icon-14 {
  width: 14px;
  height: 14px;
}

.spinning {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.btn {
  cursor: pointer;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  column-gap: 8px;
  background: #FFFFFF;
  border: #E5E5E5 1px solid;
  border-radius: 8px;
  width: fit-content;
  height: fit-content;
  box-sizing: border-box;
}
.btn.disabled {
  pointer-events: none !important;
  opacity: 50%;
}
.btn.btn-small {
  padding: 6px;
  height: 30px;
}
.btn.btn-table-utility {
  padding: 5px 8px;
  column-gap: 6px;
  height: 30px;
}
.btn.btn-table-utility img {
  width: 16px;
  height: 16px;
}
.btn.btn-black {
  color: #FAFAFA;
  background: #171717;
}
.btn.btn-gray {
  color: #0A0A0A;
  background: #F5F5F5;
  border: none;
}
.btn.btn-confirmation {
  width: 125px;
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  padding: 6px 12px;
  justify-content: center;
  border: none;
}
.btn.btn-confirmation.btn-cancel {
  background: #F5F5F5;
  color: #171717;
}
.btn.btn-confirmation.btn-delete {
  background: rgb(224, 52, 52);
  color: #FFFFFF;
}

.login-main {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100vw;
  min-height: 100vh;
  padding: 150px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}
.login-main .login-form {
  height: fit-content;
  width: 420px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  row-gap: 24px;
  box-sizing: border-box;
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 14px;
}
.login-main .login-form:not(.error) .message.error {
  display: none;
}
.login-main .login-form.error .input-label {
  color: rgb(224, 52, 52) !important;
}
.login-main .login-form.error input {
  border-color: rgb(224, 52, 52) !important;
}
.login-main .login-form .login-title {
  color: #0A0A0A;
  line-height: 28px;
  font-size: 18px;
  font-weight: 600;
}
.login-main .login-form .input-row {
  display: flex;
  flex-direction: column;
  width: 100%;
  row-gap: 8px;
}
.login-main .login-form .input-row .input-label {
  color: #0A0A0A;
  line-height: 20px;
  font-size: 14px;
  font-weight: 600;
}
.login-main .login-form .input-row .login-input {
  width: 100%;
  height: 40px;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  box-sizing: border-box;
}
.login-main .login-form .input-row .login-input:focus {
  outline: none;
}
.login-main .login-form .input-row .input-container {
  width: 100%;
  position: relative;
}
.login-main .login-form .input-row .input-container .login-input {
  padding-right: 34px;
}
.login-main .login-form .input-row .input-container .eye {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  width: 16px;
  height: 16px;
}
.login-main .login-form .input-row .input-container .eye .crossed {
  display: none;
}
.login-main .login-form .input-row .input-container .eye.crossed .open {
  display: none;
}
.login-main .login-form .input-row .input-container .eye.crossed .crossed {
  display: block;
}
.login-main .login-form .login-btn {
  width: 100%;
  height: 40px;
  line-height: 20px;
  font-weight: 500;
  font-size: 14px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.main {
  width: 1200px;
  margin-inline: auto;
}
.main .header {
  width: 100%;
  padding-block: 20px;
  box-sizing: border-box;
  display: inline-flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.main .header h1 {
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: 0;
  vertical-align: middle;
}
.main .header .header-btns {
  display: inline-flex;
  column-gap: 8px;
  justify-content: center;
  align-items: center;
  width: fit-content;
}
.main .header .header-btns .header-btn {
  padding: 5px 8px;
  display: inline-flex;
  column-gap: 6px;
  justify-content: center;
  align-items: center;
  width: fit-content;
  font-weight: 500;
  line-height: 16px;
  font-size: 12px;
}
.main .navbar {
  width: 100%;
  padding-top: 12px;
  padding-left: 16px;
  box-sizing: border-box;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 8px;
}
.main .navbar .nav-btns {
  display: inline-flex;
  column-gap: 0;
  flex: 1;
}
.main .navbar .nav-btns .nav-btn {
  display: inline-flex;
  align-items: center;
  column-gap: 8px;
  padding: 10px 22px;
  cursor: pointer;
}
.main .navbar .nav-btns .nav-btn.active {
  border-radius: 8px 8px 0 0;
  background: #FFFFFF;
}
.main .navbar .dropdown-filter {
  height: 32px;
  width: 288px;
  position: relative;
}
.main .navbar .dropdown-filter:not(.open) .dropdown {
  display: none;
}
.main .navbar .dropdown-filter:not(.open) .open-arrow {
  transform: rotate(-180deg);
}
.main .navbar .dropdown-filter .open-arrow {
  transition: 0.5s;
}
.main .navbar .dropdown-filter .filter-head {
  cursor: pointer;
  height: 32px;
  width: 288px;
  box-sizing: border-box;
  padding: 3px 12px;
  display: flex;
  column-gap: 4px;
  align-items: center;
  background: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
}
.main .navbar .dropdown-filter .filter-head .title {
  flex: 1;
}
.main .navbar .dropdown-filter .dropdown {
  display: flex;
  flex-direction: column;
  width: 288px;
  height: fit-content;
  box-sizing: border-box;
  padding: 4px;
  background: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #E5E5E5;
  z-index: 500;
  position: absolute;
}
.main .navbar .dropdown-filter .dropdown .option {
  padding: 6px 8px;
  display: flex;
  column-gap: 8px;
  cursor: pointer;
}
.main .navbar .dropdown-filter .dropdown .option.selected .checkbox {
  border: none;
  background: #0A0A0A;
}
.main .navbar .dropdown-filter .dropdown .option .checkbox {
  width: 16px;
  height: 16px;
  border: 1px solid #E5E5E5;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.main .navbar .dropdown-filter .dropdown .option .checkbox .check_12 {
  width: 12px;
  height: 12px;
  display: none;
}
.main .navbar .search-container {
  height: 32px;
  width: 288px;
  position: relative;
}
.main .navbar .search-container input {
  height: 32px;
  width: 288px;
  box-sizing: border-box;
  padding: 3px 32px 3px 12px;
  font-size: 14px;
  line-height: 20px;
}
.main .navbar .search-container .icon-16 {
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
}
.main .content {
  background: #FFFFFF;
  padding: 16px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
.main .content .upload {
  padding: 12px;
  border-radius: 14px;
  background: #F5F5F5;
  display: inline-flex;
  column-gap: 16px;
}
.main .content .upload:not(.include-year) .year-input {
  display: none !important;
}
.main .content .upload .file-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}
.main .content .upload .file-col .file-row {
  display: inline-flex;
  align-items: center;
  column-gap: 6px;
  transition: 0.5s;
  height: fit-content;
  word-break: break-word;
}
.main .content .upload .file-col .file-row:not(.show-warning) .file-row-warning {
  display: none;
}
.main .content .upload .file-col .file-row.show-warning {
  flex-wrap: wrap;
}
.main .content .upload .file-col .file-row .file-row-warning {
  width: 800px;
  padding-left: 7px;
  color: rgb(224, 52, 52);
  display: flex;
  column-gap: 8px;
  font-size: 14px;
  line-height: 20px;
}
.main .content .upload .file-col .file-row .form-dev-field {
  width: 190px;
  display: flex;
  flex-direction: column;
}
.main .content .upload .file-col .file-row .form-dev-field input, .main .content .upload .file-col .file-row .form-dev-field select {
  width: 190px;
  height: 30px;
}
.main .content .upload .file-col .file-row .year-input {
  width: 58px;
}
.main .content .upload .file-col .file-row.file-row-invisible {
  opacity: 0;
  transform: translateX(-20%);
}
.main .content .upload .upload-percentage-container {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  color: #0A0A0A;
  display: flex;
  column-gap: 12px;
}
.main .content .upload .upload-percentage-container .sep {
  color: #737373;
}
.main .content .upload #upload-btn {
  display: none;
}
.main .content .upload #upload-btn.uploading {
  width: 120px;
}
.main .content .upload .upload-percentage-container {
  display: none;
}
.main .content .upload.uploading .upload-percentage-container {
  display: flex;
}
.main .content .upload.valid #upload-btn {
  display: flex;
}
.main .content .table {
  border: #E5E5E5 1px solid;
  border-radius: 8px;
  width: 100%;
  display: flex;
  flex-direction: column;
}
.main .content .table .eis-candidate {
  width: 100%;
  flex-direction: column;
  display: flex;
}
.main .content .table .eis-candidate.no-candidates .arrow-cell {
  cursor: auto !important;
}
.main .content .table .eis-candidate.no-candidates .arrow-cell img {
  display: none;
}
.main .content .table .eis-candidate .arrow-cell img {
  transition: 0.5s;
}
.main .content .table .eis-candidate.open .arrow-cell img {
  transform: rotate(90deg);
}
.main .content .table .eis-candidate .eis-candidate-rows {
  overflow: hidden;
  transition: max-height 0.5s;
}
.main .content .table .eis-candidate:not(.open) .eis-candidate-rows {
  max-height: 0 !important;
}
.main .content .table .eis-candidate .eis-candidate-rows {
  flex-direction: column;
  display: flex;
}
.main .content .table .estimate-eis-row {
  height: fit-content;
  width: 100%;
  border-bottom: #E5E5E5 1px solid;
  background: #F5F5F5;
  box-sizing: border-box;
  overflow: hidden;
}
.main .content .table .estimate-eis-row .estimate-eis-row-loading {
  width: 100%;
  height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.main .content .table .estimate-eis-row .estimate-eis-row-loading .loader {
  width: 60px;
  height: 60px;
  border: 6px solid #ddd;
  border-top: 6px solid rgba(40, 106, 135, 0.25);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.main .content .table .estimate-eis-row .table-container {
  width: 100%;
  box-sizing: border-box;
  height: 100%;
  padding: 20px 50px;
}
.main .content .table .estimate-eis-row .table-container.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.main .content .table .estimate-eis-row .table-container .table-title {
  line-height: 30px;
  font-weight: 600;
  font-size: 20px;
}
.main .content .table .estimate-eis-row .table {
  background: #FFFFFF;
}
.main .content .table .estimate-eis-row {
  transition: max-height 0.5s;
}
.main .content .table .estimate-eis-row.opened {
  transition: max-height 0s !important;
  max-height: unset !important;
}
.main .content .table .estimate-eis-row:not(.open) {
  max-height: 0 !important;
  border-bottom: none;
}
.main .content .table .table-row {
  display: inline-flex;
  padding: 8px 12px;
  border-bottom: #E5E5E5 1px solid;
  font-size: 14px;
  line-height: 20px;
  position: relative;
}
.main .content .table .table-row.part-row {
  background: #7CAFDD !important;
  font-size: 16px !important;
  font-weight: 500;
  color: #fff;
}
.main .content .table .table-row .arrow-cell {
  width: 34px;
  cursor: pointer;
  transition: 0.5s;
}
.main .content .table .table-row .arrow-cell.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.main .content .table .table-row.open .arrow-cell {
  transform: rotate(90deg);
}
.main .content .table .table-row[task-status=ADDING] .download-btn, .main .content .table .table-row[task-status=ADDING_TO_DATABASE] .download-btn, .main .content .table .table-row[task-status=SCRAPER_PROCESSING] .download-btn, .main .content .table .table-row[task-status=FINDING_POSITIONS] .download-btn, .main .content .table .table-row[task-status=FINISHING_EXCEL] .download-btn {
  display: none !important;
}
.main .content .table .table-row.header-row {
  font-size: 12px;
  line-height: 16px;
  color: #737373;
  padding-block: 12px;
}
.main .content .table .table-row.header-row .table-cell.sortable-header {
  cursor: pointer;
  user-select: none;
  column-gap: 2px;
}
.main .content .table .table-row.header-row .table-cell.sortable-header .sort-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.main .content .table .table-row.header-row .table-cell.sortable-header .sort-icon-none {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
}
.main .content .table .table-row.header-row .table-cell.sortable-header .sort-icon-active {
  display: none;
  transform: rotate(0deg);
  transition: transform 0.2s ease;
}
.main .content .table .table-row.header-row .table-cell.sortable-header.asc .sort-icon-none, .main .content .table .table-row.header-row .table-cell.sortable-header.desc .sort-icon-none {
  display: none;
}
.main .content .table .table-row.header-row .table-cell.sortable-header.asc .sort-icon-active, .main .content .table .table-row.header-row .table-cell.sortable-header.desc .sort-icon-active {
  display: inline-flex;
  filter: brightness(0);
}
.main .content .table .table-row.header-row .table-cell.sortable-header.asc .sort-icon-active {
  transform: rotate(180deg);
}
.main .content .table .table-row.header-row .table-cell.sortable-header.desc .sort-icon-active {
  transform: rotate(0deg);
}
.main .content .table .table-row .table-cell {
  padding-inline: 7px;
  align-items: center;
  box-sizing: border-box;
  display: inline-flex;
  column-gap: 8px;
}
.main .content .table .table-row .table-cell.name-cell {
  flex: 1;
  word-break: break-word;
}
.main .content .table .table-row .table-cell.user-cell {
  width: 110px;
}
.main .content .table .table-row .table-cell.date-cell {
  width: 150px;
}
.main .content .table .table-row .table-cell.date-cell.year-only {
  width: 98px;
}
.main .content .table .table-row .table-cell.token-cell {
  width: 90px;
}
.main .content .table .table-row .table-cell.status-cell {
  width: 141px;
}
.main .content .table .table-row .table-cell.tender-total-cell {
  width: 100px;
}
.main .content .table .table-row .table-cell.agreement-total-cell {
  width: 125px;
}
.main .content .table .table-row .table-cell.agreement-diff-cell {
  width: 70px;
}
.main .content .table .table-row .table-cell.actions-cell {
  width: 61px;
}
.main .content .table .table-row .table-cell.name-cell {
  flex: 1;
}
.main .content .table .table-row .table-cell.email-cell {
  flex: 1;
}
.main .content .table .table-row .table-cell.role-cell {
  flex: 1;
}
.main .content .table .table-row .table-cell.cur-status-cell {
  width: 110px;
}
.main .content .table .table-row .table-cell.seen-cell {
  width: 150px;
}
.main .content .table .table-row .table-cell.actions-cell {
  width: 65px;
}
.main .content .table .table-row .table-cell.eis-date-cell {
  width: 100px;
}
.main .content .table .table-row .table-cell.eis-contractor-cell {
  width: 210px;
}
.main .content .table .table-row .table-cell.eis-value-cell {
  width: 130px;
}
.main .content .table .table-row .table-cell.eis-price-diff-cell {
  width: 85px;
}
.main .content .table .table-row .table-cell.eis-url-cell {
  width: 50px;
}
.main .content .table .table-row .table-cell.eis-procurements-cell {
  width: 85px;
}
.main .content .table .table-row .table-cell.role-cell select {
  width: 100%;
  height: 36px;
}
.main .content .table .table-row .table-cell:last-child {
  justify-content: end;
}
.main .content .table .table-row .table-cell.status-cell {
  flex-direction: column;
  align-items: start;
}
.main .content .table .table-row .table-cell.status-cell .error-text {
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: rgb(224, 52, 52);
}
.main .content .table .table-row .table-cell .status-badge {
  display: flex;
  column-gap: 4px;
  font-size: 12px;
  line-height: 16px;
  padding: 3px 8px;
  border-radius: 6px;
  height: fit-content;
  font-weight: 500;
  position: relative;
  align-items: center;
  margin-top: 4px;
}
.main .content .table .table-row .table-cell .status-badge:not(:hover) .tooltip-message {
  display: none;
}
.main .content .table .table-row .table-cell .status-badge .tooltip-message {
  position: absolute;
  bottom: calc(100% + 3px);
  width: max-content;
  left: 50%;
  transform: translateX(-50%);
  color: #FFFFFF;
  background: #0A0A0A;
  border-radius: 8px;
  padding: 6px 12px;
}
.main .content .table .table-row .table-cell .status-badge .tooltip-message:after {
  content: "";
  width: 6px;
  height: 6px;
  background: #0A0A0A;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
  display: block;
  position: absolute;
}
.main .content .table .table-row .table-cell .status-badge.DONE, .main .content .table .table-row .table-cell .status-badge.ONLINE, .main .content .table .table-row .table-cell .status-badge.success {
  color: #16A34A;
  background: rgba(22, 163, 74, 0.1);
}
.main .content .table .table-row .table-cell .status-badge.ADDING, .main .content .table .table-row .table-cell .status-badge.PROCESSING, .main .content .table .table-row .table-cell .status-badge.SCRAPER_PROCESSING, .main .content .table .table-row .table-cell .status-badge.ADDING_TO_DATABASE, .main .content .table .table-row .table-cell .status-badge.FINDING_POSITIONS, .main .content .table .table-row .table-cell .status-badge.FINISHING_EXCEL {
  color: #9919E3;
  background: rgba(153, 25, 227, 0.1019607843);
}
.main .content .table .table-row .table-cell .status-badge.FAILED, .main .content .table .table-row .table-cell .status-badge.ERROR {
  color: rgb(224, 52, 52);
  background: rgba(224, 52, 52, 0.1019607843);
}
.main .content .table .table-row .table-cell .status-badge.OFFLINE, .main .content .table .table-row .table-cell .status-badge.warning {
  color: #E39219;
  background: rgba(227, 146, 25, 0.1019607843);
}
.main .content .table .table-row .table-cell .status-badge.INVITE_SENT {
  color: #0284C7;
  background: rgba(2, 132, 199, 0.1019607843);
}
.main .content .table .table-row .table-cell .actions-container {
  position: relative;
}
.main .content .table .table-row .table-cell .actions-container:not(.open) .actions-dropdown {
  display: none;
}
.main .content .table .table-row .table-cell .actions-container .actions-dropdown {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  padding: 4px 0;
  border: 1px solid #E5E5E5;
  font-size: 16px;
  line-height: 24px;
  background: #FFFFFF;
  border-radius: 8px;
  min-width: 178px;
  z-index: 10;
}
.main .content .table .table-row .table-cell .actions-container .actions-dropdown .action-row {
  display: flex;
  align-items: center;
  padding: 8px 16px;
  column-gap: 8px;
  cursor: pointer;
}
.main .content .table .table-row .table-cell .actions-container .actions-dropdown .action-row:nth-last-child(2) {
  border-bottom: 1px solid #E5E5E5;
}
.main .content .table .table-row .table-cell .actions-container .actions-dropdown .action-row.delete-row {
  color: rgb(224, 52, 52);
}
.main .content .pagination {
  height: 64px;
  width: 100%;
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
}
.main .content .pagination .pages {
  font-size: 14px;
  line-height: 20px;
  color: #737373;
}
.main .content .pagination .pages .num {
  color: #0A0A0A;
}
.main .content .pagination .page-toggles {
  display: inline-flex;
  column-gap: 4px;
}
.main .content .pagination .page-toggles .page-toggle {
  font-size: 14px;
  line-height: 20px;
  display: inline-flex;
  align-items: center;
  column-gap: 6px;
  padding: 6px 12px;
  cursor: pointer;
  font-weight: 500;
}
.main .content .pagination .page-toggles .page-toggle.disabled {
  pointer-events: none;
  opacity: 55%;
}

.modal-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;
  position: fixed;
  background: rgba(0, 0, 0, 0.5019607843);
  z-index: 500;
  top: 0;
  left: 0;
}
.modal-container .modal {
  padding: 16px;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 16px;
  border-radius: 8px;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.08);
}
.modal-container .modal .icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(224, 52, 52, 0.1019607843);
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal-container .modal span {
  width: 170px;
  text-align: center;
}
.modal-container .modal .confirmation-btns {
  display: inline-flex;
  column-gap: 8px;
}
.modal-container .modal .modal-head {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.modal-container .modal .modal-head .icon-16 {
  cursor: pointer;
}
.modal-container .modal .modal-form {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
  width: 100%;
}
.modal-container .modal .modal-form .field-container {
  display: flex;
  flex-direction: column;
}
.modal-container .modal .modal-form .field-container label, .modal-container .modal .modal-form .field-container .label {
  padding: 4px;
  font-size: 14px;
  line-height: 20px;
}
.modal-container .modal .modal-form .field-container .input {
  width: 100%;
  height: 36px;
}
.modal-container .modal .bottom-btn {
  width: 100%;
  height: 40px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
}

.line-seperator {
  width: 100%;
  height: 1px;
  background: #E5E5E5;
}

.block-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}
.block-wrapper .table-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.block-wrapper .table-title-row .btn {
  display: flex;
  align-items: center;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.block-wrapper .user-settings {
  display: flex;
  width: 100%;
  column-gap: 12px;
  align-items: end;
}
.block-wrapper .user-settings .btn {
  font-weight: 500;
  padding: 10px 24px;
  font-size: 14px;
  line-height: 20px;
}
.block-wrapper .user-settings .setting-field {
  flex: 1;
  display: flex;
  flex-direction: column;
  line-height: 20px;
  font-size: 14px;
}
.block-wrapper .user-settings .setting-field .setting-label {
  width: 100%;
  box-sizing: border-box;
  padding: 4px;
  font-weight: 500;
}
.block-wrapper .user-settings .setting-field .input {
  padding: 5px 12px;
  height: 36px;
  font-weight: 400;
  box-sizing: border-box;
}

.message {
  width: 100%;
  padding: 12px 16px;
  border-radius: 10px;
  display: flex;
  column-gap: 12px;
  box-sizing: border-box;
}
.message .icon-16 {
  display: none;
}
.message .message-text {
  display: flex;
  flex-direction: column;
  row-gap: 2px;
  font-size: 14px;
  line-height: 20px;
  box-sizing: border-box;
}
.message .message-text .message-title {
  font-weight: 500;
}
.message .message-text .message-main {
  font-weight: 400;
}
.message.info {
  background: rgba(2, 132, 199, 0.1019607843);
}
.message.info .message-title {
  color: #0284C7;
}
.message.info .message-main {
  color: rgba(2, 132, 199, 0.8);
}
.message.info .icon-16.info {
  display: block;
}
.message.error {
  background: rgba(224, 52, 52, 0.1019607843);
}
.message.error .message-title {
  color: rgb(224, 52, 52);
}
.message.error .message-main {
  color: rgba(224, 52, 52, 0.8039215686);
}
.message.error .icon-16.error {
  display: block;
}
.message.success {
  background: rgba(22, 163, 74, 0.1);
}
.message.success .message-title {
  color: #16A34A;
}
.message.success .message-main {
  color: rgba(22, 163, 74, 0.8);
}
.message.success .icon-16.success {
  display: block;
}

.modal.validatable .message.error {
  display: none;
}
.modal.validatable .message.success {
  display: none;
}
.modal.validatable:not(.valid) .bottom-btn {
  pointer-events: none !important;
  opacity: 50%;
}
.modal.validatable.error .message.error {
  display: flex;
}
.modal.validatable.error .field-container.password {
  color: rgb(224, 52, 52);
}
.modal.validatable.error .field-container.password input {
  border-color: rgb(224, 52, 52);
}
.modal.validatable.success .message.success {
  display: flex;
}
.modal.validatable.success .bottom-btn {
  display: none;
}
.modal.validatable.success .modal-form {
  display: none;
}

:focus {
  outline: none;
}

.body-loading {
  cursor: wait !important;
}
.body-loading .btn, .body-loading input, .body-loading select, .body-loading a {
  pointer-events: none;
  opacity: 0.5;
}

.keywords {
  padding: 12px;
  border-radius: 14px;
  background: #F5F5F5;
  display: inline-flex;
  column-gap: 16px;
}
.keywords .keyword {
  padding: 8px 16px;
  display: flex;
  align-items: center;
  column-gap: 8px;
  background: #FFFFFF;
  border: #E5E5E5 1px solid;
  border-radius: 8px;
  width: fit-content;
  height: fit-content;
  box-sizing: border-box;
}
.keywords .keyword img {
  padding: 3px;
  cursor: pointer;
}
.keywords .add-keyword {
  display: flex;
  column-gap: 8px;
  flex-wrap: wrap;
}
.keywords .add-keyword input {
  padding: 8px 16px;
  background: #FFFFFF;
  border: #E5E5E5 1px solid;
  border-radius: 8px;
  width: 220px;
  height: 39px;
  box-sizing: border-box;
}
.keywords .add-keyword img {
  width: 24px;
  cursor: pointer;
}

/*# sourceMappingURL=styles.css.map */
