#screen-procurement {
  --proc-bg-card: var(--rev-card-bg, #06090b);
  --proc-bg-card-quiet: var(--rev-card-bg-quiet, #050708);
  --proc-bg-card-compact: var(--rev-card-bg-compact, #080c0f);
  --proc-bg-card-primary: var(--rev-card-bg-primary, #061009);
  --proc-border: var(--rev-border-soft, rgba(225, 236, 241, 0.11));
  --proc-border-strong: var(--rev-border, rgba(225, 236, 241, 0.13));
  --proc-accent: var(--rev-accent, var(--accent-main, var(--accent, #b8ff5a)));
  --proc-accent-border: rgba(184, 255, 90, 0.22);
  --proc-accent-soft: rgba(184, 255, 90, 0.075);
  --proc-accent-glow: rgba(184, 255, 90, 0.085);
  --proc-muted: var(--rev-text-muted, var(--muted, rgba(218, 227, 232, 0.7)));
  --proc-radius-card: var(--rev-radius-card, 12px);
  --proc-radius-compact: var(--rev-radius-compact, 9px);
  --proc-shadow-card: var(--rev-shadow-card, 0 12px 24px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.032));
  min-height: 100%;
  padding: 8px 12px 28px;
  background:
    radial-gradient(circle at 50% -14%, rgba(184, 255, 90, 0.045), transparent 30%),
    #020304;
}

body.procurement-active header.card {
  display: none;
}

#screen-procurement .procurement-shell {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#screen-procurement .procurement-nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 4px 2px 6px;
}

#screen-procurement .procurement-nav__top {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}

#screen-procurement .procurement-back {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.055);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  width: 36px;
  min-width: 36px;
  min-height: 36px;
  padding: 0;
  font: inherit;
  font-size: 18px;
  font-weight: 700;
}

#screen-procurement .procurement-new-request {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 44px;
  padding: 0 14px;
  font: inherit;
  font-weight: 700;
}

#screen-procurement .procurement-title {
  margin: 0;
  color: var(--text-main, #f4f7f2);
  font-size: 22px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: 0;
}

#screen-procurement .procurement-nav__subtitle,
#screen-procurement .procurement-nav__text {
  margin: 0;
  padding-left: 46px;
}

#screen-procurement .procurement-nav__subtitle {
  color: var(--text-main, #f4f7f2);
  font-size: 16px;
  line-height: 1.25;
  font-weight: 850;
}

#screen-procurement .procurement-nav__text {
  max-width: 420px;
  color: var(--proc-muted);
  font-size: 13px;
  line-height: 1.35;
}

#screen-procurement .procurement-role-choice,
#screen-procurement .procurement-staff-mode__body {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid var(--proc-border);
  background: var(--proc-bg-card);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-role-choice.hidden,
#screen-procurement .procurement-manager-content.hidden,
#screen-procurement .procurement-venues.hidden,
#screen-procurement .procurement-manager-home.hidden,
#screen-procurement .procurement-manager-mode.hidden,
#screen-procurement .procurement-mode-bar.hidden,
#screen-procurement .procurement-staff-mode.hidden,
#screen-procurement .procurement-catalog.hidden,
#screen-procurement .procurement-suppliers.hidden,
#screen-procurement .procurement-access.hidden {
  display: none;
}

#screen-procurement .procurement-role-choice__title,
#screen-procurement .procurement-staff-mode__title {
  margin: 0;
  font-size: 20px;
  line-height: 1.15;
  font-weight: 900;
}

#screen-procurement .procurement-role-choice__subtitle {
  margin: -4px 0 0;
  color: var(--proc-muted);
  font-size: 14px;
  line-height: 1.35;
}

#screen-procurement .procurement-role-choice__actions,
#screen-procurement .procurement-manager-content,
#screen-procurement .procurement-staff-mode {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#screen-procurement .procurement-manager-home {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-manager-hero {
  padding: 0 2px 4px;
}

#screen-procurement .procurement-manager-hero__title {
  margin: 0;
  color: var(--text-main, #f4f7f2);
  font-size: 22px;
  line-height: 1.14;
  font-weight: 900;
  letter-spacing: 0;
}

#screen-procurement .procurement-manager-hero p {
  margin: 8px 0 0;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 15px;
  line-height: 1.35;
}

#screen-procurement .procurement-manager-venue {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 10px;
  color: var(--proc-muted);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 800;
}

#screen-procurement .procurement-manager-venue__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#screen-procurement .procurement-manager-venue__change {
  flex: 0 0 auto;
  border: 1px solid rgba(184, 255, 90, 0.16);
  background: rgba(184, 255, 90, 0.045);
  color: rgba(220, 255, 180, 0.88);
  border-radius: 999px;
  min-height: 30px;
  padding: 0 10px;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
}

#screen-procurement .procurement-venues {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-venues__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-venue-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 22px;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 1px solid var(--proc-border);
  background: var(--proc-bg-card);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px 12px;
  font: inherit;
  text-align: left;
  box-shadow: var(--rev-shadow-card, 0 16px 34px rgba(0, 0, 0, 0.28));
}

#screen-procurement .procurement-venue-card:hover,
#screen-procurement .procurement-venue-card:focus-visible {
  border-color: var(--proc-accent-border);
  background:
    linear-gradient(135deg, rgba(184, 255, 90, 0.045), rgba(255, 255, 255, 0.018)),
    var(--proc-bg-card-primary);
}

#screen-procurement .procurement-venue-card__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

#screen-procurement .procurement-venue-card__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-venue-card__hint {
  color: var(--proc-muted);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
}

#screen-procurement .procurement-venue-card__arrow {
  color: rgba(221, 230, 218, 0.68);
  font-size: 26px;
  line-height: 1;
}

#screen-procurement .procurement-venue-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--proc-border);
  background: var(--proc-bg-card);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-venue-form.hidden {
  display: none;
}

#screen-procurement .procurement-venue-form__actions {
  display: flex;
  gap: 8px;
}

#screen-procurement .procurement-venue-form__actions > button {
  flex: 1 1 0;
}

#screen-procurement .procurement-catalog-venue {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--proc-border);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.022), rgba(255, 255, 255, 0.006)),
    var(--proc-bg-card);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-catalog-venue__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#screen-procurement .procurement-catalog-venue__title {
  color: var(--text-main, #f4f7f2);
  font-size: 15px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-catalog-venue__hint {
  margin-top: 4px;
  color: var(--proc-muted);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 700;
}

#screen-procurement .procurement-catalog-venue__add {
  flex: 0 0 auto;
  border: 1px solid rgba(184, 255, 90, 0.18);
  background: rgba(184, 255, 90, 0.055);
  color: rgba(220, 255, 180, 0.92);
  border-radius: 999px;
  min-height: 32px;
  padding: 0 11px;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}

#screen-procurement .procurement-catalog-venue__select {
  margin: 0;
}

#screen-procurement .procurement-home-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-home-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 1px solid var(--proc-border);
  background: var(--proc-bg-card);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px 12px;
  font: inherit;
  text-align: left;
  box-shadow: var(--rev-shadow-card, 0 16px 34px rgba(0, 0, 0, 0.28));
}

#screen-procurement .procurement-home-card--primary {
  grid-template-columns: 44px minmax(0, 1fr) auto 24px;
  min-height: 104px;
  border-color: var(--proc-accent-border);
  background:
    linear-gradient(135deg, rgba(184, 255, 90, 0.055), rgba(255, 255, 255, 0.025)),
    var(--proc-bg-card-primary);
  box-shadow: var(--rev-shadow-card, 0 20px 42px rgba(0, 0, 0, 0.3)), 0 0 22px var(--proc-accent-glow);
}

#screen-procurement .procurement-home-card__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.045);
  color: rgba(221, 230, 218, 0.78);
  border-radius: 8px;
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
}

#screen-procurement .procurement-home-card__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

#screen-procurement .procurement-home-card__title {
  overflow-wrap: anywhere;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-home-card__status {
  color: var(--proc-muted);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
}

#screen-procurement .procurement-home-card__arrow {
  color: rgba(221, 230, 218, 0.7);
  font-size: 26px;
  line-height: 1;
}

#screen-procurement .procurement-home-card__badge {
  align-self: start;
  border: 1px solid rgba(184, 255, 90, 0.26);
  background: rgba(120, 255, 150, 0.12);
  color: #b8ff90;
  border-radius: 999px;
  padding: 5px 8px;
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  white-space: nowrap;
}

#screen-procurement .procurement-home-card__badge.hidden {
  display: none;
}

#screen-procurement .procurement-section-back {
  align-self: flex-start;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 40px;
  padding: 0 12px;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
}

#screen-procurement .procurement-role-choice__button,
#screen-procurement .procurement-change-role {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-role-choice__button {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 72px;
  padding: 12px;
  text-align: left;
  background:
    linear-gradient(135deg, rgba(184, 255, 90, 0.035), rgba(255, 255, 255, 0.018)),
    var(--proc-bg-card-primary);
  border-color: var(--proc-accent-border);
  box-shadow: 0 0 14px rgba(184, 255, 90, 0.035);
}

#screen-procurement .procurement-role-choice__button--secondary {
  background: var(--proc-bg-card-compact);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: none;
}

#screen-procurement .procurement-role-choice__icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.045);
  border-radius: 8px;
  font-size: 18px;
  line-height: 1;
}

#screen-procurement .procurement-role-choice__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
}

#screen-procurement .procurement-role-choice__label {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 950;
}

#screen-procurement .procurement-role-choice__hint {
  color: var(--proc-muted);
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
}

#screen-procurement .procurement-role-choice__arrow {
  color: rgba(221, 230, 218, 0.68);
  font-size: 26px;
  line-height: 1;
}

#screen-procurement .procurement-instruction-open {
  align-self: center;
  border: 1px solid rgba(184, 255, 90, 0.18);
  background: rgba(184, 255, 90, 0.055);
  color: rgba(220, 255, 180, 0.9);
  border-radius: 999px;
  min-height: 34px;
  padding: 0 13px;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
}

#screen-procurement .procurement-instruction-modal {
  position: fixed;
  inset: 0;
  z-index: 2300;
  display: flex;
  align-items: stretch;
  justify-content: center;
  padding: 12px;
  background: rgba(0, 0, 0, 0.74);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

#screen-procurement .procurement-instruction-modal.hidden {
  display: none;
}

#screen-procurement .procurement-instruction-modal__panel {
  display: flex;
  flex-direction: column;
  width: min(100%, 1040px);
  max-height: calc(100svh - 24px);
  border: 1px solid var(--proc-border);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.006)),
    var(--proc-bg-card);
  border-radius: var(--proc-radius-card);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
  overflow: hidden;
}

#screen-procurement .procurement-instruction-modal__head {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(6, 9, 11, 0.96);
}

#screen-procurement .procurement-instruction-modal__head h3 {
  margin: 0;
  color: var(--text-main, #f4f7f2);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-instruction-modal__close {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.13);
  background: rgba(255, 255, 255, 0.055);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 34px;
  padding: 0 11px;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
}

#screen-procurement .procurement-instruction-modal__body {
  overflow: auto;
  padding: 12px;
}

#screen-procurement .procurement-instruction-modal__image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  border-radius: 10px;
}

#screen-procurement .procurement-instruction-modal__image.hidden {
  display: none;
}

#screen-procurement .procurement-instruction-modal__fallback {
  border: 1px solid rgba(184, 255, 90, 0.18);
  background: rgba(184, 255, 90, 0.055);
  border-radius: 10px;
  padding: 14px;
  color: var(--proc-muted);
  font-size: 14px;
  line-height: 1.4;
}

#screen-procurement .procurement-instruction-modal__fallback.hidden {
  display: none;
}

#screen-procurement .procurement-mode-bar {
  display: flex;
  justify-content: center;
  border: 0;
  background: transparent;
  padding: 0 0 2px;
  box-shadow: none;
  font-size: 0;
}

#screen-procurement .procurement-mode-bar > span {
  display: none;
}

#screen-procurement .procurement-mode-bar .procurement-change-role {
  color: var(--proc-muted);
  background: transparent;
  border-color: transparent;
  min-height: 28px;
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

#screen-procurement .procurement-change-role {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 10px;
  background: rgba(255, 255, 255, 0.06);
  font-size: 13px;
}

#screen-procurement .procurement-staff-mode__body p {
  margin: 0;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 15px;
  line-height: 1.4;
}

#screen-procurement .procurement-staff-mode__title.hidden,
#screen-procurement #procurement-staff-intro.hidden {
  display: none;
}

#screen-procurement .procurement-staff-catalog,
#screen-procurement .procurement-staff-categories,
#screen-procurement .procurement-staff-category,
#screen-procurement .procurement-staff-cart,
#screen-procurement .procurement-staff-items {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-staff-catalog.hidden,
#screen-procurement .procurement-staff-category.hidden,
#screen-procurement .procurement-staff-cart.hidden,
#screen-procurement .procurement-staff-empty.hidden,
#screen-procurement .procurement-staff-search.hidden,
#screen-procurement .procurement-staff-search__results.hidden {
  display: none;
}

#screen-procurement .procurement-staff-cart-bar {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  border: 1px solid var(--proc-accent-border);
  background: var(--proc-accent-soft);
  border-radius: 8px;
  padding: 10px;
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  font-weight: 900;
}

#screen-procurement .procurement-staff-search {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-staff-search__input {
  width: 100%;
  min-height: 44px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 0 12px;
  font: inherit;
  font-size: 15px;
  font-weight: 800;
}

#screen-procurement .procurement-staff-search__input::placeholder {
  color: var(--proc-muted);
}

#screen-procurement .procurement-staff-search__results {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-staff-categories--dimmed {
  opacity: 0.35;
}

#screen-procurement .procurement-staff-identity,
#screen-procurement .procurement-staff-profile,
#screen-procurement .procurement-detail-identity {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-staff-identity.hidden,
#screen-procurement .procurement-staff-profile.hidden {
  display: none;
}

#screen-procurement .procurement-staff-identity {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
}

#screen-procurement .procurement-staff-identity__label,
#screen-procurement .procurement-staff-identity__hint {
  color: var(--proc-muted);
  font-size: 13px;
  line-height: 1.35;
  font-weight: 700;
}

#screen-procurement .procurement-staff-identity__venue,
#screen-procurement .procurement-staff-profile,
#screen-procurement .procurement-detail-identity {
  color: var(--text-main, #f4f7f2);
  font-size: 13px;
  line-height: 1.35;
  font-weight: 800;
}

#screen-procurement .procurement-staff-identity__venue {
  margin-top: -8px;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-staff-identity__hint {
  margin-top: -2px;
}

#screen-procurement .procurement-staff-profile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#screen-procurement .procurement-staff-category-row,
#screen-procurement .procurement-staff-item,
#screen-procurement .procurement-staff-empty {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-staff-category-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  font: inherit;
  text-align: left;
}

#screen-procurement .procurement-staff-category-row__name,
#screen-procurement .procurement-staff-item__name,
#screen-procurement .procurement-staff-category__title {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement .procurement-staff-category-row__count,
#screen-procurement .procurement-staff-item__meta {
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.3;
  font-weight: 700;
}

#screen-procurement .procurement-staff-item {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-staff-qty {
  display: grid;
  grid-template-columns: 44px minmax(58px, 1fr) 44px minmax(76px, auto);
  gap: 8px;
}

#screen-procurement .procurement-staff-qty button,
#screen-procurement .procurement-staff-qty input,
#screen-procurement .procurement-unit-select,
#screen-procurement .procurement-staff-submit {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 44px;
  padding: 0 10px;
  font: inherit;
  font-size: 16px;
  font-weight: 900;
  text-align: center;
}

#screen-procurement .procurement-unit-select {
  cursor: pointer;
  appearance: auto;
}

#screen-procurement .procurement-staff-submit {
  width: 100%;
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.1), rgba(255, 255, 255, 0.04));
  border-color: rgba(184, 255, 90, 0.26);
}

#screen-procurement .procurement-staff-submit:disabled {
  cursor: wait;
  opacity: 0.62;
}

#screen-procurement .procurement-setup-intro,
#screen-procurement .procurement-future-step,
#screen-procurement .procurement-suppliers {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(14, 18, 24, 0.9);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-setup-intro__title {
  margin: 0;
  font-size: 22px;
  line-height: 1.15;
  font-weight: 900;
}

#screen-procurement .procurement-setup-intro p,
#screen-procurement .procurement-catalog-review p,
#screen-procurement .procurement-future-step__text,
#screen-procurement .procurement-suppliers__head p {
  margin: 8px 0 0;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 14px;
  line-height: 1.4;
}

#screen-procurement .procurement-future-steps {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-future-step__title {
  font-size: 15px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement .procurement-setup-steps {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-setup-step {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-setup-step--active {
  border-color: var(--proc-accent-border);
  background: var(--proc-accent-soft);
}

#screen-procurement .procurement-setup-step--locked {
  color: rgba(255, 255, 255, 0.5);
}

#screen-procurement .procurement-suppliers {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-suppliers__head {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-suppliers__title {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-supplier-new,
#screen-procurement .procurement-supplier-save,
#screen-procurement .procurement-supplier-cancel {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 48px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-new,
#screen-procurement .procurement-supplier-save {
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  border-color: var(--proc-accent-border);
}

#screen-procurement .procurement-supplier-new.hidden,
#screen-procurement .procurement-supplier-form.hidden,
#screen-procurement .procurement-suppliers-list.hidden,
#screen-procurement .procurement-supplier-detail.hidden,
#screen-procurement .procurement-supplier-picker.hidden,
#screen-procurement .procurement-suppliers-empty.hidden {
  display: none;
}

#screen-procurement .procurement-supplier-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-supplier-form__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

#screen-procurement .procurement-supplier-cancel {
  background: rgba(255, 255, 255, 0.06);
}

#screen-procurement .procurement-supplier-save:disabled {
  cursor: wait;
  opacity: 0.65;
}

#screen-procurement .procurement-suppliers-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-supplier-card,
#screen-procurement .procurement-suppliers-empty,
#screen-procurement .procurement-supplier-coverage,
#screen-procurement .procurement-coverage-row {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-supplier-card {
  cursor: pointer;
}

#screen-procurement .procurement-supplier-card__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

#screen-procurement .procurement-supplier-edit-input {
  width: 100%;
  min-height: 40px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.22);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 0 10px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 0;
}

#screen-procurement .procurement-supplier-card__action {
  min-height: 34px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 0 8px;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-card__action--danger {
  color: #ffd6d6;
  border-color: rgba(255, 120, 120, 0.28);
}

#screen-procurement .procurement-supplier-card:focus-visible,
#screen-procurement .procurement-supplier-detail-back:focus-visible,
#screen-procurement .procurement-supplier-picker-row:focus-within {
  outline: 3px solid rgba(184, 255, 90, 0.2);
  outline-offset: 2px;
}

#screen-procurement .procurement-supplier-card__name {
  overflow-wrap: anywhere;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement .procurement-supplier-card__meta,
#screen-procurement .procurement-supplier-card__comment,
#screen-procurement .procurement-suppliers-empty,
#screen-procurement .procurement-coverage-row__meta {
  margin-top: 6px;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 14px;
  line-height: 1.35;
}

#screen-procurement .procurement-supplier-coverage {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-order-catalog-status {
  border: 1px solid var(--proc-accent-border);
  background: var(--proc-accent-soft);
  border-radius: 8px;
  padding: 10px;
}

#screen-procurement .procurement-order-catalog-status__title {
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement #procurement-order-catalog-summary {
  margin-top: 5px;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.35;
  font-weight: 700;
}

#screen-procurement .procurement-supplier-coverage__stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.35;
  font-weight: 800;
}

#screen-procurement .procurement-coverage-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-coverage-list.hidden {
  display: none;
}

#screen-procurement .procurement-coverage-row__name {
  overflow-wrap: anywhere;
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-coverage-row__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 10px;
}

#screen-procurement .procurement-coverage-row__select,
#screen-procurement .procurement-coverage-row__assign {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 42px;
  padding: 0 10px;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
}

#screen-procurement .procurement-coverage-row__select {
  width: 100%;
  background: rgba(255, 255, 255, 0.06);
}

#screen-procurement .procurement-coverage-row__assign {
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  border-color: var(--proc-accent-border);
}

#screen-procurement .procurement-supplier-detail {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-supplier-detail-back {
  align-self: flex-start;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 42px;
  padding: 0 12px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-detail__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#screen-procurement .procurement-supplier-detail__title {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-supplier-detail__count {
  flex: 0 0 auto;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-detail__section-title {
  color: var(--text-main, #f4f7f2);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement .procurement-supplier-items,
#screen-procurement .procurement-supplier-picker-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-supplier-item,
#screen-procurement .procurement-supplier-picker-row,
#screen-procurement .procurement-supplier-picker-category {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 11px 12px;
}

#screen-procurement .procurement-supplier-item__name,
#screen-procurement .procurement-supplier-picker-row__name {
  overflow-wrap: anywhere;
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-item__meta,
#screen-procurement .procurement-supplier-picker-row__meta {
  margin-top: 5px;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.3;
}

#screen-procurement .procurement-supplier-picker {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--proc-accent-border);
  background: var(--proc-accent-soft);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-supplier-picker-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

#screen-procurement .procurement-supplier-picker-row input {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  accent-color: var(--proc-accent);
}

#screen-procurement .procurement-supplier-picker-row__content {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

#screen-procurement .procurement-supplier-picker-category {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--text-main, #f4f7f2);
  font: inherit;
  text-align: left;
}

#screen-procurement .procurement-supplier-picker-category:focus-visible {
  outline: 3px solid rgba(184, 255, 90, 0.2);
  outline-offset: 2px;
}

#screen-procurement .procurement-supplier-picker-category__name {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement .procurement-supplier-picker-category__count {
  flex: 0 0 auto;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 12px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-new-request {
  width: 100%;
  min-height: 56px;
  display: none;
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  border-color: var(--proc-accent-border);
}

#screen-procurement .procurement-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(14, 18, 24, 0.9);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-list-wrap.hidden {
  display: none;
}

#screen-procurement .procurement-access {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-access-card {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(14, 18, 24, 0.9);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-catalog {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(14, 18, 24, 0.9);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-catalog__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#screen-procurement .procurement-catalog__title {
  margin: 0;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-catalog__status {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.78);
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

#screen-procurement .procurement-catalog__empty,
#screen-procurement .procurement-catalog__summary {
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 14px;
  line-height: 1.35;
}

#screen-procurement .procurement-catalog__empty.hidden,
#screen-procurement .procurement-catalog__summary.hidden,
#screen-procurement .procurement-catalog-review.hidden,
#screen-procurement .procurement-catalog-source.hidden,
#screen-procurement .procurement-catalog__categories.hidden {
  display: none;
}

#screen-procurement .procurement-catalog__summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#screen-procurement .procurement-catalog__summary-title {
  color: var(--text-main, #f4f7f2);
  font-weight: 900;
}

#screen-procurement .procurement-catalog-review {
  border: 1px solid var(--proc-accent-border);
  background: var(--proc-accent-soft);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-catalog-review__title {
  margin: 0;
  color: var(--text-main, #f4f7f2);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-catalog-source {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-catalog-source__title {
  color: var(--text-main, #f4f7f2);
  font-size: 15px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-catalog-source p,
#screen-procurement .procurement-catalog-source__status {
  margin: 0;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.35;
}

#screen-procurement .procurement-catalog-source__actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-catalog-source__button {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 46px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-catalog__categories {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-catalog-category {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px 72px;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 10px 12px;
  font: inherit;
  text-align: left;
}

#screen-procurement .procurement-catalog-hide {
  width: 72px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.74);
  border-radius: 8px;
  min-height: 32px;
  padding: 0 9px;
  font: inherit;
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-category:focus-visible,
#screen-procurement .procurement-catalog-back:focus-visible,
#screen-procurement .procurement-catalog-hide:focus-visible {
  outline: 3px solid rgba(184, 255, 90, 0.2);
  outline-offset: 2px;
}

#screen-procurement .procurement-catalog-category__name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-category__count {
  min-width: 44px;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  font-weight: 800;
  text-align: right;
}

#screen-procurement .procurement-catalog-upload {
  border: 1px solid var(--proc-accent-border);
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 50px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-upload:disabled {
  cursor: wait;
  opacity: 0.65;
}

#screen-procurement .procurement-catalog-upload.hidden {
  display: none;
}

#screen-procurement .procurement-catalog-detail {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

#screen-procurement .procurement-catalog-detail.hidden {
  display: none;
}

#screen-procurement .procurement-catalog-back {
  align-self: flex-start;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 42px;
  padding: 0 12px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-detail__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#screen-procurement .procurement-catalog-detail__title {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-catalog-detail__count {
  flex: 0 0 auto;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-add-item {
  border: 1px solid var(--proc-accent-border);
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 44px;
  padding: 0 12px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-item-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-catalog-item-form.hidden {
  display: none;
}

#screen-procurement .procurement-catalog-item-form__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

#screen-procurement .procurement-catalog-item-submit,
#screen-procurement .procurement-catalog-item-cancel {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 48px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-item-submit {
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.1), rgba(255, 255, 255, 0.04));
  border-color: rgba(184, 255, 90, 0.26);
}

#screen-procurement .procurement-catalog-item-cancel {
  background: rgba(255, 255, 255, 0.06);
}

#screen-procurement .procurement-clean-save {
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--proc-accent-border);
  background: var(--proc-accent-soft);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-clean-save.hidden {
  display: none;
}

#screen-procurement .procurement-clean-save__status {
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 14px;
  line-height: 1.35;
  font-weight: 700;
}

#screen-procurement .procurement-catalog-draft-note {
  display: flex;
  flex-direction: column;
  gap: 3px;
  border: 1px solid rgba(255, 204, 92, 0.2);
  background: rgba(255, 204, 92, 0.08);
  color: rgba(255, 238, 190, 0.95);
  border-radius: 8px;
  padding: 10px;
  font-size: 13px;
  line-height: 1.35;
}

#screen-procurement .procurement-catalog-draft-note.hidden {
  display: none;
}

#screen-procurement .procurement-catalog-draft-note span {
  color: rgba(255, 238, 190, 0.76);
}

#screen-procurement .procurement-clean-save__button {
  border: 1px solid rgba(184, 255, 90, 0.26);
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.1), rgba(255, 255, 255, 0.04));
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 48px;
  padding: 0 14px;
  font: inherit;
  font-weight: 900;
}

#screen-procurement .procurement-clean-save__button:disabled {
  cursor: wait;
  opacity: 0.65;
}

#screen-procurement .procurement-dirty-modal {
  position: fixed;
  inset: 0;
  z-index: 2400;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

#screen-procurement .procurement-dirty-modal.hidden {
  display: none;
}

#screen-procurement .procurement-dirty-modal__panel {
  display: flex;
  width: min(100%, 420px);
  flex-direction: column;
  gap: 12px;
  border: 1px solid var(--proc-border);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.006)),
    var(--proc-bg-card);
  color: var(--text-main, #f4f7f2);
  border-radius: var(--proc-radius-card);
  padding: 16px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
}

#screen-procurement .procurement-dirty-modal__panel h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-dirty-modal__panel p {
  margin: 0;
  color: var(--proc-muted);
  font-size: 14px;
  line-height: 1.4;
}

#screen-procurement .procurement-dirty-modal__actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-dirty-modal__discard {
  border: 1px solid rgba(255, 120, 120, 0.22);
  background: rgba(255, 100, 100, 0.08);
  color: rgba(255, 205, 205, 0.94);
  border-radius: 8px;
  min-height: 44px;
  padding: 0 14px;
  font: inherit;
  font-weight: 850;
}

#screen-procurement .procurement-catalog-items {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-catalog-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 11px 12px;
}

#screen-procurement .procurement-catalog-item__content {
  min-width: 0;
}

#screen-procurement .procurement-catalog-item__name {
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-item__meta {
  margin-top: 6px;
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.3;
}

#screen-procurement .procurement-create {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(14, 18, 24, 0.9);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-create.hidden {
  display: none;
}

#screen-procurement .procurement-create__title {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 800;
}

#screen-procurement .procurement-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

#screen-procurement .procurement-field__label {
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
}

#screen-procurement .procurement-input,
#screen-procurement .procurement-textarea {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 12px;
  font: inherit;
  font-size: 16px;
  line-height: 1.35;
  outline: none;
}

#screen-procurement .procurement-input {
  min-height: 48px;
}

#screen-procurement .procurement-textarea {
  min-height: 104px;
  resize: vertical;
}

#screen-procurement .procurement-input::placeholder,
#screen-procurement .procurement-textarea::placeholder {
  color: rgba(255, 255, 255, 0.42);
}

#screen-procurement .procurement-input:focus,
#screen-procurement .procurement-textarea:focus {
  border-color: rgba(184, 255, 90, 0.28);
  box-shadow: 0 0 0 3px rgba(184, 255, 90, 0.08);
}

#screen-procurement .procurement-create__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

#screen-procurement .procurement-create-submit,
#screen-procurement .procurement-create-cancel {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 50px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-create-submit {
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.1), rgba(255, 255, 255, 0.04));
  border-color: rgba(184, 255, 90, 0.26);
}

#screen-procurement .procurement-create-submit:disabled {
  cursor: wait;
  opacity: 0.65;
}

#screen-procurement .procurement-create-cancel {
  background: rgba(255, 255, 255, 0.06);
}

#screen-procurement .procurement-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-detail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#screen-procurement .procurement-detail.hidden {
  display: none;
}

#screen-procurement .procurement-detail-back {
  align-self: flex-start;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 44px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-detail__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

#screen-procurement .procurement-detail__title {
  min-width: 0;
  margin: 0;
  color: var(--text-main, #f4f7f2);
  overflow-wrap: anywhere;
  font-size: 22px;
  line-height: 1.18;
  font-weight: 900;
}

#screen-procurement .procurement-detail__date,
#screen-procurement .procurement-detail__comment,
#screen-procurement .procurement-detail-empty,
#screen-procurement .procurement-detail-row__meta,
#screen-procurement .procurement-detail-row__comment {
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 14px;
  line-height: 1.35;
}

#screen-procurement .procurement-detail__date {
  margin-top: -4px;
  font-weight: 800;
}

#screen-procurement .procurement-detail-identity:empty {
  display: none;
}

#screen-procurement .procurement-detail__comment,
#screen-procurement .procurement-detail-section,
#screen-procurement .procurement-detail-row {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(14, 18, 24, 0.88);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-detail__comment.hidden {
  display: none;
}

#screen-procurement .procurement-detail-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-add-item {
  border: 1px solid var(--proc-accent-border);
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 48px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-add-item.hidden {
  display: none;
}

#screen-procurement .procurement-item-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-item-form.hidden {
  display: none;
}

#screen-procurement .procurement-item-form__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

#screen-procurement .procurement-item-save,
#screen-procurement .procurement-item-cancel {
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 50px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-item-save {
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.1), rgba(255, 255, 255, 0.04));
  border-color: rgba(184, 255, 90, 0.26);
}

#screen-procurement .procurement-item-save:disabled {
  cursor: wait;
  opacity: 0.65;
}

#screen-procurement .procurement-item-cancel {
  background: rgba(255, 255, 255, 0.06);
}

#screen-procurement .procurement-detail-section__title {
  margin: 0;
  color: var(--text-main, #f4f7f2);
  font-size: 15px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-detail-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-detail-supplier-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 2px;
}

#screen-procurement .procurement-detail-supplier-group__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#screen-procurement .procurement-detail-supplier-group__title {
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 900;
}

#screen-procurement .procurement-detail-copy {
  flex: 0 0 auto;
  border: 1px solid rgba(196, 255, 70, 0.44);
  background:
    linear-gradient(135deg, rgba(154, 236, 58, 0.28) 0%, rgba(56, 104, 45, 0.5) 48%, rgba(17, 29, 18, 0.96) 100%);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 36px;
  padding: 0 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.32),
    0 0 18px rgba(178, 255, 45, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

#screen-procurement .procurement-detail-copy:hover,
#screen-procurement .procurement-detail-copy:focus-visible {
  border-color: rgba(206, 255, 75, 0.62);
  background:
    linear-gradient(135deg, rgba(174, 246, 68, 0.34) 0%, rgba(65, 118, 50, 0.56) 48%, rgba(18, 32, 18, 0.98) 100%);
}

@media (max-width: 420px) {
  #screen-procurement .procurement-detail-supplier-group__header {
    align-items: stretch;
    flex-direction: column;
  }

  #screen-procurement .procurement-detail-copy {
    width: 100%;
  }
}

#screen-procurement .procurement-invite-copy {
  width: 100%;
  margin-top: 10px;
  border: 1px solid var(--proc-accent-border);
  background: linear-gradient(135deg, rgba(184, 255, 90, 0.08), rgba(255, 255, 255, 0.04));
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 48px;
  padding: 0 14px;
  font: inherit;
  font-weight: 900;
}

#screen-procurement .procurement-invite-venue {
  margin-top: 12px;
}

#screen-procurement .procurement-invite-result {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  border-radius: 8px;
  padding: 12px;
}

#screen-procurement .procurement-invite-result.hidden,
#screen-procurement .procurement-invite-share.hidden {
  display: none;
}

#screen-procurement .procurement-invite-result__title {
  color: var(--text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.2;
  font-weight: 900;
}

#screen-procurement .procurement-invite-result__input {
  font-size: 13px;
}

#screen-procurement .procurement-invite-result__actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

#screen-procurement .procurement-invite-result__actions .procurement-invite-copy {
  margin-top: 0;
}

#screen-procurement .procurement-invite-share {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 46px;
  padding: 0 14px;
  font: inherit;
  font-weight: 800;
}

#screen-procurement .procurement-invite-copy:disabled {
  cursor: wait;
  opacity: 0.65;
}

#screen-procurement .procurement-detail-row__title {
  color: var(--text-main, #f4f7f2);
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-detail-row__meta,
#screen-procurement .procurement-detail-row__comment {
  margin-top: 6px;
}

#screen-procurement .procurement-detail-row__summary {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  color: var(--text-muted, #a8b0aa);
  font-size: 13px;
  line-height: 1.35;
}

#screen-procurement .procurement-detail-row__actions {
  display: grid;
  grid-template-columns: 42px minmax(56px, 1fr) 42px minmax(76px, auto) auto;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
}

#screen-procurement .procurement-detail-row__qty-button,
#screen-procurement .procurement-detail-row__remove {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  min-height: 40px;
  padding: 0 10px;
  font: inherit;
  font-weight: 900;
}

#screen-procurement .procurement-detail-row__qty-input {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.24);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 0 10px;
  font: inherit;
  font-weight: 800;
  text-align: center;
}

#screen-procurement .procurement-detail-row__remove {
  color: #ffd6d6;
  border-color: rgba(255, 120, 120, 0.28);
}

#screen-procurement .procurement-detail-empty.hidden {
  display: none;
}

#screen-procurement .procurement-card,
#screen-procurement .procurement-empty {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(14, 18, 24, 0.88);
  color: var(--text-main, #f4f7f2);
  border-radius: 8px;
  padding: 14px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
}

#screen-procurement .procurement-card {
  cursor: pointer;
}

#screen-procurement .procurement-card:focus-visible {
  outline: 3px solid rgba(184, 255, 90, 0.2);
  outline-offset: 2px;
}

#screen-procurement .procurement-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#screen-procurement .procurement-card__title {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 16px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-card__meta,
#screen-procurement .procurement-card__comment,
#screen-procurement .procurement-empty {
  color: var(--muted, rgba(255, 255, 255, 0.66));
  font-size: 14px;
  line-height: 1.35;
}

#screen-procurement .procurement-card__comment {
  margin-top: 10px;
}

#screen-procurement .procurement-card__meta {
  margin-top: 12px;
}

#screen-procurement .procurement-status {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.8);
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
}

#screen-procurement .procurement-status--draft {
  color: #ffe7a3;
  background: rgba(255, 204, 92, 0.12);
}

#screen-procurement .procurement-status--submitted {
  color: #b8ff90;
  background: rgba(120, 255, 150, 0.12);
}

#screen-procurement .procurement-status--viewed {
  color: #a9d7ff;
  background: rgba(89, 169, 255, 0.13);
}

#screen-procurement .procurement-status--approved {
  color: #b8ff90;
  background: rgba(120, 255, 150, 0.12);
}

#screen-procurement .procurement-status--rejected {
  color: #ffb1b1;
  background: rgba(255, 100, 100, 0.13);
}

/* Reuse the start-screen action-card visual language for procurement. */
#screen-procurement .procurement-role-choice,
#screen-procurement .procurement-staff-mode__body,
#screen-procurement .procurement-setup-intro,
#screen-procurement .procurement-future-step,
#screen-procurement .procurement-suppliers,
#screen-procurement .procurement-list-wrap,
#screen-procurement .procurement-access-card,
#screen-procurement .procurement-catalog,
#screen-procurement .procurement-create,
#screen-procurement .procurement-card,
#screen-procurement .procurement-empty {
  border: 1px solid var(--rev-border-soft, var(--proc-border));
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.006)),
    var(--rev-card-bg, var(--proc-bg-card));
  border-radius: var(--rev-radius-card, var(--proc-radius-card));
  box-shadow: var(--rev-shadow-card, var(--proc-shadow-card));
}

#screen-procurement .procurement-nav {
  position: relative;
  display: block;
  margin: 0 0 2px;
  padding: 10px 12px 11px;
  overflow: hidden;
  border: 1px solid rgba(225, 236, 241, 0.08);
  border-radius: var(--rev-radius-card, 12px);
  background:
    radial-gradient(circle at 14% 0%, rgba(206, 255, 75, 0.12), transparent 38%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.004)),
    var(--rev-card-bg-quiet, #050708);
  box-shadow: none;
}

#screen-procurement .procurement-nav::before {
  content: "";
  position: absolute;
  top: 0;
  left: 12px;
  right: 12px;
  height: 1px;
  background: linear-gradient(90deg, rgba(206, 255, 75, 0.54), rgba(206, 255, 75, 0.08), transparent);
  pointer-events: none;
}

#screen-procurement .procurement-nav__top {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

#screen-procurement .procurement-back {
  align-self: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: var(--rev-radius-icon, 10px);
  border-color: rgba(225, 236, 241, 0.1);
  background: rgba(13, 18, 20, 0.92);
  color: rgba(236, 243, 246, 0.78);
  font-size: 18px;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

#screen-procurement .procurement-title {
  color: var(--rev-accent-title, #e8ffc4);
  font-size: 24px;
  line-height: 1.05;
  font-weight: 850;
  letter-spacing: 0;
  text-shadow: 0 0 10px var(--rev-glow-accent, rgba(196, 255, 70, 0.2));
  text-transform: none;
}

#screen-procurement .procurement-nav__subtitle {
  margin-top: 6px;
  padding-left: 56px;
  color: var(--rev-text-soft, rgba(236, 243, 246, 0.76));
  font-size: 13px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-nav__text {
  margin-top: 2px;
  padding-left: 56px;
  color: var(--proc-muted);
  font-size: 12px;
  line-height: 1.3;
}

#screen-procurement .procurement-role-choice {
  gap: 10px;
  padding: 13px;
}

#screen-procurement .procurement-role-choice__title,
#screen-procurement .procurement-staff-mode__title,
#screen-procurement .procurement-manager-hero__title,
#screen-procurement .procurement-setup-intro__title {
  color: var(--rev-text-main, #f4f7f2);
  font-size: 18px;
  line-height: 1.18;
  font-weight: 850;
}

#screen-procurement .procurement-role-choice__subtitle,
#screen-procurement .procurement-manager-hero p,
#screen-procurement .procurement-setup-intro p,
#screen-procurement .procurement-catalog-review p,
#screen-procurement .procurement-future-step__text,
#screen-procurement .procurement-suppliers__head p {
  color: var(--proc-muted);
  font-size: 12px;
  line-height: 1.35;
}

#screen-procurement .procurement-role-choice__button,
#screen-procurement .procurement-home-card {
  position: relative;
  min-height: 64px;
  padding: 12px 14px;
  border: 1px solid var(--rev-border-soft, var(--proc-border));
  border-radius: var(--rev-radius-card, var(--proc-radius-card));
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.026), rgba(255, 255, 255, 0.006)),
    var(--rev-card-bg, var(--proc-bg-card));
  box-shadow: var(--rev-shadow-card, var(--proc-shadow-card));
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

#screen-procurement .procurement-role-choice__button:not(.procurement-role-choice__button--secondary),
#screen-procurement .procurement-home-card--primary {
  min-height: 74px;
  border-color: rgba(196, 255, 70, 0.42);
  background:
    linear-gradient(135deg, rgba(154, 236, 58, 0.16) 0%, rgba(38, 82, 36, 0.38) 42%, rgba(4, 9, 8, 0.98) 100%),
    var(--rev-card-bg-primary, var(--proc-bg-card-primary));
  box-shadow:
    0 16px 32px rgba(0, 0, 0, 0.52),
    0 0 26px var(--rev-glow-card, rgba(178, 255, 45, 0.12)),
    0 0 0 1px rgba(196, 255, 70, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

#screen-procurement .procurement-role-choice__button--secondary {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    var(--rev-card-bg-compact, var(--proc-bg-card-compact));
}

#screen-procurement .procurement-role-choice__button:hover,
#screen-procurement .procurement-home-card:hover,
#screen-procurement .procurement-card:hover,
#screen-procurement .procurement-supplier-card:hover,
#screen-procurement .procurement-catalog-category:hover,
#screen-procurement .procurement-staff-category-row:hover {
  transform: translateY(-1px);
  border-color: rgba(225, 236, 241, 0.18);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

#screen-procurement .procurement-role-choice__icon,
#screen-procurement .procurement-home-card__icon {
  width: var(--rev-icon-size, 38px);
  height: var(--rev-icon-size, 38px);
  border-radius: var(--rev-radius-icon, 10px);
  border-color: rgba(225, 236, 241, 0.08);
  background: #0d1214;
  color: rgba(236, 243, 246, 0.84);
  font-size: 18px;
  opacity: 0.9;
}

#screen-procurement .procurement-home-card__icon svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#screen-procurement .procurement-home-card--primary .procurement-home-card__icon {
  color: var(--rev-accent-icon, #efffc0);
}

#screen-procurement .procurement-role-choice__label,
#screen-procurement .procurement-home-card__title,
#screen-procurement .procurement-card__title {
  color: var(--rev-text-main, #f4f7f2);
  font-size: 15px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-role-choice__hint,
#screen-procurement .procurement-home-card__status,
#screen-procurement .procurement-card__meta,
#screen-procurement .procurement-card__comment,
#screen-procurement .procurement-empty {
  color: rgba(205, 215, 221, 0.68);
  font-size: 12px;
  line-height: 1.32;
  font-weight: 650;
}

#screen-procurement .procurement-role-choice__arrow,
#screen-procurement .procurement-home-card__arrow {
  color: rgba(236, 243, 246, 0.62);
  font-size: 25px;
  font-weight: 400;
}

#screen-procurement .procurement-staff-accesses {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
}

#screen-procurement .procurement-staff-accesses.hidden,
#screen-procurement .procurement-staff-accesses__empty.hidden {
  display: none;
}

#screen-procurement .procurement-staff-accesses__title {
  color: var(--rev-text-main, #f4f7f2);
  font-size: 13px;
  line-height: 1.25;
  font-weight: 850;
}

#screen-procurement .procurement-staff-accesses__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

#screen-procurement .procurement-staff-access-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 54px;
  padding: 10px 12px;
  border: 1px solid var(--rev-border-soft, var(--proc-border));
  border-radius: var(--rev-radius-card, var(--proc-radius-card));
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.02), rgba(255, 255, 255, 0.004)),
    var(--rev-card-bg-compact, var(--proc-bg-card-compact));
  color: var(--rev-text-main, #f4f7f2);
  font: inherit;
  text-align: left;
}

#screen-procurement .procurement-staff-access-card__body {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

#screen-procurement .procurement-staff-access-card__title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 800;
}

#screen-procurement .procurement-staff-access-card__meta,
#screen-procurement .procurement-staff-accesses__empty {
  color: rgba(205, 215, 221, 0.68);
  font-size: 12px;
  line-height: 1.32;
}

#screen-procurement .procurement-staff-access-card__arrow {
  color: rgba(236, 243, 246, 0.62);
  font-size: 22px;
}

#screen-procurement .procurement-home-card--primary {
  min-height: 74px;
}

#screen-procurement .procurement-home-card__badge,
#screen-procurement .procurement-status,
#screen-procurement .procurement-catalog__status {
  border: 1px solid rgba(225, 236, 241, 0.1);
  background: rgba(255, 255, 255, 0.055);
  color: rgba(236, 243, 246, 0.74);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

#screen-procurement .procurement-home-card__badge,
#screen-procurement .procurement-status--submitted,
#screen-procurement .procurement-status--approved {
  border-color: rgba(184, 255, 90, 0.26);
  background: rgba(184, 255, 90, 0.09);
  color: rgba(210, 255, 151, 0.9);
}

#screen-procurement .procurement-status--viewed {
  border-color: rgba(133, 183, 255, 0.2);
  background: rgba(89, 169, 255, 0.095);
  color: rgba(190, 220, 255, 0.86);
}

#screen-procurement .procurement-status--draft {
  border-color: rgba(255, 204, 92, 0.2);
  background: rgba(255, 204, 92, 0.095);
  color: rgba(255, 231, 163, 0.88);
}

#screen-procurement .procurement-status--rejected {
  border-color: rgba(255, 120, 120, 0.2);
  background: rgba(255, 100, 100, 0.095);
  color: rgba(255, 194, 194, 0.9);
}

#screen-procurement .procurement-section-back,
#screen-procurement .procurement-catalog-back,
#screen-procurement .procurement-detail-back,
#screen-procurement .procurement-supplier-detail-back,
#screen-procurement .procurement-change-role {
  min-height: 34px;
  border-radius: var(--rev-radius-action, 7px);
  border-color: var(--rev-border-soft, var(--proc-border));
  background: var(--rev-card-bg-compact, var(--proc-bg-card-compact));
  color: rgba(236, 243, 246, 0.78);
  font-size: 12px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.028);
}

#screen-procurement .procurement-catalog,
#screen-procurement .procurement-suppliers,
#screen-procurement .procurement-list-wrap,
#screen-procurement .procurement-access-card {
  gap: 10px;
  padding: 13px;
}

#screen-procurement .procurement-catalog__title,
#screen-procurement .procurement-suppliers__title,
#screen-procurement .procurement-detail__title,
#screen-procurement .procurement-supplier-detail__title,
#screen-procurement .procurement-catalog-detail__title {
  color: var(--rev-text-main, #f4f7f2);
  font-size: 17px;
  line-height: 1.2;
  font-weight: 850;
}

#screen-procurement .procurement-catalog-review,
#screen-procurement .procurement-clean-save,
#screen-procurement .procurement-order-catalog-status,
#screen-procurement .procurement-supplier-picker,
#screen-procurement .procurement-staff-cart-bar {
  border: 1px solid rgba(184, 255, 90, 0.2);
  background:
    linear-gradient(135deg, rgba(184, 255, 90, 0.055), rgba(255, 255, 255, 0.012)),
    var(--rev-card-bg-primary, var(--proc-bg-card-primary));
  border-radius: var(--rev-radius-card, var(--proc-radius-card));
  box-shadow: 0 0 16px rgba(184, 255, 90, 0.045);
}

#screen-procurement .procurement-staff-category-row,
#screen-procurement .procurement-staff-item,
#screen-procurement .procurement-staff-empty,
#screen-procurement .procurement-staff-identity,
#screen-procurement .procurement-staff-profile,
#screen-procurement .procurement-detail-identity,
#screen-procurement .procurement-supplier-card,
#screen-procurement .procurement-suppliers-empty,
#screen-procurement .procurement-supplier-coverage,
#screen-procurement .procurement-coverage-row,
#screen-procurement .procurement-supplier-form,
#screen-procurement .procurement-supplier-item,
#screen-procurement .procurement-supplier-picker-row,
#screen-procurement .procurement-supplier-picker-category,
#screen-procurement .procurement-catalog-category,
#screen-procurement .procurement-catalog-item-form,
#screen-procurement .procurement-catalog-item,
#screen-procurement .procurement-item-form,
#screen-procurement .procurement-detail__comment,
#screen-procurement .procurement-detail-section,
#screen-procurement .procurement-detail-row {
  border: 1px solid var(--rev-border-soft, var(--proc-border));
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.022), rgba(255, 255, 255, 0.004)),
    var(--rev-card-bg-compact, var(--proc-bg-card-compact));
  border-radius: var(--rev-radius-card, var(--proc-radius-card));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.022);
}

#screen-procurement .procurement-catalog-category {
  grid-template-columns: minmax(0, 1fr) 46px 62px;
  min-height: 50px;
  padding: 9px 10px 9px 12px;
}

#screen-procurement .procurement-catalog-category__name,
#screen-procurement .procurement-staff-category-row__name,
#screen-procurement .procurement-staff-item__name,
#screen-procurement .procurement-catalog-item__name,
#screen-procurement .procurement-supplier-card__name,
#screen-procurement .procurement-supplier-item__name,
#screen-procurement .procurement-supplier-picker-row__name,
#screen-procurement .procurement-detail-row__title {
  color: var(--rev-text-main, #f4f7f2);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

#screen-procurement .procurement-catalog-category__count,
#screen-procurement .procurement-staff-category-row__count,
#screen-procurement .procurement-staff-item__meta,
#screen-procurement .procurement-catalog-item__meta,
#screen-procurement .procurement-supplier-card__meta,
#screen-procurement .procurement-supplier-card__comment,
#screen-procurement .procurement-coverage-row__meta,
#screen-procurement .procurement-supplier-detail__count,
#screen-procurement .procurement-supplier-item__meta,
#screen-procurement .procurement-supplier-picker-row__meta,
#screen-procurement .procurement-detail__date,
#screen-procurement .procurement-detail__comment,
#screen-procurement .procurement-detail-empty,
#screen-procurement .procurement-detail-row__meta,
#screen-procurement .procurement-detail-row__comment,
#screen-procurement .procurement-detail-row__summary {
  color: rgba(205, 215, 221, 0.66);
  font-size: 12px;
  line-height: 1.32;
}

#screen-procurement .procurement-catalog-hide,
#screen-procurement .procurement-supplier-card__action {
  min-height: 30px;
  border-radius: var(--rev-radius-action, 7px);
  border-color: rgba(225, 236, 241, 0.12);
  background: rgba(255, 255, 255, 0.045);
  color: rgba(236, 243, 246, 0.74);
  font-size: 11px;
  font-weight: 800;
}

#screen-procurement .procurement-supplier-card__action--danger,
#screen-procurement .procurement-detail-row__remove {
  color: rgba(255, 202, 202, 0.92);
  border-color: rgba(255, 120, 120, 0.24);
  background: rgba(255, 100, 100, 0.075);
}

#screen-procurement .procurement-supplier-card {
  padding: 11px 12px;
}

#screen-procurement .procurement-supplier-card__actions {
  gap: 6px;
}

#screen-procurement .procurement-supplier-card__meta,
#screen-procurement .procurement-supplier-card__comment,
#screen-procurement .procurement-card__meta,
#screen-procurement .procurement-card__comment {
  margin-top: 6px;
}

#screen-procurement .procurement-input,
#screen-procurement .procurement-textarea,
#screen-procurement .procurement-staff-search__input,
#screen-procurement .procurement-supplier-edit-input,
#screen-procurement .procurement-coverage-row__select,
#screen-procurement .procurement-detail-row__qty-input {
  border-color: rgba(225, 236, 241, 0.12);
  background: rgba(255, 255, 255, 0.045);
  color: var(--rev-text-main, #f4f7f2);
  border-radius: var(--rev-radius-compact, var(--proc-radius-compact));
  font-size: 14px;
}

#screen-procurement .procurement-staff-search__input {
  min-height: 42px;
  font-weight: 750;
}

#screen-procurement .procurement-catalog-upload,
#screen-procurement .procurement-catalog-add-item,
#screen-procurement .procurement-clean-save__button,
#screen-procurement .procurement-supplier-new,
#screen-procurement .procurement-supplier-save,
#screen-procurement .procurement-coverage-row__assign,
#screen-procurement .procurement-staff-submit,
#screen-procurement .procurement-invite-copy,
#screen-procurement .procurement-create-submit,
#screen-procurement .procurement-add-item,
#screen-procurement .procurement-item-save,
#screen-procurement .procurement-catalog-item-submit {
  border-color: rgba(184, 255, 90, 0.24);
  background:
    linear-gradient(135deg, rgba(184, 255, 90, 0.085), rgba(255, 255, 255, 0.018)),
    var(--rev-card-bg-primary, var(--proc-bg-card-primary));
  color: var(--rev-text-main, #f4f7f2);
  border-radius: var(--rev-radius-compact, var(--proc-radius-compact));
  box-shadow: 0 0 14px rgba(184, 255, 90, 0.04);
}

#screen-procurement .procurement-supplier-cancel,
#screen-procurement .procurement-catalog-item-cancel,
#screen-procurement .procurement-create-cancel,
#screen-procurement .procurement-item-cancel,
#screen-procurement .procurement-staff-qty button,
#screen-procurement .procurement-staff-qty input,
#screen-procurement .procurement-unit-select,
#screen-procurement .procurement-detail-row__qty-button {
  border-color: rgba(225, 236, 241, 0.12);
  background: rgba(255, 255, 255, 0.045);
  color: var(--rev-text-main, #f4f7f2);
  border-radius: var(--rev-radius-compact, var(--proc-radius-compact));
}

#screen-procurement .procurement-staff-qty {
  grid-template-columns: 40px minmax(52px, 1fr) 40px minmax(70px, auto);
  gap: 7px;
}

#screen-procurement .procurement-staff-qty button,
#screen-procurement .procurement-staff-qty input,
#screen-procurement .procurement-unit-select {
  min-height: 40px;
  font-size: 14px;
}

#screen-procurement .procurement-detail-row__actions {
  grid-template-columns: 38px minmax(50px, 1fr) 38px minmax(68px, auto) auto;
  gap: 7px;
}

#screen-procurement .procurement-detail-row__qty-button,
#screen-procurement .procurement-detail-row__remove,
#screen-procurement .procurement-detail-row__qty-input {
  min-height: 38px;
  font-size: 13px;
}

#screen-procurement .procurement-detail-section {
  padding: 11px;
}

#screen-procurement .procurement-detail-supplier-group__header {
  align-items: center;
  padding: 2px 0;
}

#screen-procurement .procurement-detail-supplier-group__title,
#screen-procurement .procurement-detail-section__title,
#screen-procurement .procurement-supplier-detail__section-title {
  color: var(--rev-text-main, #f4f7f2);
  font-size: 13px;
  font-weight: 850;
}

#screen-procurement .procurement-detail-row {
  padding: 10px 11px;
}

@media (max-width: 420px) {
  #screen-procurement {
    padding-inline: 10px;
  }

  #screen-procurement .procurement-home-card,
  #screen-procurement .procurement-role-choice__button {
    grid-template-columns: 36px minmax(0, 1fr) 20px;
    gap: 10px;
    padding: 11px 12px;
  }

  #screen-procurement .procurement-home-card--primary {
    grid-template-columns: 36px minmax(0, 1fr) auto 20px;
  }

  #screen-procurement .procurement-home-card__icon,
  #screen-procurement .procurement-role-choice__icon {
    width: 36px;
    height: 36px;
    font-size: 17px;
  }

  #screen-procurement .procurement-detail-row__actions {
    grid-template-columns: 36px minmax(46px, 1fr) 36px minmax(64px, auto);
  }

  #screen-procurement .procurement-detail-row__remove {
    grid-column: 1 / -1;
  }
}