:root {
  --color-white: #ffffff;
  --color-black: black;
  --color-black-grey: #1d1d1f;
  --color-light-grey: #767676;
  --color-light-grey-trans60: #807c7c99;
  --color-navy-blue: #292934;
  --color-menu-blue: #203a6c;
  --color-orange: #f28500;
  --color-orange-trans60: #f2850099;
  --color-blue: #00a6f2;
  --color-blue-trans60: #00a6f299;
  --color-light-green: #19c527;
  --color-green: #118e1b;
  --color-green-trans35: #118e1b59;
  --color-yellow: #fbff00;
  --color-yellow-trans26: #fbff0042;
  --color-red: #ff0000;
  --color-red-trans34: #ff000057;
  --color-chat2: #13131b;
  --background-color: #303031;

  --font-family-base: "Montserrat", sans-serif;
  --font-family-alt: "Russo One", sans-serif;

  --button-height: 2.625rem;

  --transition-duration: 0.3s;

  --desktop-above: 120.0625rem;
  --desktop: 120rem;

  --tablet-above: 52.1875rem;
  --tablet: 52.125rem;

  --phone-above: 30.0625rem;
  --phone: 30rem;

  --phone-s-above: 22.5625rem;
  --phone-s: 22.5rem;

  --container-width: clamp(77.375rem, 3.096rem + 87vw, 107.5rem);
  --container-padding-x: clamp(1rem, 0.458rem + 2.41vw, 2rem);
}

body {
  font-family: var(--font-family-base);
  font-weight: 500;
  line-height: 1.28;
  color: var(--color-white);
  background-color: var(--background-color);
  line-height: 1.073;
}

/* чиним инпуты с календарями в safary */
input[type="date"],
input[type="datetime-local"] {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0.625rem;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.button,
input,
.custom-dropdown-trigger {
  height: var(--button-height);
  display: flex;
  justify-content: center;
  align-items: center;
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  background-color: transparent;
  color: inherit;
}

.list-group-item {
  width: 100%;
  position: absolute;
  z-index: 3;
  top: calc(100% - 0.125rem);
  right: 0;
  background-color: var(--color-navy-blue);
  display: none;
  border-radius: 0.625rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  box-shadow: 0rem 0.25rem 0.25rem 0rem var(--color-black-grey);
  max-height: 25rem;
  overflow-y: auto;
}

.search-item {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5rem;
  width: 100%;
  background-color: transparent;
  transition-duration: var(--transition-duration);
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  font-weight: 500;
  font-size: 1rem;
  text-align: left;
  border-radius: 0.625rem;
  border: none;
}

.search-item--without-hover {
  cursor: default;
}

@media (hover: hover) {
  .search-item:not(.search-item--without-hover):hover {
    background-color: var(--color-blue);
  }
}
@media (hover: none) {
  .search-item:not(.search-item--without-hover):active {
    background-color: var(--color-blue);
  }
}

.search-item span {
  width: max-content;
}

body input:-internal-autofill-selected {
  background-color: transparent !important;
  color: var(--color-white) !important;
  border-color: var(--color-light-grey);
}

.button {
  font-weight: 700;
  font-size: 0.875rem;
  gap: 0.6875rem;
}

a,
button,
textarea,
svg * {
  transition-duration: var(--transition-duration);
  color: inherit;
}

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

.container {
  width: 100%;
  max-width: calc(var(--container-width) + var(--container-padding-x) * 2);
  margin-inline: auto;
  padding-inline: var(--container-padding-x);
}

.visually-hidden {
  position: absolute !important;
  width: 0.0625rem !important;
  height: 0.0625rem !important;
  margin: -0.0625rem !important;
  border: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
  -webkit-clip-path: inset(100%) !important;
  clip-path: inset(100%) !important;
  clip: rect(0 0 0 0) !important;
  overflow: hidden !important;
}

@media (max-width: 29.9375rem) {
  .hidden-up-to-480 {
    position: absolute !important;
    width: 0.0625rem !important;
    height: 0.0625rem !important;
    margin: -0.0625rem !important;
    border: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    -webkit-clip-path: inset(100%) !important;
    clip-path: inset(100%) !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
  }
}

.pos-relative {
  position: relative;
}

.width100 {
  width: 100%;
}

.m-top15 {
  margin-top: 0.9375rem;
}

.m-top20 {
  margin-top: 1.25rem;
}

.m-top25 {
  margin-top: 1.5625rem;
}

.m-top40 {
  margin-top: 2.5rem;
}

.m-top-auto {
  margin-top: auto;
}

.m-bottom20 {
  margin-bottom: 1.25rem;
}

.gap8 {
  gap: 0.5rem;
}

.gap10 {
  gap: 0.625rem;
}

.gap15 {
  gap: 0.9375rem;
}

.font-family-alt {
  font-family: var(--font-family-alt);
}

.content-size {
  display: flex;
}

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

.flex-center--column {
  flex-direction: column;
}

.j-c-flex-end {
  justify-content: flex-end;
}

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

.abs-center {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}

.m-left-auto {
  margin-left: auto;
}

.button--orange {
  background-color: var(--color-orange-trans60);
  border-color: var(--color-orange);
}
.button--orange:focus {
  background-color: var(--color-orange);
  outline: none;
}
@media (hover: hover) {
  .button--orange:hover {
    background-color: var(--color-orange);
  }
}
@media (hover: none) {
  .button--orange:active {
    background-color: var(--color-orange);
  }
}

.button--gray {
  background-color: var(--color-light-grey-trans60);
}
.button--gray:focus {
  background-color: var(--color-orange);
  border-color: var(--color-orange);
  outline: none;
}
@media (hover: hover) {
  .button--gray:hover {
    background-color: var(--color-orange);
    border-color: var(--color-orange);
  }
}
@media (hover: none) {
  .button--gray:active {
    background-color: var(--color-orange);
    border-color: var(--color-orange);
  }
}

.button--with-orange-border {
  border-color: var(--color-orange);
}

.button--blue {
  background-color: var(--color-blue-trans60);
  border-color: var(--color-blue);
}
.button--blue:focus {
  background-color: var(--color-blue);
  outline: none;
}
@media (hover: hover) {
  .button--blue:hover {
    background-color: var(--color-blue);
  }
}
@media (hover: none) {
  .button--blue:active {
    background-color: var(--color-blue);
  }
}

.closing-accordion {
  position: relative;
}

.hidden-summary-arrow {
  list-style: none;
  position: relative;
}
.hidden-summary-arrow::-webkit-details-marker {
  display: none;
}

.modal-overlay {
  width: 100%;
  height: 100%;
  min-height: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  border: none;
  color: inherit;
  background-color: var(--color-chat2);
  overflow: hidden;
}
.modal-overlay:modal {
  max-width: 100%;
  max-height: 100%;
}

/*? header хедер */

.header {
  background-color: var(--color-black-grey);
}

.header {
  position: sticky;
  top: 0;
  width: 100%;
  transition: transform 0.3s ease;
  z-index: 4;
  background-color: var(--color-black-grey);
}

.header--hidden {
  transform: translate3d(
    0,
    -100%,
    0
  ); /* Сдвигает хедер вверх за пределы видимости */
}

/*? header nav навигация хедера */

.header-nav {
  display: flex;
  flex-direction: row;
  row-gap: 0.625rem;
  column-gap: 1.25rem;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding-block: 0.875rem;
}
@media (min-width: 48rem) {
  .header-nav {
    justify-content: flex-start;
  }
}

/*? account кнопка */

.header-nav__account-button {
  position: relative;
  display: flex;
  transition-duration: var(--transition-duration);
  cursor: pointer;
}
.header-nav__account-button:focus {
  outline: 0.125rem solid var(--color-blue-trans60);
  border-radius: 3.75rem;
}

.section__cabinet-avatar-icon-wrapper {
  width: 6.25rem;
  height: 6.25rem;
}
.section__cabinet-avatar-icon-wrapper svg,
.chat__sidebar-link-icon-wrapper svg {
  width: 100%;
  height: 100%;
}

.avatar,
.overlay-menu__icon-wrapper svg {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
}
@media (min-width: 48rem) {
  .avatar,
  .overlay-menu__icon-wrapper svg {
    width: 3.125rem;
    height: 3.125rem;
  }
}

@media (min-width: 64rem) {
  .avatar,
  .overlay-menu__icon-wrapper svg {
    width: 3.75rem;
    height: 3.75rem;
  }
}

use {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.header-nav__account-links-list {
  position: absolute;
  top: 100%;
  left: 75%;
  background-color: var(--color-navy-blue);
  border-radius: 0 0.625rem 0.625rem 0.625rem;
  display: flex;
  flex-direction: column;
  box-shadow: 0rem 0.25rem 0.25rem 0rem var(--color-black-grey);
  overflow: hidden;
}

.header-nav__account-link {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 0.6875rem 0.9375rem;
  border-radius: 0.625rem;
}
@media (hover: hover) {
  .header-nav__account-link:hover {
    background-color: var(--color-blue);
  }
  .header-nav__account-link:hover svg path {
    fill: var(--color-white) !important;
  }
}
@media (hover: none) {
  .header-nav__account-link:active {
    background-color: var(--color-blue);
  }
  .header-nav__account-link:active svg path {
    fill: var(--color-white) !important;
  }
}

.header-nav__account-link-icon-wrapper {
  height: 1.5rem;
  width: 1.5rem;
}

.header-nav__account-link-icon-wrapper svg {
  height: 100%;
  width: 100%;
}
/*? search-bar строка поиска*/

.search-bar {
  --button-height: 2.75rem;
  width: 100%;
  order: 2;
}
@media (min-width: 48rem) {
  .search-bar {
    width: 24.0625rem;
    order: 0;
  }
}

.search-bar__form {
  display: flex;
  column-gap: 0.3125rem;
  justify-content: center;
}

.search-bar__elem {
  min-width: 4.375rem;
}

.search-bar__field-control {
  flex-grow: 1;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  padding-inline: 0.9375rem;
  font-size: 0.875rem;
  font-weight: 500;
}
.search-bar__field-control:focus {
  border-color: var(--color-blue);
  outline: none;
}
@media (hover: hover) {
  .search-bar__field-control:hover {
    border-color: var(--color-blue);
  }
}
@media (hover: none) {
  .search-bar__field-control:active {
    border-color: var(--color-blue);
  }
}

.search-bar__button-loupe {
  border-radius: 0;
}

.search-bar__button-scanner {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/*? overlay-menu кнопка меню:*/

.overlay-menu {
  position: relative;
  margin-left: auto;
  cursor: pointer;
}

.overlay-menu__icon-cont {
  border-radius: 0.625rem;
  cursor: pointer;
}

span:has(.overlay-menu__icon-badge) {
  position: relative;
}

.overlay-menu__icon-badge {
  z-index: 1;
  position: absolute;
  top: 0%;
  right: 0%;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 0.3125rem;
  background-color: var(--color-red);
}

@media (min-width: 120.0625rem) {
  .overlay-menu__icon-wrapper svg {
    transition-duration: var(--transition-duration);
    filter: grayscale(100%) brightness(0.7);
  }
  .overlay-menu__icon-cont:hover svg,
  .overlay-menu__summary:focus svg,
  .overlay-menu:focus svg {
    filter: none;
  }
}

.overlay-menu__body {
  position: fixed;
  top: 3.5625rem;
  left: 0.625rem;
  right: 0.625rem;
  z-index: 2;
  background-color: var(--color-menu-blue);
  border-radius: 0.625rem;

  overflow: hidden;
  box-shadow:
    0rem 0.0625rem 0.125rem 0rem #1d1d1f4a,
    0rem 0.1875rem 0.1875rem 0rem #1d1d1f42,
    0rem 0.4375rem 0.25rem 0rem #1d1d1f26,
    0rem 0.75rem 0.3125rem 0rem #1d1d1f0a,
    0rem 1.1875rem 0.3125rem 0rem #1d1d1f03;
}
@media (min-width: 48rem) {
  .overlay-menu__body {
    position: absolute;
    left: auto;
    top: 100%;
    right: 90%;
    border-top-right-radius: 0;
  }
}

.overlay-menu__links-list {
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.9375rem;
  padding: 0.9375rem;
  width: calc(100vw - var(--container-padding-x) * 2);
  max-width: max-content;
}
@media (min-width: 48rem) {
  .overlay-menu__links-list {
    width: calc(90.5vw - var(--container-padding-x) * 2);
  }
}

.overlay-menu__link {
  display: flex;
  flex-direction: column;
  height: 4.4375rem;
  justify-content: space-between;
  align-items: center;
  font-weight: 500;
  font-size: 0.75rem;
  text-transform: lowercase;
}

@media (hover: hover) {
  .overlay-menu__link:hover svg path {
    fill: var(--color-blue) !important;
  }
}
@media (hover: none) {
  .overlay-menu__link:active svg path {
    fill: var(--color-blue) !important;
  }
}

.overlay-menu__link--chat .overlay-menu__icon-badge {
  right: 0.125rem;
  top: 0.3125rem;
}

.custom-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
  user-select: none;
}

/* Прячем стандартный чекбокс, но оставляем доступным для клавиатуры */
.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Рисуем наш новый квадрат */
.checkmark {
  height: 1.625rem;
  width: 1.625rem;
  background-color: transparent;
  border: 0.0625rem solid var(--color-light-grey);
  border-radius: 0.1875rem;
  display: flex;
  position: relative;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 1rem;
  height: 1rem;
  background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.62033 6.85539C0.545909 6.79588 0.452244 6.76181 0.355755 6.765C0.259302 6.76816 0.168531 6.80768 0.102518 6.87581C0.0365052 6.94394 -0.000142753 7.03591 -0.000255615 7.13241C-0.000404775 7.22895 0.036596 7.3215 0.0984196 7.39401C0.388877 7.73347 0.675362 8.06494 0.96832 8.3984C3.04531 10.7504 5.17701 13.0086 7.59101 15.1177L8.5002 15.8806L9.07565 14.8027C9.47207 14.0604 9.8617 13.3146 10.2445 12.5654C12.0461 9.03969 13.6975 5.43721 15.1985 1.75793C15.3653 1.34913 15.5302 0.93937 15.6933 0.528667C15.7284 0.440079 15.7335 0.340544 15.7022 0.24922C15.671 0.15792 15.6066 0.0827067 15.5221 0.039542C15.4376 -0.00362265 15.339 -0.0117261 15.2467 0.016431C15.1543 0.0445644 15.0767 0.107048 15.0254 0.187398C14.7882 0.560183 14.5527 0.933917 14.3192 1.3086C12.217 4.68073 10.2652 8.12964 8.46358 11.6553C8.08074 12.4046 7.70468 13.1573 7.33541 13.9134L8.82005 13.5983C6.47413 11.6945 4.07534 9.63556 1.65247 7.6863C1.30861 7.40793 0.968036 7.13429 0.62033 6.85539Z" fill="white"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.custom-checkbox input:checked ~ .checkmark:after {
  display: block;
}

/*? header-notification уведомление*/

.header-notification {
  font-weight: 700;
  padding-block: 1.25rem;
  overflow: hidden;
  animation: disappear 0s linear 5s forwards;
}

.header-notification:not(:last-of-type) {
  display: none;
}

@keyframes disappear {
  to {
    opacity: 0;
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
  }
}

.header-notification--successfully {
  background: var(--color-blue);
}

.header-notification--unsuccessfully {
  background: var(--color-orange);
}

.header-notification__text {
  width: 100%;
  text-align: center;
  column-gap: 0.875rem;
  line-height: 1.5;
}

/*? main*/
.main {
  padding-block: clamp(1.5625rem, 0.625rem + 4.17vw, 1.875rem);
}
@media (min-width: 30rem) {
  .main {
    padding-block: clamp(1.875rem, 1.125rem + 1.39vw, 2.5rem);
  }
}

.main--dark {
  position: relative;
  background-color: var(--color-chat2);
  padding-block: 0;
}
/*? section секция*/

/*? section-header*/

.section {
  display: flex;
  flex-direction: column;
}

.section__header {
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  row-gap: 1.25rem;
  align-items: center;
  width: 100%;
  max-width: fit-content;
  margin-bottom: clamp(1.563rem, 1.224rem + 1.51vw, 2.188rem);
}

@media (min-width: 48rem) {
  .section__header--max-width-600 {
    max-width: 37.5rem;
  }
}

.section__header-title {
  text-align: center;
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.5rem, 0.838rem + 2.94vw, 2.25rem);
  column-gap: clamp(0.625rem, -0.3125rem + 4.17vw, 0.9375rem);
}
.planning-industry .section__header-title {
  line-height: 1.25;
}

.editing-tech-card .section__header {
  gap: 1.875rem;
}

.section__header-title--double {
  flex-wrap: wrap;
  row-gap: 0.625rem;
}

.section__header-title svg {
  height: 1.875rem;
  width: auto;
}

@media (min-width: 48rem) {
  .section__header-title svg {
    height: 2.1875rem;
  }
}
@media (min-width: 64rem) {
  .section__header-title svg {
    height: 2.5rem;
  }
}
.section__header-title--blue {
  color: var(--color-blue);
}

.section__header-title-dedicated-block,
.section__header-title-not-dedicated-block {
  width: max-content;
}

.section__header-title-dedicated-block {
  background-color: var(--color-blue-trans60);
  padding: 0.3125rem 0.625rem;
  border-radius: 0.625rem;
  font-family: Montserrat;
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 100%;
}

.section__header-greeting {
  font-size: clamp(0.875rem, 0.5rem + 1.67vw, 1rem);
  text-align: center;
}

.section__header-date-wrapper {
  letter-spacing: 0.02rem;
}

.section__header-button {
  width: 100%;
  padding-inline: 0.4375rem;
}

.section__header-buttons-cont {
  padding-top: 0.625rem;
  width: 100%;
  display: flex;
  gap: 0.625rem;
}

.section__header-buttons-cont .section__header-button {
  width: calc(50% - 0.625rem / 2);
}

@media (max-width: 47.9375rem) {
  .section__header-buttons-cont--alt {
    flex-direction: column;
  }
  .section__header-buttons-cont--alt .section__header-button {
    width: 100%;
  }
}

.section__color-block {
  width: fit-content;
  padding: 0.625rem;
  border-radius: 0.375rem;
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.25rem, 1.14rem + 0.49vw, 1.375rem);
  line-height: 100%;
  background-color: var(--color-blue-trans60);
  margin-top: 1.875rem;
}
@media (min-width: 48rem) {
  .section__color-block {
    margin-top: clamp(2.188rem, 1.83rem + 0.56vw, 2.5rem);
  }
}
.section__cabinet-header-subtitle-cont {
  margin-top: 0.625rem;
  flex-direction: column;
}

@media (min-width: 30rem) {
  .section__cabinet-header-subtitle-cont {
    flex-direction: row;
  }
}

.section__form {
  display: flex;
  flex-direction: column;
}

.section__buttons-cont {
  margin-top: 1.25rem;
  display: flex;
  width: 100%;
  gap: 0.625rem;
}

.planning-industry .section__buttons-cont {
  margin-top: 0;
}

.section__buttons-cont .button {
  width: 100%;
}

.section__other-buttons-cont {
  display: flex;
  gap: 1.25rem;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  padding-block: 0.9375rem;
  border-top: 0.125rem solid var(--color-light-grey);
  border-bottom: 0.125rem solid var(--color-light-grey);
  margin-bottom: 1.0625rem;
}

.section__other-buttons-cont--flex-end {
  justify-content: flex-end;
}

.section__other-buttons-cont--space-between {
  justify-content: space-between;
}

.section__other-buttons-cont--without-bottom-border {
  border-bottom: none;
  margin-bottom: 0;
}

.section__other-buttons-cont--without-top-border {
  border-top: none;
  padding-top: 0;
}

.section__other-buttons-cont--without-borders {
  border: none;
  padding: 0;
  font-size: 2.25rem;
}

.section__other-buttons-cont--without-m-bottom {
  margin-bottom: 0;
}

.section__other-buttons-cont--alt-m-bottom {
  margin-bottom: clamp(2.188rem, 1.83rem + 0.56vw, 2.5rem);
}

.section__other-buttons-cont-button {
  color: inherit;
  font-weight: 700;
  font-size: 1rem;
  line-height: 100%;
  border: none;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
}
@media (hover: hover) {
  .section__other-buttons-cont-button--orange:hover {
    color: var(--color-orange);
  }
  .section__other-buttons-cont-button--blue:hover {
    color: var(--color-blue);
  }
}
@media (hover: none) {
  .section__other-buttons-cont-button--orange:active {
    color: var(--color-orange);
  }
  .section__other-buttons-cont-button--blue:active {
    color: var(--color-blue);
  }
}

.section__other-buttons-cont-button--flex-start {
  justify-content: flex-start;
}

.section__other-buttons-cont-button--blue-with-underline {
  color: var(--color-blue);
  text-decoration: underline;
}


.section__subtitle {
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.5rem, 1.279rem + 0.98vw, 1.75rem);
  padding-bottom: 1.375rem;
  border-bottom: 0.125rem solid var(--color-light-grey);
  text-align: center;
}
@media (min-width: 48rem) {
  .section__subtitle {
    text-align: start;
  }
}

.section__subtitle--alt {
  text-align: start;
  color: var(--color-blue);
  font-size: clamp(1.25rem, 0.809rem + 1.96vw, 1.75rem);
  padding-bottom: 0.9375rem;
  margin-bottom: 1.25rem;
}

.operations-history .section__subtitle {
  margin-top: 0.625rem;
  padding-bottom: 0.625rem;
  text-align: start;
}

.operations-history .section__subtitle--with-border-top {
  margin-top: 1.25rem;
}

.section__subtitle--with-border-top {
  margin-top: 1.25rem;
  padding-top: 0.625rem;
  border-top: 0.125rem solid var(--color-light-grey);
}

.section__cabinet-header {
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5625rem;
  width: 100%;
  margin-bottom: clamp(1.563rem, 1.224rem + 1.51vw, 2.188rem);
}
@media (min-width: 85.375rem) {
  .section__cabinet-header {
    margin-bottom: clamp(2.188rem, 1.417rem + 0.9vw, 2.5rem);
  }
}

.section__cabinet-header-title {
  font-size: clamp(1.75rem, 1.309rem + 1.96vw, 2.25rem);
  font-family: var(--font-family-alt);
  font-weight: 400;
  line-height: 100%;
  text-align: center;
}

.section__cabinet-header-color-block {
  border-radius: 0.1875rem;
  padding: 0.3125rem;
  background-color: var(--color-menu-blue);
}

.section__special-cont1 {
  margin-top: -1.25rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  line-height: 1.5;
}

.section__special-cont2 {
  display: flex;
  column-gap: 0.9375rem;
  row-gap: 0.625rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 0.625rem;
}

.grouped {
  width: 100%;
  display: flex;
  gap: 0.9375rem;
  flex-direction: column;
  align-items: start;
  flex-wrap: wrap;
}
@media (min-width: 48rem) {
  .grouped {
    flex-direction: row;
    align-items: center;
  }
}

.grouped__text {
  font-size: clamp(1.5rem, 1.279rem + 0.98vw, 1.75rem);
  font-weight: 400;
  font-family: var(--font-family-alt);
}

.grouped__numbers {
  display: flex;
  overflow: hidden;
  border-radius: 0.625rem;
}

.grouped__number {
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-blue);
  padding: 0.625rem;
}
.grouped__number--quantity {
  background-color: var(--color-orange-trans60);
}

.pagination {
  width: 100%;
  display: flex;
  gap: 1rem;
  justify-content: center;
}

.pagination__block {
  display: flex;
  gap: 0.5rem;
}

.pagination__button {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 1.875rem;
  width: 1.875rem;
  color: inherit;
  background-color: var(--color-black-grey);
  border-radius: 0.1875rem;
  border: none;
}
.pagination__button--active {
  background-color: var(--color-orange-trans60);
}
@media (hover: hover) {
  .pagination__button:hover {
    background-color: var(--color-orange);
  }
}
@media (hover: none) {
  .pagination__button:active {
    background-color: var(--color-orange);
  }
}

.tables-cont {
  display: flex;
  flex-direction: column;
  margin-top: clamp(1.563rem, 1.224rem + 1.51vw, 2.188rem);
}
.tables-cont--first-type {
  gap: 1.25rem;
}
.tables-cont--second-type {
  gap: 1.25rem;
  margin-top: 1.5625rem;
}
.tables-cont--m-t-10-20 {
  margin-top: clamp(0.625rem, 0.074rem + 2.45vw, 1.25rem);
}
.tables-cont--m-t-20 {
  margin-top: 1.25rem;
}
.tables-cont--m-t-5 {
  margin-top: 0.3125rem;
}
.tables-cont--without-m-t {
  margin-top: 0;
}
.tables-cont--with-border-bottom {
  padding-bottom: 1.875rem;
  border-bottom: 0.125rem solid var(--light-grey, #767676);
}
.statement-week .tables-cont,
.salary-check-unchecked .tables-cont,
.salary-worker .tables-cont {
  padding-bottom: 1.875rem;
  border-bottom: 0.125rem solid var(--light-grey, #767676);
}

.statement-week .tables-cont:last-of-type,
.salary-check-unchecked .tables-cont:last-of-type,
.salary-worker .tables-cont:last-of-type {
  padding-bottom: 0;
  border-bottom: none;
}

@media (min-width: 48rem) {
  .tables-cont--with-border-bottom {
    padding-bottom: clamp(2.188rem, 1.83rem + 0.56vw, 2.5rem);
  }
}

.section:has(.person-checked) .tables-cont {
  margin-top: 2.5rem;
}

.cont__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.25rem, 0.809rem + 1.96vw, 1.75rem);
  padding-bottom: 0.9375rem;
  border-bottom: 0.125rem solid var(--color-light-grey);
}

.cont__header--with-border-top {
  padding-block: 0.9375rem;
  border-top: 0.125rem solid var(--color-light-grey);
}

.cont__header--without-border-bottom {
  border-bottom: none;
  margin-bottom: 0;
}

.cont__header-m-block12 {
  margin-block: 0.75rem;
}

.cont__header--without-borders {
  border: none;
}

.cont__title {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: inherit;
  font-weight: inherit;
  color: var(--color-blue);
  flex-wrap: wrap;
  row-gap: 0.3125rem;
}
.cont__title--inline {
  display: inline;
}
.cont__title--white-text {
  color: white;
}
.cont__title--color-block {
  font-family: var(--font-family-base);
  font-weight: 700;
  font-size: 1rem;
  background-color: var(--color-orange-trans60);
  color: var(--color-white);
  padding: 0.625rem;
  border-radius: 0.625rem;
}
.cont__quantity {
  color: var(--color-orange);
}

.cont__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media (min-width: 48rem) {
  .cont__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 85.375rem) {
  .cont__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.cont__list--narrow {
  grid-template-columns: 1fr;
}
@media (min-width: 48rem) {
  .cont__list--narrow-double {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 64rem) {
  .cont__list--narrow-double-alt {
    grid-template-columns: 1fr 1fr;
  }
}

.cont__list--narrow-triple {
  grid-template-columns: 1fr;
}
@media (min-width: 64rem) {
  .cont__list--narrow-triple {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 120rem) {
  .cont__list--narrow-triple {
    grid-template-columns: repeat(3, 1fr);
  }
}

.cont__list--single {
  grid-template-columns: 1fr;
}
.cont__list:has(.table-card-first__huge-dedicated-string) {
  grid-template-columns: 1fr;
}
@media (min-width: 64rem) {
  .cont__list:has(.table-card-first__huge-dedicated-string) {
    grid-template-columns: repeat(2, 1fr);
  }
}

.cont__item {
  overflow-x: hidden;
}

@media (hover: hover) {
  .table-card-first:hover {
    border-color: var(--color-orange);
  }
}
@media (hover: none) {
  .table-card-first:active {
    border-color: var(--color-orange);
  }
}

.table-card-first {
  word-break: keep-all;
  word-wrap: break-word; /* для старых браузеров */
  height: 100%;
  width: 100%;
  font-size: 1rem;
  padding: 0.9375rem;
  background-color: var(--color-black-grey);
  border-radius: 0.625rem;
  border: 0.125rem solid var(--color-light-grey);
  transition: border-color var(--transition-duration) ease;
  display: flex;
  flex-direction: column;
}

.table-card-first__title {
  font-family: var(--font-family-alt);
  font-size: clamp(1.25rem, 0.809rem + 1.96vw, 1.75rem);
  font-weight: 400;
  line-height: 110%;
  margin-bottom: 1.5625rem;
  display: flex;
  justify-content: space-between;
}
.table-card-first__title--alt {
  font-size: clamp(1.75rem, 1.309rem + 1.96vw, 2.25rem);
  font-family: var(--font-family-alt);
  font-weight: 400;
  line-height: 100%;
  justify-content: center;
}
.salary-check-unchecked .table-card-first__title--alt {
  justify-content: flex-start;
}

.table-card-first__title--light-green {
  color: var(--color-light-green);
}
.table-card-first__title--yellow {
  color: var(--color-yellow);
}
.table-card-first__title--red {
  color: var(--color-red);
}
.table-card-first__title--blue {
  color: var(--color-blue);
}
.table-card-first__title--green {
  color: var(--color-green);
}
.table-card-first__title--orange {
  color: var(--color-orange);
}

.table-card-first__title-cont,
.section__cabinet-header-subtitle-cont {
  display: flex;
  gap: 0.9375rem;
  flex-wrap: wrap;
  align-items: center;
}

.table-card-first__subtitle,
.section__cabinet-header-subtitle {
  margin-top: -0.3125rem;
  margin-bottom: 1.5625rem;
  padding: 0.3125rem 0.625rem;
  border-radius: 0.1875rem;
  background-color: var(--color-menu-blue);
}

.table-card-first__subtitle,
.section__cabinet-header-subtitle,
.table-card-first__subtitle-other,
.section__cabinet-header-subtitle-other {
  width: max-content;
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.25rem, 1.14rem + 0.49vw, 1.375rem);
}

.salary-check-unchecked .table-card-first__subtitle {
  width: fit-content;
}

.table-card-first__subtitle--alt {
  background-color: var(--color-blue-trans60);
  font-size: 1rem;
}

.salary-check .table-card-first__title,
.salary-check .table-card-first__subtitle,
.table-card-first__huge-dedicated-string .table-card-first__title {
  margin-block: 0;
}

.salary-check .table-card-first {
  gap: 1.25rem;
}

.tables-cont:has(.table-card-first__huge-dedicated-string) .table-card-first {
  padding: 1.25rem;
}

.table-card-first__title-cont .table-card-first__subtitle,
.section__cabinet-header .section__cabinet-header-subtitle,
.planning-industry .section__cabinet-header-subtitle {
  margin-block: 0;
}

.operations-history .section__cabinet-header-subtitle {
  background-color: var(--color-blue-trans60);
  width: 100%;
  text-align: center;
}

.table-card-first__title--m-b-20 {
  margin-bottom: 1.25rem;
}

.table-card-first__title-text {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  width: fit-content;
}

.table-card-first__huge-dedicated-string {
  width: 100%;
  background-color: var(--color-menu-blue);
  padding-block: 0.625rem;
  border-radius: 0.625rem;
}
.table-card-first__huge-dedicated-string--green-trans35 {
  background-color: var(--color-green-trans35);
}
.table-card-first__huge-dedicated-string--orange-trans35 {
  background-color: var(--color-orange-trans60);
}

.salary-check-unchecked .table-card-first__huge-dedicated-string {
  margin-top: 1.5625rem;
}

.table-card-first__form {
  display: flex;
  flex-direction: column;
  gap: 1.6875rem;
}
.table-card-first__form-input-cont {
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
}

.salary-check-unchecked .table-card-first__form-input-cont {
  margin-block: 1.5625rem;
  gap: 0.625rem;
}

.table-card-first__bottom-cont {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 1.6875rem;
}

.table-card-first__icon-with-text {
  margin-top: 0.625rem;
  display: flex;
  gap: 0.625rem;
  align-items: center;
}

.table__row .table-card-first__icon-with-text {
  margin-top: 0;
}

.table-card-first__input-with-button {
  display: flex;
  gap: 1.25rem;
  align-items: center;
}

.table-card-first__input-with-button .table__button-with-icon {
  height: 100%;
}

.table-card-first__input-with-button .table__button-with-icon svg {
  height: 100%;
  width: auto;
}

.table-card-first__statement-icon-wrapper {
  margin-block: 1.875rem 2.5rem;
  justify-content: center;
}

.table-card-first__sign-cont {
  display: grid;
  gap: 0.625rem;
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "signg signb"
    "signo signo";
}

.table-card-first__sign {
  padding: 0.9375rem;
  border-radius: 0.625rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.5625rem;
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.25rem, 1.14rem + 0.49vw, 1.375rem);
  text-align: center;
}
.table-card-first__sign--green {
  background-color: var(--color-green-trans35);
  grid-area: signg;
}
.table-card-first__sign--blue {
  background-color: var(--color-menu-blue);
  grid-area: signb;
}
.table-card-first__sign--orange {
  background-color: var(--color-orange-trans60);
  width: 100%;
  grid-area: signo;
}

.table-card-first__color-block {
  width: 100%;
  padding: 0.9375rem;
  display: flex;
  flex-direction: column;
  gap: 1.5625rem;
  justify-content: center;
  background-color: var(--color-green-trans35);
  border-radius: 0.625rem;
}

.table-card-first__color-block-item {
  text-align: center;
  font-family: var(--font-family-alt);
  font-size: clamp(1.25rem, 0.875rem + 1.67vw, 1.375rem);
  line-height: 100%;
}

.salary-worker .table-card-first--fix-height {
  min-height: 18.75rem;
}
.catalog-tech-cards .table-card-first--fix-height,
.catalog-operations .table-card-first--fix-height {
  min-height: 11.5rem;
}

.editing-tech-card .table-card-first--fix-height {
  min-height: 12.625rem;
  font-size: clamp(1.25rem, 0.864rem + 1.72vw, 1.688rem);
}

.editing-tech-card .table-card-first--fix-height .table-card-first__title {
  font-size: clamp(1.25rem, 0.864rem + 1.72vw, 1.688rem);
}

.table-card-first.processed .form-input {
  cursor: auto;
  border-color: transparent;
}

.table-card-second {
  height: 18.75rem;
  width: 100%;
  font-size: 1rem;
}

.table-card-third {
  width: 100%;
  font-size: 1rem;
}

.table-first {
  width: 100%;
  font-weight: 500;
}

.table-first tbody {
  display: flex;
  flex-direction: column;
  row-gap: 1.5625rem;
}

.table-first th {
  word-break: normal;
  word-wrap: normal;
  font-weight: 500;
  text-align: start;
}

.table-first--height100 {
  height: 100%;
}

.table-first--height100 tbody {
  height: 100%;
}

.table-first--navy-blue {
  background-color: var(--color-navy-blue);
  border-radius: 0.625rem;
}
.table-first--navy-blue tbody {
  padding: 0.9375rem;
}

.table-first td {
  text-align: end;
}

.table-first td.td--t-a-start {
  text-align: start;
}

.salary-worker .table-first,
.statement-week .table-first,
.salary-check-unchecked .table-first {
  margin-top: auto;
}

.catalog-tech-cards .table-first {
  height: 100%;
}

.table-second {
  width: 100%;
  height: 100%;
  font-weight: 600;
}

.table-second tbody {
  height: 100%;
  background-color: var(--color-navy-blue);
  width: 100%;
  display: flex;
  flex-direction: column;
}

.table-second tr {
  height: 20%;
  display: flex;
  align-items: stretch;
}

.table-second th,
.table-second td {
  font-weight: inherit;
  display: flex;
  align-items: center;
  padding-inline: 0.625rem;
}

.table-second th {
  width: 8.1875rem;
  text-align: start;
  background-color: var(--color-black-grey);
}

.table-third {
  width: 100%;
  font-weight: 600;
}

.table-third tbody {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 0.625rem;
}

.table-third tr {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.table-third th,
.table-third td {
  font-weight: inherit;
  height: var(--button-height);
  display: flex;
  align-items: center;
}

.table-third td {
  font-weight: 500;
}

.table-third th {
  padding-inline: 0.625rem;
  text-align: start;
  background-color: var(--color-navy-blue);
}
@media (min-width: 48rem) {
  .table-third th,
  .table-third td {
    width: 50%;
  }
}

@media (min-width: 48rem) {
  .table-third tr {
    flex-direction: row;
  }
}
@media (min-width: 48rem) {
  .table-third--alt tr {
    flex-direction: column;
  }
  .table-third--alt th,
  .table-third--alt td {
    width: 100%;
  }
}

@media (min-width: 48rem) {
  .narrow-wrapper {
    width: clamp(38rem, -10rem + 100vw, 54rem);
    align-self: center;
  }
}
@media (min-width: 85.375rem) {
  .narrow-wrapper {
    width: 47%;
  }
}
@media (min-width: 85.375rem) {
  .narrow-wrapper--alt {
    width: clamp(38rem, -10rem + 100vw, 54rem);
  }
}

.manager-comment {
  font-weight: 400;
}

.manager-comment__title {
  color: var(--color-blue);
  font-weight: 600;
  font-size: 1rem;
}

.form-wrapper {
  width: 100%;
  background-color: var(--color-black-grey);
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  padding: 0.9375rem;
}

.form-wrapper--m-t-20 {
  margin-top: 1.25rem;
}

.form-input {
  width: 100%;
  padding-inline: 0.625rem;
  transition-duration: var(--transition-duration);
}

.form-input--red {
  border-color: var(--color-red);
}
.form-input--yellow {
  border-color: var(--color-yellow);
}
.form-input--green {
  border-color: var(--color-green);
}

.form-input::placeholder,
.form-textarea::placeholder,
.search-bar__field-control::placeholder {
  color: var(--color-white);
}

.form-input::-webkit-inner-spin-button {
  cursor: pointer;
  opacity: 0.5;
}

/* Для Chrome, Safari, Edge и Opera */
.form-input::-webkit-outer-spin-button,
.form-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Для Firefox */
.form-input[type="number"] {
  -moz-appearance: textfield;
  -moz-appearance: textfield; /* Для старых версий Firefox */
  appearance: textfield;
}

.form-input--text-center {
  text-align: center;
  width: auto;
  max-width: 40%;
  padding-inline: 0.625rem;
}

.form-textarea {
  width: 100%;
  padding: 0.625rem;
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  background-color: transparent;
  min-height: 9.375rem;
  resize: none;
  flex-grow: 1;
}

/* Стили для скроллбара */
.form-textarea::-webkit-scrollbar,
.list-group-item::-webkit-scrollbar {
  width: 0.625rem;
}

.form-textarea::-webkit-scrollbar-track,
.list-group-item::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 0.625rem;
  margin-block: 0.5rem;
}

.form-textarea::-webkit-scrollbar-thumb,
.list-group-item::-webkit-scrollbar-thumb {
  background: var(--color-light-grey);
  border-radius: 0.625rem;
}

.custom-select {
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='9' viewBox='0 0 14 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.7137 0.210268C12.5434 0.0792202 12.328 0.0210304 12.1148 0.0484417C11.9016 0.0758529 11.7079 0.186631 11.5762 0.356518L6.53061 6.85652L1.48499 0.356518C1.42274 0.264715 1.34235 0.186628 1.24878 0.12707C1.15521 0.0675113 1.05044 0.0277417 0.940913 0.0102116C0.831389 -0.00731847 0.719436 -0.00223778 0.61195 0.0251401C0.504465 0.052518 0.403722 0.101613 0.31593 0.169402C0.228139 0.237191 0.155156 0.322236 0.101479 0.419301C0.0478022 0.516365 0.014567 0.623392 0.00382172 0.733788C-0.00692355 0.844184 0.00504832 0.955611 0.039 1.0612C0.0729517 1.1668 0.128164 1.26432 0.201236 1.34777L5.88874 8.66027C5.96468 8.75813 6.062 8.83733 6.17325 8.89181C6.2845 8.94629 6.40674 8.97462 6.53061 8.97462C6.65449 8.97462 6.77672 8.94629 6.88797 8.89181C6.99922 8.83733 7.09654 8.75813 7.17249 8.66027L12.86 1.34777C12.991 1.17738 13.0492 0.962009 13.0218 0.74881C12.9944 0.535612 12.8836 0.341963 12.7137 0.210268Z' fill='%23767676'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: right 0.9375rem center;
  background-size: 0.875rem 0.5625rem;
}

.custom-select:focus,
.form-input:focus,
.form-textarea:focus {
  outline: none;
  border-color: var(--color-orange);
}
@media (hover: hover) {
  .custom-select:hover,
  .form-input:hover,
  .form-textarea:hover {
    border-color: var(--color-orange);
  }
}
@media (hover: none) {
  .custom-select:active,
  .form-input:active,
  .form-textarea:active {
    border-color: var(--color-orange);
  }
}
/* Отключенный селект */
.custom-select:disabled {
  opacity: 0.6;
  cursor: auto;
}

.custom-dropdown-wrapper {
  position: relative;
  width: 100%;
}

.custom-dropdown-trigger {
  width: 100%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='9' viewBox='0 0 14 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.7137 0.210268C12.5434 0.0792202 12.328 0.0210304 12.1148 0.0484417C11.9016 0.0758529 11.7079 0.186631 11.5762 0.356518L6.53061 6.85652L1.48499 0.356518C1.42274 0.264715 1.34235 0.186628 1.24878 0.12707C1.15521 0.0675113 1.05044 0.0277417 0.940913 0.0102116C0.831389 -0.00731847 0.719436 -0.00223778 0.61195 0.0251401C0.504465 0.052518 0.403722 0.101613 0.31593 0.169402C0.228139 0.237191 0.155156 0.322236 0.101479 0.419301C0.0478022 0.516365 0.014567 0.623392 0.00382172 0.733788C-0.00692355 0.844184 0.00504832 0.955611 0.039 1.0612C0.0729517 1.1668 0.128164 1.26432 0.201236 1.34777L5.88874 8.66027C5.96468 8.75813 6.062 8.83733 6.17325 8.89181C6.2845 8.94629 6.40674 8.97462 6.53061 8.97462C6.65449 8.97462 6.77672 8.94629 6.88797 8.89181C6.99922 8.83733 7.09654 8.75813 7.17249 8.66027L12.86 1.34777C12.991 1.17738 13.0492 0.962009 13.0218 0.74881C12.9944 0.535612 12.8836 0.341963 12.7137 0.210268Z' fill='%23767676'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.625rem center;
  background-size: 0.875rem 0.5625rem;
  justify-content: space-between;
  padding-inline: 0.625rem;
  text-align: left;
  font-family: inherit;
  font-size: inherit;
}

.custom-dropdown-trigger[aria-expanded="true"] {
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='9' viewBox='0 0 14 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.7137 0.210268C12.5434 0.0792202 12.328 0.0210304 12.1148 0.0484417C11.9016 0.0758529 11.7079 0.186631 11.5762 0.356518L6.53061 6.85652L1.48499 0.356518C1.42274 0.264715 1.34235 0.186628 1.24878 0.12707C1.15521 0.0675113 1.05044 0.0277417 0.940913 0.0102116C0.831389 -0.00731847 0.719436 -0.00223778 0.61195 0.0251401C0.504465 0.052518 0.403722 0.101613 0.31593 0.169402C0.228139 0.237191 0.155156 0.322236 0.101479 0.419301C0.0478022 0.516365 0.014567 0.623392 0.00382172 0.733788C-0.00692355 0.844184 0.00504832 0.955611 0.039 1.0612C0.0729517 1.1668 0.128164 1.26432 0.201236 1.34777L5.88874 8.66027C5.96468 8.75813 6.062 8.83733 6.17325 8.89181C6.2845 8.94629 6.40674 8.97462 6.53061 8.97462C6.65449 8.97462 6.77672 8.94629 6.88797 8.89181C6.99922 8.83733 7.09654 8.75813 7.17249 8.66027L12.86 1.34777C12.991 1.17738 13.0492 0.962009 13.0218 0.74881C12.9944 0.535612 12.8836 0.341963 12.7137 0.210268Z' fill='%23ffffff'/%3E%3C/svg%3E");
}

/* Выпадающий список */
.select-list {
  width: 100%;
  position: absolute;
  z-index: 3;
  background-color: var(--color-navy-blue);
  top: calc(100% - 0.125rem);
  right: 0;
  border-radius: 0.625rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  box-shadow: 0rem 0.25rem 0.25rem 0rem var(--color-black-grey);
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  visibility: hidden;
  transition: all var(--transition-duration) ease;
  margin: 0;
  padding: 0;
  list-style: none;
}

.select-list[aria-expanded="true"] {
  max-height: 18.75rem;
  opacity: 1;
  visibility: visible;
  overflow-y: auto;
}

.select-list--fix-pos {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: calc(100% - 1.875rem);
  max-height: 0; /* В закрытом состоянии высота 0 */
  transition:
    opacity var(--transition-duration) ease,
    visibility var(--transition-duration) ease,
    max-height 0s;
}

.select-list--fix-pos[aria-expanded="true"] {
  max-height: 80vh;
  opacity: 1;
  visibility: visible;
  transition:
    opacity var(--transition-duration) ease,
    visibility var(--transition-duration) ease,
    max-height 0s;
}

/* Элементы списка */
.select-item {
  width: 100%;
  background-color: transparent;
  border-radius: 0.625rem;
  transition-duration: var(--transition-duration);
  padding: 0.75rem 0.9375rem;
  margin: 0;
  cursor: pointer;
  font-weight: 500;
  font-size: 1rem;
  text-align: left;
  border: none;
  display: block;
}

@media (hover: hover) {
  .select-item:hover {
    background-color: var(--color-blue);
  }
}

@media (hover: none) {
  .select-item:active {
    background-color: var(--color-blue);
  }
}

/* Скрытый инпут */
.dropdown-hidden-input {
  display: none;
}

/* Состояния фокуса */
.custom-dropdown-trigger:focus,
.form-input:focus {
  outline: none;
  border-color: var(--color-orange);
}

@media (hover: hover) {
  .custom-dropdown-trigger:hover,
  .form-input:hover {
    border-color: var(--color-orange);
  }
}

@media (hover: none) {
  .custom-dropdown-trigger:active,
  .form-input:active {
    border-color: var(--color-orange);
  }
}

/* Отключенный dropdown */
.custom-dropdown-trigger:disabled {
  opacity: 0.6;
  cursor: auto;
}

/* Для таблицы */
.table-third td .custom-dropdown-wrapper {
  margin: 0;
}

/* Стили для скроллбара */
.select-list::-webkit-scrollbar {
  width: 0.625rem;
}

.select-list::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 0.625rem;
  margin: 0.5rem 0;
}

.select-list::-webkit-scrollbar-thumb {
  background: var(--color-light-grey);
  border-radius: 0.5rem;
}

.table__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5625rem;
}
.table__row--l-font {
  font-size: clamp(1.25rem, 0.809rem + 1.96vw, 1.75rem);
  padding: 0.0625rem;
}
.table__row--alt-font {
  font-family: var(--font-family-alt);
  font-weight: 400;
}
.table__row--color {
  background-color: var(--color-menu-blue);
  border-radius: 0.1875rem;
  padding: 0.3125rem;
}
.table__row--color-string {
  padding: 0.625rem;
}
.table__row--color-alt {
  background-color: var(--color-blue-trans60);
}
.table__row--lh-150 {
  line-height: 150%;
  align-items: flex-start;
}

.table__row--huge-dedicated-string {
  border-radius: 0.625rem;
  background-color: var(--color-navy-blue);
  font-weight: 700;
  padding: 1.25rem 0.625rem !important;
}
.table__row--huge-dedicated-string th,
.table__row--huge-dedicated-string td {
  font-weight: inherit;
}

.table-first--height100 .table__row--huge-dedicated-string {
  margin-top: auto;
}

.table-first:has(.table__row--huge-dedicated-string) .table__row {
  padding-inline: 0.625rem;
}

.salary-worker .table__row--huge-dedicated-string,
.salary-check-unchecked .table__row--huge-dedicated-string,
.planning-industry .table__row--huge-dedicated-string {
  background-color: var(--color-menu-blue);
}

.table__status,
.table__td-color {
  padding: 0.125rem 0.3125rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.1875rem;
}

.table__td-color--menu-blue {
  background-color: var(--color-menu-blue);
}

.table__td-color--orange-trans60 {
  background-color: var(--color-orange-trans60);
}

.table__td-color--green {
  background-color: var(--color-green);
}

.table__td-color--red {
  background-color: var(--color-red);
}
.table__td-color--red-trans34 {
  background-color: var(--color-red-trans34);
}
.table__td-color--yellow-trans26 {
  background-color: var(--color-yellow-trans26);
}
.table__td-color--blue {
  background-color: var(--color-blue);
}

.table__status--warning {
  background-color: var(--color-orange-trans60);
}

.table__status--primary {
  background-color: var(--color-light-grey);
}

.table__status--secondary {
  background-color: var(--color-orange-trans60);
}

.table__status--info {
  background-color: var(--color-light-grey);
}

.table__status--closed {
  background-color: var(--color-light-grey);
}

.table__status--success {
  background-color: var(--color-menu-blue);
}

.table__status--collected {
  background-color: var(--color-orange-trans60);
}

.table__status--in-progress {
  background-color: var(--color-light-grey);
}

.table__status--at-work {
  background-color: var(--color-orange-trans60);
}

.table__status--new,
.table__status--ogidaet {
  background-color: var(--color-light-grey);
}

.table__status--gotovo {
  background-color: var(--color-blue-trans60);
}

.table__status--awaits {
  background-color: var(--color-blue-trans60);
}

.table__status--completed,
.table__status--nakladnaya {
  background-color: var(--color-menu-blue);
}

.table__category {
  background-color: var(--color-menu-blue);
}

.table__color-text {
  border: none;
  background-color: transparent;
  color: var(--color-blue);
  display: flex;
  gap: 1.0625rem;
  align-items: center;
  transition: color var(--transition-duration) ease;
}
@media (hover: hover) {
  a.table__color-text:hover,
  button.table__color-text:hover {
    color: var(--color-orange);
  }
}
@media (hover: none) {
  a.table__color-text:active,
  button.table__color-text:active {
    color: var(--color-orange);
  }
}

.tech-card-purpose .table__color-text,
.salary-worker .table__color-text,
.catalog-tech-cards .table__color-text,
.catalog-operations .table__color-text,
.editing-tech-card .table__color-text {
  color: var(--color-white);
  gap: 0.625rem;
}

@media (hover: hover) {
  .salary-worker a.table__color-text--blue:hover,
  .salary-worker button.table__color-text--blue:hover,
  .catalog-tech-cards button.table__color-text--blue:hover,
  .catalog-tech-cards a.table__color-text--blue:hover,
  .catalog-operations button.table__color-text--blue:hover,
  .catalog-operations a.table__color-text--blue:hover {
    color: var(--color-blue);
  }
}
@media (hover: none) {
  .salary-worker a.table__color-text--blue:active,
  .salary-worker button.table__color-text--blue:active,
  .catalog-tech-cards button.table__color-text--blue:active,
  .catalog-tech-cards a.table__color-text--blue:active,
  .catalog-operations button.table__color-text--blue:active,
  .catalog-operations a.table__color-text--blue:active {
    color: var(--color-blue);
  }
}

.table__button-with-icon,
.button-with-icon {
  border-radius: 0.3125rem;
  padding: 0;
  border: none;
  background-color: transparent;
}

.tech-card-purpose .button-with-icon {
  background-color: var(--color-blue-trans60);
  border: 0.125rem solid var(--color-blue);
  padding-inline: 1.4375rem;
  border-radius: 0.625rem;
}

.table__text-and-button {
  min-height: 1.875rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.table__text-and-button span {
  font-weight: 700;
}

.table__td-buttons-cont {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

@media (max-width: 47.9375rem) {
  .table__td-buttons-cont:has(.btn-reconcile) {
    flex-direction: column;
  }
}

.salary-worker .table__td-buttons-cont,
.catalog-tech-cards .table__td-buttons-cont,
.catalog-operations .table__td-buttons-cont {
  gap: 0.9375rem;
}

.catalog-tech-cards .table__td-buttons-cont,
.catalog-operations .table__td-buttons-cont {
  padding-top: 1.5625rem;
}

.table__td-buttons-cont--alt {
  justify-content: end;
}

.table__td-buttons-cont--dir-column-row,
.form-cont__form-buttons--dir-column-row {
  flex-direction: column;
}
@media (min-width: 48rem) {
  .table__td-buttons-cont--dir-column-row,
  .form-cont__form-buttons--dir-column-row {
    flex-direction: row;
  }
}

.table__form {
  width: 100%;
}
/*? центральная панель*/

/*? central-panel-categories категории*/

.central-panel-categories__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.625rem 0.625rem;
}
@media (min-width: 48rem) {
  .central-panel-categories__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.625rem;
  }
}
@media (min-width: 74.625rem) {
  .central-panel-categories__list {
    grid-template-columns: repeat(auto-fit, minmax(17.5rem, 1fr));
    grid-auto-rows: minmax(17.5625rem, auto);
  }
}

/*? central-panel-category-card карточка категории*/

.central-panel-category-card {
  height: 24.375rem;
  background-color: var(--color-black-grey);
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  padding: 1.4375rem 1.125rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  transition: border-color var(--transition-duration) ease;
}
@media (hover: hover) {
  .central-panel-category-card:hover {
    border-color: var(--color-orange);
  }
}
@media (hover: none) {
  .central-panel-category-card:active {
    border-color: var(--color-orange);
  }
}

.central-panel-category-card__name {
  font-size: clamp(1.5rem, 0.375rem + 5vw, 1.875rem);
  font-family: var(--font-family-alt);
  font-weight: 400;
  color: var(--color-blue);
  text-align: center;
}
@media (min-width: 52.125rem) {
  .central-panel-category-card__name {
    font-size: 2rem;
  }
}

.central-panel-category-card__quantity {
  font-size: 4rem;
  font-family: var(--font-family-alt);
  font-weight: 400;
  color: var(--color-orange);
}

.central-panel-category-card__note {
  font-weight: 400;
  text-align: center;
}

.central-panel-category-card__buttons {
  min-height: 6.1875rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.9375rem;
}

.central-panel-category-card__button:only-child {
  margin-top: auto;
}

.sorting__active-archive,
.sorting__checked-unchecked,
.sorting__cards-operations {
  width: fit-content;
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 0.625rem;
}

.sorting__active-archive::before,
.sorting__checked-unchecked::before,
.sorting__cards-operations::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0.125rem;
  left: 50%;
  translate: -50% 0;
  background-color: var(--color-light-grey);
}

.sorting__active-archive-button,
.sorting__checked-unchecked-button,
.sorting__cards-operations-button {
  background-color: var(--color-light-grey-trans60);
  padding-inline: 0.625rem;
  border-color: transparent;
}
.sorting__active-archive-button--left,
.sorting__checked-unchecked-button--left,
.sorting__cards-operations-button--left {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.sorting__active-archive-button--right,
.sorting__checked-unchecked-button--right,
.sorting__cards-operations-button--right {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.sorting__active-archive-button--left.sorting__active-archive-button--active {
  background-color: var(--color-orange-trans60);
}
.sorting__active-archive-button--right.sorting__active-archive-button--active {
  background-color: var(--color-blue-trans60);
}
.sorting__checked-unchecked-button--left.sorting__checked-unchecked-button--active {
  background-color: var(--color-red-trans34);
}
.sorting__checked-unchecked-button--right.sorting__checked-unchecked-button--active {
  background-color: var(--color-green-trans35);
}
.sorting__cards-operations-button.sorting__cards-operations-button--active {
  background-color: var(--color-menu-blue);
}

.section__special-cont2 .sorting__active-archive {
  margin-bottom: 0;
}

.sorting__checked-unchecked,
.sorting__cards-operations {
  margin-bottom: 0;
}

.sorting__filtration {
  display: flex;
  gap: 0.3125rem;
}
@media (min-width: 48rem) {
  .sorting__filtration {
    border-bottom: 0.0625rem solid var(--color-light-grey);
    padding-bottom: 1.25rem;
  }
}

.sorting__filtration-buttons {
  gap: 0.3125rem;
}
@media (min-width: 48rem) {
  .sorting__filtration-buttons {
    width: calc(50% - 0.3125rem / 2);
  }
}
@media (min-width: 64rem) {
  .sorting__filtration-buttons {
    width: calc(100% / 3 - 0.3125rem / 2);
  }
}

.sorting__filtration-button {
  aspect-ratio: 1;
}
@media (min-width: 48rem) {
  .sorting__filtration-button {
    aspect-ratio: auto;
    width: 100%;
  }
}

.sorting__filtration-button.button--blue {
  border-radius: 0;
}
.sorting__filtration-button.button--orange {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.sorting__filtration-button-text {
  display: none;
}

@media (min-width: 48rem) {
  .sorting__filtration-button-icon-wrapper {
    display: none;
  }
  .sorting__filtration-button-text {
    display: inline;
  }
}
@media (max-width: 47.9375rem) {
  .salary-check-unchecked .sorting__button-select-all,
  .salary-check-unchecked .sorting__checked-unchecked {
    width: 100%;
  }
}

@media (min-width: 48rem) {
  .custom-dropdown-wrapper--in-sorting {
    width: calc(50% - 0.3125rem / 2);
  }
}
@media (min-width: 64rem) {
  .custom-dropdown-wrapper--in-sorting {
    width: calc(100% / 3 * 2 - 0.3125rem / 2);
  }
}
.custom-dropdown-trigger--in-sorting {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.custom-dropdown-wrapper--in-sorting .custom-select:focus {
  border-color: var(--color-blue);
}

@media (hover: hover) {
  .custom-dropdown-wrapper--in-sorting .custom-select:hover {
    border-color: var(--color-blue);
  }
}
@media (hover: none) {
  .custom-dropdown-wrapper--in-sorting .custom-select:hover {
    border-color: var(--color-blue);
  }
}

.sorting__filtration-by-date {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 0.625rem;
}
@media (min-width: 48rem) {
  .sorting__filtration-by-date {
    flex-direction: row;
    column-gap: 0.3125rem;
    padding-bottom: 1.25rem;
    border-bottom: 0.125rem solid var(--color-light-grey);
  }
}

.sorting__filtration-by-date-inputs {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
.salary-check .sorting__filtration-by-date-inputs,
.salary-give .sorting__filtration-by-date-inputs {
  display: grid;
  grid-template-columns: 1fr;
}
@media (min-width: 48rem) {
  .sorting__filtration-by-date-inputs {
    flex-direction: row;
    gap: 0.3125rem;
  }
  .salary-check .sorting__filtration-by-date-inputs,
  .salary-give .sorting__filtration-by-date-inputs {
    gap: 0.9375rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 64rem) {
  .salary-check .sorting__filtration-by-date-inputs,
  .salary-give .sorting__filtration-by-date-inputs {
    grid-template-columns: repeat(4, 1fr);
  }
}

.sorting__filtration-by-date-input-cont {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
}
@media (min-width: 48rem) {
  .sorting__filtration-by-date-input-cont {
    width: calc(50% - 0.3125rem / 2);
  }
  .sorting__filtration-by-date-input-cont:first-child .form-input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .sorting__filtration-by-date-input-cont:last-child .form-input {
    border-radius: 0;
  }
}

.salary-check .sorting__filtration-by-date-input-cont .form-input,
.salary-give .sorting__filtration-by-date-input-cont .form-input {
  border-radius: 0.625rem;
}

.salary-check .sorting__filtration-by-date-input-cont,
.salary-give .sorting__filtration-by-date-input-cont {
  width: auto;
}

.form-input[type="date"] {
  cursor: text;
  justify-content: flex-start;
}

.form-input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  cursor: pointer;
}

@supports (-moz-appearance: none) {
  .form-input[type="date"] {
    color: white;
    cursor: pointer;
  }
}

.sorting__filtration-by-date-input-cont-label {
  padding-left: 0.3125rem;
}

.sorting__filtration-by-date-buttons {
  align-items: flex-end;
  gap: 0.3125rem;
}
@media (max-width: 47.9375rem) {
  .salary-check .sorting__filtration-by-date-buttons,
  .salary-give .sorting__filtration-by-date-buttons {
    margin-top: 1.25rem;
  }
}

.sorting__filtration-by-date-button {
  padding: 0.625rem;
  width: 100%;
}
@media (min-width: 48rem) {
  .sorting__filtration-by-date-button:first-child {
    border-radius: 0;
  }
  .sorting__filtration-by-date-button:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
}

.salary-check .sorting__filtration-by-date-button--first,
.salary-give .sorting__filtration-by-date-button--first {
  border-radius: 0.625rem 0 0 0.625rem;
  flex-grow: 1;
}

.salary-check .sorting__filtration-by-date-button--last,
.salary-give .sorting__filtration-by-date-button--last {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  width: auto;
}

.sorting__filtration-by-date--alt {
  flex-wrap: wrap;
  gap: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 0.125rem solid var(--color-light-grey);
}

.sorting__filtration-by-date--alt .sorting__filtration-by-date-inputs {
  display: grid;
  grid-template-columns: 1fr;
}
.sorting__filtration-by-date--alt .section__other-buttons-cont-button {
  margin-right: auto;
}

.sorting__filtration-by-date--alt .sorting__filtration-by-date-button {
  border-radius: 0.625rem 0 0 0.625rem;
}

.sorting__filtration-by-date--alt .sorting__filtration-button {
  aspect-ratio: 1;
  width: auto;
  border-top-right-radius: 0.625rem;
  border-bottom-right-radius: 0.625rem;
}

.sorting__filtration-by-date--alt .sorting__filtration-button-icon-wrapper {
  display: flex;
}

@media (min-width: 48rem) {
  .sorting__filtration-by-date--alt .sorting__filtration-by-date-inputs {
    grid-template-columns: 1fr 1fr;
    width: 100%;
    gap: 1.25rem;
  }

  .sorting__filtration-by-date--alt .sorting__filtration-by-date-input-cont {
    width: 100%;
  }

  .sorting__filtration-by-date--alt .sorting__filtration-by-date-buttons {
    width: calc(50% - 0.625rem);
  }

  .sorting__filtration-by-date--alt .section__other-buttons-cont-button {
    margin-right: 0;
    margin-left: auto;
  }
}

@media (min-width: 64rem) {
  .sorting__filtration-by-date--alt .sorting__filtration-by-date-inputs {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .sorting__filtration-by-date--alt .sorting__filtration-by-date-buttons {
    width: calc(25% - 0.9375rem);
  }
}

.sorting__filtration-by-date--alt .form-input:nth-child(n) {
  border-radius: 0.625rem;
}

.show {
  padding-block: 1.25rem;
  border-bottom: 0.125rem solid var(--color-light-grey);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  flex-wrap: wrap;
  gap: 1.25rem;
  font-weight: 600;
}
@media (min-width: 48rem) {
  .show {
    flex-direction: row;
    align-items: center;
  }
}

.show__remark {
  padding: 0.3125rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0.1875rem;
  background-color: var(--color-menu-blue);
}

.show__dropdown {
  display: flex;
  white-space: nowrap;
  align-items: center;
  gap: 0.625rem;
  justify-content: space-between;
  width: 100%;
}
@media (min-width: 48rem) {
  .show__dropdown {
    width: auto;
  }
}

.show .custom-dropdown-wrapper {
  width: 5.375rem;
}

.subject-card {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  background-color: var(--color-black-grey);
}
@media (min-width: 85.375rem) {
  .subject-card {
    height: 18.75rem;
    flex-direction: row;
  }
}

.subject-card__pictures-cont {
  width: 100%;
  flex-direction: column;
  gap: 0.625rem;
  display: flex;
}
@media (min-width: 48rem) {
  .subject-card__pictures-cont {
    min-width: 46.3125rem;
    flex-direction: row;
    align-items: stretch;
  }
}
@media (min-width: 85.375rem) {
  .subject-card__pictures-cont {
    width: 46.3125rem;
  }
}

.subject-card__image,
.editing-card__image {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}
@media (min-width: 48rem) {
  .subject-card__image {
    width: calc(100% - 0.625rem - (431 / 741 * 100%));
    flex-grow: 1;
    height: auto;
  }
}

.subject-card__barcode-link {
  width: 100%;
  height: auto;
  display: block;
}
@media (min-width: 48rem) {
  .subject-card__barcode-link {
    width: calc(431 / 741 * 100%);
    display: flex;
  }
}

.subject-card__barcode-image,
.barcode-image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.tech-cards__item {
  padding: 1.875rem 0.9375rem;
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  font-size: 1.25rem;
  background-color: var(--color-black-grey);
  text-align: center;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-alt);
  font-weight: 400;
  display: flex;
}

.editing-card {
  width: 100%;
  background-color: var(--color-black-grey);
  padding: 0.9375rem;
  border-radius: 0.625rem;
  border: 0.125rem solid var(--color-light-grey);
  display: flex;
  flex-direction: column;
  gap: clamp(0.938rem, 0.386rem + 2.45vw, 1.563rem);
}

.editing-card__body {
  display: flex;
  flex-direction: column;
  row-gap: clamp(0.938rem, 0.386rem + 2.45vw, 1.563rem);
  column-gap: 0.625rem;
}
@media (min-width: 64rem) {
  .editing-card__body {
    flex-direction: row;
  }
}

.editing-card__img-and-btn {
  display: flex;
  flex-direction: column;
  row-gap: 0.625rem;
}
@media (min-width: 64rem) {
  .editing-card__img-and-btn {
    width: 23.9375rem;
  }
}

@media (min-width: 64rem) {
  .editing-card__img-and-btn--alt {
    width: 28.625rem;
    justify-content: space-between;
  }
}

.editing-card__info {
  align-self: stretch;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.editing-card__form-buttons {
  margin-top: 1.25rem;
  display: flex;
  width: 100%;
  gap: 0.625rem;
}

.editing-card__form-buttons .button {
  width: 100%;
}

.form-cont {
  margin-top: 1.5625rem;
}

.form-wrapper .form-cont {
  margin-top: 0;
}

.form-cont__form {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 0.75rem;
}

.form-cont__form-paragraphs-cont {
  width: 100%;
  display: flex;
  flex-direction: column;
}
@media (min-width: 48rem) {
  .form-cont__form-paragraphs-cont {
    flex-direction: row;
    column-gap: 0.75rem;
  }
}

.tech-card-purpose .form-cont__form-paragraphs-cont {
  gap: 0.625rem;
  padding-bottom: 1.25rem;
  border-bottom: 0.125rem solid var(--color-light-grey);
}
.tech-card-purpose .form-cont {
  margin-top: 1.25rem;
}

@media (min-width: 48rem) {
  .form-cont__form-paragraphs-cont--alt {
    flex-direction: column;
  }
  .tech-card-purpose .form-cont__form-paragraphs-cont-button {
    max-width: 18rem;
  }
}
.form-cont__form-paragraphs-cont--without-first-pad-top
  .form-cont__form-paragraph:first-of-type {
  padding-top: 0;
}

@media (max-width: 47.9375rem) {
  .form-cont__form-paragraphs-cont--with-alt-pad-top
    .form-cont__form-paragraph:nth-of-type(n + 2) {
    padding-top: 0.75rem;
  }
}

.login .form-cont__form-paragraphs-cont {
  max-width: 31.5rem;
  align-self: center;
}

.form-cont__form-paragraph {
  padding-top: 1.25rem;
  width: 100%;
  font-size: 1rem;
  font-weight: 500;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 0.4375rem;
}

.form-cont__form-paragraph--without-pad-top {
  padding-top: 0;
}

.form-cont__form-paragraph-filefold-with-button {
  display: flex;
  gap: 0.625rem;
}

.login .form-cont__form-paragraph-filefold-with-button {
  padding-top: 1.25rem;
  align-items: center;
}

@media (min-width: 48rem) {
  .form-cont__form-paragraph--max-width {
    max-width: calc(50% - 2.875rem);
  }
}

.form-cont__two-tables {
  display: grid;
  gap: 0.625rem;
  grid-template-columns: 1fr;
}
@media (min-width: 64rem) {
  .form-cont__two-tables {
    grid-template-columns: 1fr 1fr;
  }
}

.form-cont__input-with-button {
  display: flex;
  gap: 0.3125rem;
}
.form-cont__input-with-button .form-input {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.tables-cont:has(.table-card-first__huge-dedicated-string) .form-input {
  margin-top: 2.0625rem;
}

.tech-card-purpose .table-card-first__title-custom-checkbox {
  display: flex;
  gap: 0.625rem;
  align-items: center;
  margin-bottom: 1.5625rem;
  line-height: 100%;
}

.form-cont__form-buttons {
  display: flex;
  width: 100%;
  gap: 0.625rem;
}

.form-cont__form-buttons button,
.form-cont__form-buttons a {
  width: 100%;
}

.price-calculation {
  margin-top: 1.0625rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.price-calculation__string {
  font-weight: 700;
  padding: 0.625rem;
  display: flex;
  gap: 0.625rem;
}

.price-calculation__string--top {
  font-size: clamp(0.938rem, -0.563rem + 6.67vw, 1rem);
  background-color: var(--color-light-grey-trans60);
}

.price-calculation__string--bottom {
  font-size: 1.375rem;
  gap: 1.25rem;
  justify-content: flex-end;
  background-color: var(--color-menu-blue);
}

.progress {
  margin-top: 1.6875rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  background-color: var(--color-navy-blue);
  border-radius: 0.625rem;
  padding: 0.625rem;
}

@media (max-width: 63.9375rem) {
  .progress:has(.progress__info--triple) {
    gap: 0.625rem;
  }
}

.progress--without-m-t {
  margin-top: 0;
}

.progress__info {
  position: relative;
  display: flex;
  gap: 1.25rem;
}

.progress__info-block {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding-block: 0.9375rem;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-alt);
  font-size: clamp(1.25rem, 0.809rem + 1.96vw, 1.75rem);
  line-height: 100%;
  font-weight: 400;
}

.progress__info-block--p-l-10 {
  align-items: flex-start;
  padding-left: 0.625rem;
}

.progress__info-block--a-i-start {
  align-items: flex-start;
}

.progress__info-block--text-s {
  font-size: 1rem;
}

.recount-addition .progress__info-block--text-s {
  align-items: center;
}

.progress__info-completed {
  width: 100%;
}

.progress__info-completed svg {
  height: clamp(3.75rem, 2.923rem + 3.68vw, 4.688rem);
  width: auto;
}

.progress__info--triple {
  flex-direction: column;
}
@media (min-width: 64rem) {
  .progress__info--triple {
    flex-direction: row;
  }
}
@media (min-width: 48rem) {
  .cont__list--narrow-triple .progress__info--triple {
    flex-direction: row;
  }
  .cont__list--narrow-triple .progress__info--triple::before,
  .cont__list--narrow-triple .progress__info--triple::after {
    content: none;
  }
}

.progress__info--quadruple {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 48rem) {
  .progress__info--quadruple {
    grid-template-columns: 1fr 1fr;
  }
}
.progress__info--quadruple .progress__info-block {
  align-items: flex-start;
}

.progress__info--double::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0.125rem;
  left: 50%;
  translate: -50% 0;
  background-color: var(--color-light-grey);
}

.progress__info--triple::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 0.125rem;
  background-color: var(--color-light-grey);
  top: calc(100% / 3 - 0.3125rem);
  translate: 0 calc(-1 * (100% / 3));
}

.progress__info--triple::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 0.125rem; /* Высота вместо ширины */
  background-color: var(--color-light-grey);
  top: calc(100% / 3 * 2 + 0.3125rem);
  translate: 0 calc(-1 * (100% / 3 * 2));
}

@media (max-width: 47.9375rem) {
  .progress__info--quadruple .progress__info-block:not(:last-child) {
    padding-bottom: 1.25rem;
    border-bottom: 0.125rem solid var(--color-light-grey);
  }
}

@media (min-width: 48rem) {
  .progress__info--quadruple::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: calc(50% + 0.625rem);
    width: 0.125rem;
    left: 50%;
    translate: -50% 0;
    background-color: var(--color-light-grey);
  }
  .progress__info--quadruple::after {
    content: "";
    position: absolute;
    top: calc(50% + 0.625rem);
    bottom: 0;
    width: 0.125rem;
    left: 50%;
    translate: -50% 0;
    background-color: var(--color-light-grey);
  }

  .progress__info--quadruple .progress__info-block:nth-child(even) {
    padding-left: 1.875rem;
  }
}

@media (min-width: 64rem) {
  .progress__info--triple::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    height: auto;
    width: 0.125rem;
    left: calc(100% / 3);
    translate: calc(-1 * (100% / 3)) 0;
  }

  .progress__info--triple::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    height: auto;
    width: 0.125rem;
    left: calc(100% / 3 * 2);
    translate: calc(-1 * (100% / 3 * 2)) 0;
  }
}

.progress__text {
  color: var(--color-blue);
}

.progress__text--orange {
  color: var(--color-orange);
}

@media (min-width: 46.75rem) {
  .cont__list--narrow-triple .progress__text {
    width: min-content;
  }

  .cont__list--narrow-triple .progress__info-block:nth-child(n + 2) {
    border-left: 0.0625rem solid var(--color-light-grey);
    padding-left: 1.25rem;
  }
}

.progress__bar {
  width: 100%;
  height: 0.625rem;
  background-color: var(--color-white);
  border-radius: 1.875rem;
  overflow: hidden;
}

.progress__bar-inner {
  height: 100%;
  background-color: var(--color-blue);
}

.general-card {
  display: flex;
  flex-direction: column;
  padding: 0.9375rem;
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  background-color: var(--color-black-grey);
}

.general-card__string-with-checkbox {
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.9375rem;
}

@media (min-width: 64rem) {
  .table-first--narrow {
    width: calc(50% - 1.25rem);
  }
}

.chat {
  padding-top: 7.625rem;
  position: fixed;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr;
  background-color: var(--color-chat2);
}
@media (min-width: 48rem) {
  .chat {
    padding-top: clamp(4.875rem, -634.5rem + 1000vw, 5.5rem);
  }
}
@media (min-width: 64rem) {
  .chat {
    grid-template-columns: 23.875rem 1fr;
  }
}

.chat__empty-window {
  width: 100%;
  height: 100%;
}

.chat__empty-window-body {
  width: 20.75rem;
  display: flex;
  flex-direction: column;
}

.chat__empty-window-title {
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: 2.25rem;
  margin-bottom: 1.25rem;
}

.chat__empty-window-mess {
  text-align: center;
  margin-bottom: 1.875rem;
}

.chat__sidebar {
  overflow-y: scroll;
  border-right: 0.0625rem solid var(--color-light-grey);
  background-color: var(--color-navy-blue);
}

.chat__sidebar-body {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding-inline: 0.9375rem;
}

.chat__sidebar-header,
.chat__sidebar-link {
  padding-bottom: 0.9375rem;
  flex-grow: 1;
  display: flex;
  gap: 1.25rem;
  align-items: center;
  padding-inline: 0.9375rem;
  border-bottom: 0.0625rem solid var(--color-light-grey);
}

.chat__sidebar-link {
  align-items: stretch;
}

.chat__sidebar-header {
  padding-block: 1.875rem;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  left: 0;
  background-color: var(--color-navy-blue);
}
@media (min-width: 64rem) {
  .chat__sidebar-header,
  .chat__window-header {
    min-height: 6.625rem;
  }
}

.chat__sidebar-header-title,
.chat__sidebar-link-title {
  font-size: clamp(1.375rem, 1.265rem + 0.49vw, 1.5rem);
  font-weight: 400;
  font-family: var(--font-family-alt);
}
.chat__sidebar-header-title {
  font-size: clamp(1.563rem, 0.956rem + 2.7vw, 2.25rem);
}

.chat__sidebar-button {
  padding-inline: 0.6875rem;
}

.chat__sidebar-list {
  display: flex;
  flex-direction: column;
  gap: 0.9375rem;
}

.chat__sidebar-link-icon-wrapper {
  width: 3.75rem;
  height: 3.75rem;
  flex-shrink: 0;
}

.chat__sidebar-link-middle-part,
.chat__sidebar-link-right-part {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0.625rem;
}

.chat__sidebar-link-role {
  max-width: max-content;
}

.chat__sidebar-link-right-part {
  margin-left: auto;
}

.chat__sidebar-link-date {
  width: max-content;
}

.chat__sidebar-link-quantity {
  height: 1.875rem;
  min-width: 1.875rem;
  background-color: var(--color-blue);
  border-radius: 0.1875rem;
  padding-inline: 0.3125rem;
  align-self: flex-end;
}

/* Стили для скроллбара */
@media (max-width: 63.9375rem) {
  .chat__sidebar,
  .chat__window {
    -ms-overflow-style: none; /* Скрываем в IE и Edge */

    scrollbar-width: none; /* Скрываем в Firefox */
  }

  .chat__sidebar::-webkit-scrollbar,
  .chat__window::-webkit-scrollbar {
    display: none; /* Скрываем в Chrome, Safari и Opera */
  }
}

.chat__sidebar::-webkit-scrollbar,
.chat__window::-webkit-scrollbar,
.overlay-new-chat-list::-webkit-scrollbar {
  width: 0.625rem;
}

.chat__sidebar::-webkit-scrollbar-track,
.chat__window::-webkit-scrollbar-track,
.overlay-new-chat-list::-webkit-scrollbar-track {
  background: transparent;
  margin-block: 0.5rem;
}

.chat__sidebar::-webkit-scrollbar-thumb,
.chat__window::-webkit-scrollbar-thumb,
.overlay-new-chat-list::-webkit-scrollbar-thumb {
  border-radius: 0.625rem;
  background: var(--color-light-grey);
}

.overlay-new-chat-list::-webkit-scrollbar {
  width: 0.625rem;
}

.chat__window {
  display: flex;
  flex-direction: column;
  overflow-y: scroll;
}

@media (max-width: 63.9375rem) {
  .chat--sidebar .chat__window {
    position: absolute !important;
    width: 0.0625rem !important;
    height: 0.0625rem !important;
    margin: -0.0625rem !important;
    border: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    -webkit-clip-path: inset(100%) !important;
    clip-path: inset(100%) !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
  }
  .chat--mess .chat__sidebar {
    position: absolute !important;
    width: 0.0625rem !important;
    height: 0.0625rem !important;
    margin: -0.0625rem !important;
    border: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    -webkit-clip-path: inset(100%) !important;
    clip-path: inset(100%) !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
  }
}

.chat__window-body {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.chat__window-header {
  position: sticky;
  top: 0;
  left: 0;
  background-color: var(--color-chat2);
  padding: 1.875rem 1.25rem;
  gap: 0.625rem;
  display: flex;
  align-items: center;
  width: 100%;
  border-bottom: 0.0625rem solid var(--color-light-grey);
}

.chat__window-title {
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: 1.75rem;
}

.chat__window-role {
  padding: 0.25rem 1.0625rem;
}

.chat__window-header .button-with-icon {
  margin-left: auto;
}

.chat__window-main {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 2.5rem 1.25rem 1.25rem 1.25rem;
}

.chat__window-mess {
  padding: 0.9375rem;
  background-color: #00a6f2;
  border-radius: 0.625rem;
  max-width: 90%;
}

.chat__window-mess-time {
  font-size: 0.75rem;
  color: var(--color-light-grey);
  opacity: 0.7;
  position: relative;
  top: -0.4375rem;
  right: -0.125rem;
  font-weight: 600;
}

.chat__window-mess--my {
  background-color: var(--color-blue);
  align-self: flex-end;
  border-bottom-right-radius: 0;
}

.chat__window-mess--my .chat__window-mess-time {
  color: var(--color-white);
}

.chat__window-mess--alien {
  background-color: var(--color-white);
  color: #000000;
  border-bottom-left-radius: 0;
}

.chat__form {
  position: sticky;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 0.3125rem;
  padding: 1.25rem;
  background-color: var(--color-chat2);
}

.chat__form-filefold {
  flex-grow: 1;
  min-height: 2.625rem;
  field-sizing: content;
  line-height: 1.25;
  max-height: 4rem;
}

.inf-under-picture {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (hover: hover) {
  .table-card-first:has(.inf-under-picture__number-in-frame):hover {
    border-color: var(--color-light-grey);
  }
}
@media (hover: none) {
  .table-card-first:has(.inf-under-picture__number-in-frame):active {
    border-color: var(--color-light-grey);
  }
}

.inf-under-picture__number-in-frame {
  padding-block: 0.625rem;
  width: 100%;
  border-radius: 0.5rem;
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.25rem, 0.809rem + 1.96vw, 1.75rem);
  text-align: center;
}
.inf-under-picture__number-in-frame--bg-green {
  background-color: var(--color-green-trans35);
}
.inf-under-picture__number-in-frame--bg-yellow {
  background-color: var(--color-yellow-trans26);
}
.inf-under-picture__number-in-frame--bg-red {
  background-color: var(--color-red-trans34);
}

.inf-under-picture__title-in-frame {
  padding: 0.625rem 1.375rem;
  background-color: var(--color-menu-blue);
  border-radius: 0.625rem;
  font-size: clamp(1.688rem, 1.191rem + 2.21vw, 2.25rem);
  font-family: var(--font-family-alt);
  font-weight: 400;
  line-height: 100%;
  text-align: center;
}

.inf-under-picture__title-in-frame--bg-green {
  background-color: var(--color-green-trans35);
}

.main:has(.login) {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.login {
  height: 100%;
  justify-content: center;
  gap: clamp(2.5rem, 1.397rem + 4.9vw, 3.75rem);
}

.login__header {
  opacity: 0; /* изначально элемент невидим */
  animation: fadeInHeader 1s ease-in-out forwards;
}

@keyframes fadeInHeader {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.login__main {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(1.563rem, 1.224rem + 1.51vw, 2.188rem);
  justify-content: center;
  opacity: 0;
  animation: fadeInMain 1s ease-in-out forwards;
  animation-delay: 1s;
}

@keyframes fadeInMain {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.login__title {
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.5rem, 0.838rem + 2.94vw, 2.25rem);
  line-height: 100%;
  text-align: center;
}

.overlay-new-chat,
.overlay-salary-filling,
.overlay-scan,
.overlay-barcode-print,
.overlay-materials {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  border: 0.125rem solid var(--color-light-grey);
  border-radius: 0.625rem;
  display: flex;
  flex-direction: column;
  max-width: calc(100% - 1rem * 2);
}

.overlay-scan {
  height: calc(100% - 1rem * 2);
  width: calc(100% - 1rem * 2);
  max-width: 22.5rem;
  max-height: 33.75rem;
  overflow: hidden;
}

.overlay-scan__items {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2000;
  display: flex;
  flex-direction: column;
  gap: 0.9375rem;
  background-color: #13131bab;
  padding: 0.9375rem;
}

.overlay-scan__text {
  gap: 0.375rem;
  font-weight: 600;
  font-size: 0.875rem;
  line-height: 100%;
}

.overlay-scan__video {
  display: block;
  height: 100%;
  min-width: 100%;
  object-fit: cover;
}

.overlay-new-chat {
  padding: 2.1875rem;
  background-color: var(--color-black);
  width: clamp(20.5rem, 12.118rem + 37.25vw, 30rem);
  gap: 1.25rem;
}

@media (min-width: 85.375rem) {
  .overlay-new-chat {
    width: 38.5625rem;
  }
}

.overlay-new-chat-title {
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: clamp(1.563rem, 0.956rem + 2.7vw, 2.25rem);
  line-height: 100%;
  text-align: center;
  gap: 0.9375rem;
}

.overlay-new-chat-list {
  margin-right: -0.625rem;
  max-height: 15rem;
  overflow-y: scroll;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.overlay-new-chat-user {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 0.5625rem;
  padding-bottom: 0.9375rem;
  border-bottom: 0.0625rem solid var(--color-light-grey);
}

.overlay-new-chat-user-top-part {
  display: flex;
  align-items: center;
  gap: 0.9375rem;
}

.overlay-new-chat-user .checkmark {
  height: 1.25rem;
  width: 1.25rem;
  border: 0.0625rem solid var(--color-blue);
}

.overlay-new-chat-user .checkmark:after {
  width: 0.625rem;
  height: 0.625rem;
  background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.62033 6.85539C0.545909 6.79588 0.452244 6.76181 0.355755 6.765C0.259302 6.76816 0.168531 6.80768 0.102518 6.87581C0.0365052 6.94394 -0.000142753 7.03591 -0.000255615 7.13241C-0.000404775 7.22895 0.036596 7.3215 0.0984196 7.39401C0.388877 7.73347 0.675362 8.06494 0.96832 8.3984C3.04531 10.7504 5.17701 13.0086 7.59101 15.1177L8.5002 15.8806L9.07565 14.8027C9.47207 14.0604 9.8617 13.3146 10.2445 12.5654C12.0461 9.03969 13.6975 5.43721 15.1985 1.75793C15.3653 1.34913 15.5302 0.93937 15.6933 0.528667C15.7284 0.440079 15.7335 0.340544 15.7022 0.24922C15.671 0.15792 15.6066 0.0827067 15.5221 0.039542C15.4376 -0.00362265 15.339 -0.0117261 15.2467 0.016431C15.1543 0.0445644 15.0767 0.107048 15.0254 0.187398C14.7882 0.560183 14.5527 0.933917 14.3192 1.3086C12.217 4.68073 10.2652 8.12964 8.46358 11.6553C8.08074 12.4046 7.70468 13.1573 7.33541 13.9134L8.82005 13.5983C6.47413 11.6945 4.07534 9.63556 1.65247 7.6863C1.30861 7.40793 0.968036 7.13429 0.62033 6.85539Z" fill="%2300a6f2"/></svg>');
}

.tech-card-purpose .checkmark:after,
.login .checkmark:after {
  background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.62033 6.85539C0.545909 6.79588 0.452244 6.76181 0.355755 6.765C0.259302 6.76816 0.168531 6.80768 0.102518 6.87581C0.0365052 6.94394 -0.000142753 7.03591 -0.000255615 7.13241C-0.000404775 7.22895 0.036596 7.3215 0.0984196 7.39401C0.388877 7.73347 0.675362 8.06494 0.96832 8.3984C3.04531 10.7504 5.17701 13.0086 7.59101 15.1177L8.5002 15.8806L9.07565 14.8027C9.47207 14.0604 9.8617 13.3146 10.2445 12.5654C12.0461 9.03969 13.6975 5.43721 15.1985 1.75793C15.3653 1.34913 15.5302 0.93937 15.6933 0.528667C15.7284 0.440079 15.7335 0.340544 15.7022 0.24922C15.671 0.15792 15.6066 0.0827067 15.5221 0.039542C15.4376 -0.00362265 15.339 -0.0117261 15.2467 0.016431C15.1543 0.0445644 15.0767 0.107048 15.0254 0.187398C14.7882 0.560183 14.5527 0.933917 14.3192 1.3086C12.217 4.68073 10.2652 8.12964 8.46358 11.6553C8.08074 12.4046 7.70468 13.1573 7.33541 13.9134L8.82005 13.5983C6.47413 11.6945 4.07534 9.63556 1.65247 7.6863C1.30861 7.40793 0.968036 7.13429 0.62033 6.85539Z" fill="%23118e1b"/></svg>');
}

.overlay-new-chat-user-name {
  font-family: var(--font-family-alt);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 100%;
}

.overlay-new-chat-mess-cont {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.overlay-salary-filling,
.overlay-materials {
  background-color: var(--color-navy-blue);
  width: 20.625rem;
  padding: 1.25rem 1rem;
  gap: 1.25rem;
}

.overlay-salary-filling-title,
.overlay-materials-title {
  font-size: 1.75rem;
  text-align: center;
}

.overlay-salary-filling .form-cont__form-paragraph:first-of-type,
.login .form-cont__form-paragraph:first-of-type {
  padding-top: 0;
}

.overlay-barcode-print {
  width: 100%;
  max-width: 53rem;
  border: none;
  max-height: 90vh;
}

.overlay-barcode-print__barcode {
  border-radius: 0.625rem;
  overflow: hidden;
}

.overlay-barcode-print__buttons-cont {
  margin-top: 1.25rem;
  gap: 0.625rem;
}

/* ховер и фокус: */
.hover-border-red:focus {
  transition-duration: var(--transition-duration);
  border-color: var(--color-red) !important;
}
.hover-border-yellow:focus {
  transition-duration: var(--transition-duration);
  border-color: var(--color-yellow) !important;
}
.hover-border-green:focus {
  transition-duration: var(--transition-duration);
  border-color: var(--color-green) !important;
}
@media (hover: hover) {
  .hover-border-orange:hover {
    transition-duration: var(--transition-duration);
    border-color: var(--color-orange) !important;
  }
  .hover-border-red:hover {
    transition-duration: var(--transition-duration);
    border-color: var(--color-red) !important;
  }
  .hover-border-green:hover {
    transition-duration: var(--transition-duration);
    border-color: var(--color-green) !important;
  }
  .hover-border-yellow:hover {
    transition-duration: var(--transition-duration);
    border-color: var(--color-yellow) !important;
  }
  .hover-border-light-grey:hover {
    transition-duration: var(--transition-duration);
    border-color: var(--color-light-grey) !important;
  }
}
@media (hover: none) {
  .hover-border-orange:active {
    transition-duration: var(--transition-duration);
    border-color: var(--color-orange) !important;
  }
  .hover-border-red:active {
    transition-duration: var(--transition-duration);
    border-color: var(--color-red) !important;
  }
  .hover-border-yellow:active {
    transition-duration: var(--transition-duration);
    border-color: var(--color-yellow) !important;
  }
  .hover-border-light-grey:active {
    transition-duration: var(--transition-duration);
    border-color: var(--color-light-grey) !important;
  }
}

/* задачи : 
*/