/* src/styles.css */
:root {
  --body-bg-color: #F6F9FE;
  --primary-bg-color: #FFFFFF;
  --secondary-button-color: #F2F6FD;
  --primary-button-disabled-color: #F2F6FD;
  --ok-button-disabled-color: #F2F6FD;
  --secondary-button-disabled-color: #F2F6FD;
  --table-row-hover-color: #F2F6FD;
  --sorted-bg-color: #FAFAFA;
  --hover-item-bg-color: #F2F2F2;
  --error-bg-color: #FFE4E3;
  --primary-font-color: #57729C;
  --secondary-button-font-color: #57729C;
  --dark-font-color: #0F2B57;
  --gray-font-color: #889DBC;
  --accent-blue: #6550F2;
  --accent-blue-hover: #643FE8;
  --accent-blue-hover-2: #6227DA;
  --bg-base: #FFFFFF;
  --bg-surface: #FFFFFF;
  --bg-surface-2: #F4F5F9;
  --bg-surface-2-hover: #EAEBF4;
  --bg-surface-2-hover-2: #D9D9EB;
  --divider: #D9DBED;
  --error-text: #E43838;
  --error-hover: #D03030;
  --error-hover-2: #BB2A2A;
  --row-active: #F4F5F9;
  --row-hover: #F4F5F9;
  --success-text: #008B24;
  --success-text-2: #E8F5E9;
  --text-secondary: #656988;
  --text-primary: #222646;
  --text-disabled: #9292AD;
  --text-disabled-2: #ACB0D2;
  --warning-divider: #FFC107;
  --warning-1: rgba(242, 196, 29, 0.24);
  --primary-button-disabled-font-color: #ACBCD2;
  --ok-button-disabled-font-color: #ACBCD2;
  --secondary-button-disabled-font-color: #ACBCD2;
  --gray-color: #ACBCD2;
  --link-font-color: #256BDA;
  --primary-button-color: #256BDA;
  --primary-button-border-color: #256BDA;
  --primary-button-hover-color: #256BDA;
  --ok-button-color: #008B24;
  --ok-button-hover-color: #008B24;
  --pos-color: #008B24;
  --neg-color: #E43838;
  --border-color: #D2E2F9;
  --primary-button-disabled-border-color: #D2E2F9;
  --ok-button-disabled-border-color: #D2E2F9;
  --secondary-button-border-color: #D2E2F9;
  --secondary-button-disabled-border-color: #D2E2F9;
  --secondary-button-hover-color: #DDE8F9;
  --input-border-color: #C0CEE0;
  --input-bg-color: #EFEFEF;
  --sort-default-color: #EBEAEA;
  --sort-active-color: #D5D5D5;
  --primary-button-font-color: #FFFFFF;
  --ok-button-font-color: #FFFFFF;
  --ok-button-border-color: #BAD1F5;
  --cancel-button-border-color: #BAD1F5;
  --border: var(--border-color) 1px solid;
  --box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.16);
}
html.theme-dark {
  --body-bg-color: #1B1D23;
  --primary-bg-color: #23262A;
  --primary-button-font-color: #23262A;
  --ok-button-font-color: #23262A;
  --secondary-button-color: #1B1D23;
  --primary-button-disabled-color: #1B1D23;
  --ok-button-disabled-color: #1B1D23;
  --secondary-button-disabled-color: #1B1D23;
  --table-row-hover-color: #1B1D23;
  --sorted-bg-color: #1F2328;
  --hover-item-bg-color: #F2F2F2;
  --error-bg-color: #372525;
  --primary-font-color: #8B9CB7;
  --secondary-button-font-color: #8B9CB7;
  --dark-font-color: #E6E6E6;
  --gray-font-color: #5C6677;
  --accent-blue: #6552F3;
  --accent-blue-hover: #6663FD;
  --accent-blue-hover-2: #6F6DFF;
  --bg-base: #1D1D1F;
  --bg-surface: #212124;
  --bg-surface-2: #2B2B2E;
  --bg-surface-2-hover: #343437;
  --bg-surface-2-hover-2: #3C3C40;
  --divider: #353538;
  --error-text: #E45453;
  --error-hover: #ED605F;
  --error-hover-2: #FC706F;
  --row-active: #2A2A2E;
  --row-hover: #2A2A2E;
  --success-text: #09B150;
  --success-text-2: #2E3730;
  --text-secondary: #9797A2;
  --text-primary: #E6E6E6;
  --text-disabled: #63636A;
  --text-disabled-2: #5B5B62;
  --warning-divider: #CBA124;
  --warning-1: rgba(185, 152, 33, 0.24);
  --primary-button-disabled-font-color: #67707E;
  --ok-button-disabled-font-color: #67707E;
  --secondary-button-disabled-font-color: #67707E;
  --gray-color: #67707E;
  --link-font-color: #33A3FF;
  --primary-button-color: #33A3FF;
  --primary-button-border-color: #33A3FF;
  --primary-button-hover-color: #33A3FF;
  --ok-button-color: #09B150;
  --ok-button-hover-color: #09B150;
  --pos-color: #09B150;
  --neg-color: #FF6664;
  --border-color: #313640;
  --primary-button-disabled-border-color: #313640;
  --ok-button-disabled-border-color: #313640;
  --secondary-button-border-color: #313640;
  --secondary-button-disabled-border-color: #313640;
  --secondary-button-hover-color: #434A5A;
  --input-border-color: #5D6372;
  --input-bg-color: #33373D;
  --sort-default-color: #33373D;
  --sort-active-color: #4B4D52;
  --ok-button-border-color: #313640;
  --cancel-button-border-color: #313640;
  --border: var(--border-color) 1px solid;
  --box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.16);
}
html,
body,
input,
select,
textarea,
button,
td,
th {
  font-family:
    "Roboto",
    Arial,
    sans-serif;
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
  color: var(--primary-font-color);
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}
button {
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
body {
  background: var(--bg-base);
  margin: 0;
  box-sizing: border-box;
  min-width: 350px;
  min-height: 500px;
}
html,
body {
  height: 100%;
}
a,
button {
  cursor: pointer;
}
button:disabled {
  cursor: default;
}
a {
  color: var(--accent-blue);
  text-decoration: none;
}
a:hover {
  color: var(--accent-blue-hover);
}
a:active {
  color: var(--accent-blue-hover-2);
}
input,
select,
textarea {
  border: var(--input-border-color) 1px solid;
  background: var(--bg-base);
  padding: 7px 15px;
  border-radius: 4px;
  box-sizing: border-box;
  outline: none;
}
h1 {
  font-size: 22px;
  line-height: 28px;
}
h2 {
  font-size: 20px;
  line-height: 26px;
}
h3 {
  font-size: 18px;
  line-height: 22px;
}
h4 {
  font-size: 16px;
  line-height: 20px;
}
h5,
h6 {
  font-size: 14px;
  line-height: 18px;
}
.fill-mute {
  fill: var(--gray-font-color);
}
.fill-dark {
  fill: var(--dark-font-color);
}
.fill-link {
  fill: var(--primary-button-color);
}
.fill-mute .fill-stroke {
  fill: none;
  stroke: var(--gray-font-color);
}
.fill-dark .fill-stroke {
  fill: none;
  stroke: var(--dark-font-color);
}
.fill-link .fill-stroke {
  fill: none;
  stroke: var(--primary-button-color);
}
.font10 {
  font-size: 10px;
  line-height: 14px;
}
.font12 {
  font-size: 12px;
  line-height: 16px;
}
.font14 {
  font-size: 14px;
  line-height: 18px;
}
.font18 {
  font-size: 18px;
  line-height: 22px;
}
.font24 {
  font-size: 24px;
  line-height: 28px;
}
.font28 {
  font-size: 28px;
  line-height: 32px;
}
.font32 {
  font-size: 28px;
  line-height: 36px;
}
.bold100 {
  font-weight: 100;
}
.bold200 {
  font-weight: 200;
}
.bold300 {
  font-weight: 300;
}
.bold400 {
  font-weight: 400;
}
.bold500 {
  font-weight: 500;
}
.bold600 {
  font-weight: 600;
}
.bold700 {
  font-weight: 700;
}
.bold800 {
  font-weight: 800;
}
.bold900 {
  font-weight: 900;
}
.mt4 {
  margin-top: 4px;
}
.mt8 {
  margin-top: 8px;
}
.mt12 {
  margin-top: 12px;
}
.mt16 {
  margin-top: 16px;
}
.underline {
  text-decoration-line: underline;
  text-decoration-skip-ink: none;
}
button,
.button {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 24px;
  border-radius: 4px;
  border-width: 1px;
  border-style: solid;
  box-sizing: border-box;
}
.primary-button {
  width: 100%;
  padding: 11px 24px;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  color: var(--bg-surface);
  background-color: var(--accent-blue);
  transition: background-color 0.3s ease;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.primary-button:hover {
  background-color: var(--accent-blue-hover);
}
.primary-button:active {
  background-color: var(--accent-blue-hover-2);
}
.primary-button:disabled {
  cursor: default;
  color: var(--text-disabled-2);
  background-color: var(--bg-surface-2);
}
.primary-button app-svg-icon {
  fill: var(--primary-button-font-color);
}
.primary-button:disabled {
  color: var(--primary-button-disabled-font-color);
  background-color: var(--primary-button-disabled-color);
  border-color: var(--primary-button-disabled-border-color);
}
.primary-button:disabled app-svg-icon {
  fill: var(--primary-button-disabled-font-color);
}
.secondary-button {
  width: 100%;
  padding: 11px 24px;
  font-weight: 500;
  color: var(--accent-blue);
  background-color: var(--bg-surface-2);
  border: none;
  border-radius: 6px;
}
@media (hover: hover) {
  .secondary-button:hover {
    color: var(--accent-blue-hover);
    background-color: var(--bg-surface-2-hover);
  }
}
.secondary-button:active {
  color: var(--accent-blue-hover-2);
  background-color: var(--bg-surface-2-hover-2);
}
.warning-button {
  width: 100%;
  padding: 11px 24px;
  font-weight: 500;
  color: var(--bg-surface);
  background-color: var(--error-text);
  border: none;
  border-radius: 6px;
}
@media (hover: hover) {
  .warning-button:hover {
    background-color: var(--error-hover);
  }
}
.warning-button:active {
  background-color: var(--error-hover-2);
}
.primary-link {
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  color: var(--accent-blue);
  text-align: center;
  border: unset;
  background: unset;
  white-space: nowrap;
}
@media (hover: hover) {
  .primary-link:hover {
    color: var(--accent-blue-hover);
  }
}
.primary-link:active {
  color: var(--accent-blue-hover-2);
}
.primary-link:disabled {
  cursor: default;
  color: var(--text-disabled-2);
}
.icon-button {
  padding: 0;
  color: var(--text-secondary);
  border-radius: 6px;
  background: none;
  border: none;
  cursor: pointer;
}
.icon-button:hover {
  background-color: var(--bg-surface-2-hover);
}
.icon-button:active {
  background-color: var(--bg-surface-2-hover-2);
}
.pointer {
  cursor: pointer;
}
form {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0;
  gap: 8px;
  max-width: 348px;
}
.form-control {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 0;
  width: 100%;
}
.form-control-error {
  font-size: 12px;
  line-height: 14px;
  color: var(--error-text);
}
.form-control-error:empty {
  display: none;
}
.icon-in-input {
  position: relative;
  width: 100%;
}
.icon-in-input app-eye-button {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}
input[type=text],
input[type=password],
input[type=email],
input[type=tel],
input[type=number],
input[type=date],
input[type=url],
select,
textarea {
  height: 40px;
  appearance: none;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  padding: 0 16px;
  gap: 6px;
  border: 1px solid var(--divider);
  color: var(--text-disabled);
  border-radius: 6px;
  box-sizing: border-box;
  width: 100%;
}
input[type=text]:active,
input[type=password]:active,
input[type=email]:active,
input[type=tel]:active,
input[type=number]:active,
input[type=date]:active,
input[type=url]:active,
select:active,
textarea:active {
  border: 1px solid var(--accent-blue);
}
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
input[type=date]:focus,
input[type=url]:focus,
select:focus,
textarea:focus {
  border: 1px solid var(--accent-blue);
  color: var(--text-primary);
}
*::placeholder {
  color: var(--gray-font-color);
}
.id-system-logo {
  height: 39px;
  width: 132px;
  color: var(--text-secondary);
  fill: var(--bg-base);
}
.system-message {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  gap: 24px;
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */
