/* Estimator - эстимейты и инвойсы (view/user/estimator/*).

   Отдельный файл по той же причине, что jobs.css и остальные: style.css
   собирается из LESS-проекта, правки в нём затрутся при сборке.
   Классы свои (est-*), не .form / .input / .input-form__field: на те
   цепляются общие скрипты форм сайта (form-validator.js, float-labels.js).
   Акцент и рамки - как у карточек «Работы» и событий. */

.est__wrapper {
  max-width: 1124px;
  margin: 0 auto;
  padding: 0 50px 60px;
}

.est__subtitle {
  margin: 0 0 20px;
  color: #6b6d70;
  font-size: 15px;
}

/* ------------------------------ сообщения ------------------------------ */

.est-message {
  margin: 0 0 18px;
  padding: 12px 16px;
  border-radius: 8px;
  background: #e9f7fc;
  color: #2d2e30;
  font-size: 15px;
  line-height: 22px;
}

.est-message--warn {
  background: #fff6e0;
}

.est-message--error {
  padding-left: 34px;
  background: #fdecec;
  color: #a12a2a;
}

.est-empty {
  margin: 24px 0;
  color: #6b6d70;
}

.est-hint {
  margin: 8px 0 0;
  color: #8a8c8f;
  font-size: 13px;
  line-height: 18px;
}

/* ------------------------------ кнопки ------------------------------ */

.est-btn {
  display: inline-block;
  padding: 8px 18px;
  border: 1px solid rgba(174, 174, 174, 0.6);
  border-radius: 20px;
  background: #fff;
  color: #2d2e30;
  font: inherit;
  font-size: 15px;
  line-height: 22px;
  text-decoration: none;
  cursor: pointer;
}

.est-btn:hover {
  border-color: #3ebce6;
  color: #3ebce6;
}

.est-btn--primary {
  border-color: #3ebce6;
  background: #3ebce6;
  color: #fff;
}

.est-btn--primary:hover {
  background: #2aa6d0;
  border-color: #2aa6d0;
  color: #fff;
}

.est-btn--ghost {
  border-color: transparent;
}

.est-btn--danger:hover {
  border-color: #d14343;
  color: #d14343;
}

.est-icon-btn {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid rgba(174, 174, 174, 0.6);
  border-radius: 50%;
  background: #fff;
  color: #6b6d70;
  font-size: 15px;
  line-height: 30px;
  cursor: pointer;
}

.est-icon-btn:hover {
  border-color: #3ebce6;
  color: #3ebce6;
}

.est-icon-btn--danger:hover {
  border-color: #d14343;
  color: #d14343;
}

/* ------------------------------ поля ------------------------------ */

.est-input {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid rgba(174, 174, 174, 0.8);
  border-radius: 8px;
  background: #fff;
  color: #2d2e30;
  font: inherit;
  font-size: 15px;
  line-height: 22px;
}

.est-input:focus {
  outline: none;
  border-color: #3ebce6;
  box-shadow: 0 0 0 2px rgba(62, 188, 230, 0.2);
}

textarea.est-input {
  resize: vertical;
}

.est-input--color {
  height: 40px;
  padding: 3px;
}

.est-label {
  display: block;
  margin: 0 0 4px;
  color: #6b6d70;
  font-size: 13px;
  line-height: 18px;
}

.est-field {
  margin: 0 0 12px;
}

.est-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0 12px;
}

.est-row > .est-field {
  flex: 1 1 120px;
}

.est-row > .est-field--color {
  flex: 0 0 70px;
}

.est-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 15px;
  cursor: pointer;
}

.est-check[hidden],
.est-field[hidden] {
  display: none;
}

/* ------------------------------ список ------------------------------ */

.est-new {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 20px;
}

.est-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 16px;
}

.est-filters__select {
  width: auto;
}

.est-filters__q {
  flex: 1 1 200px;
  width: auto;
}

.est-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid rgba(174, 174, 174, 0.5);
  border-radius: 10px;
  background: #fff;
}

.est-list__item + .est-list__item {
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-list__link {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  color: inherit;
  text-decoration: none;
}

.est-list__link:hover {
  background: #f6fbfd;
}

.est-list__main,
.est-list__side {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.est-list__side {
  align-items: flex-end;
  flex-shrink: 0;
}

.est-list__number {
  font-weight: 700;
}

.est-list__client {
  overflow: hidden;
  color: #6b6d70;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.est-list__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #8a8c8f;
  font-size: 13px;
}

.est-type {
  display: inline-block;
  margin-right: 6px;
  padding: 1px 8px;
  border-radius: 10px;
  background: #e9f7fc;
  color: #1f8db3;
  font-size: 12px;
  font-weight: 600;
  vertical-align: 1px;
}

.est-type--invoice {
  background: #efeaff;
  color: #5b45b0;
}

.est-status {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 10px;
  background: #f0f0f1;
  color: #50575e;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  vertical-align: middle;
}

.est-status--sent { background: #e9f7fc; color: #1f8db3; }
.est-status--accepted,
.est-status--paid { background: #e6f6ea; color: #23803a; }
.est-status--declined,
.est-status--void { background: #fdecec; color: #a12a2a; }

.est-pages {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 20px 0 0;
}

/* ------------------------------ редактор ------------------------------ */

.est-editor__fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.est-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.est-card {
  margin: 0 0 20px;
  padding: 20px;
  border: 1px solid rgba(174, 174, 174, 0.5);
  border-radius: 10px;
  background: #fff;
}

.est-grid > .est-card {
  margin-bottom: 0;
}

.est-grid + .est-card,
.est-card + .est-grid {
  margin-top: 20px;
}

.est-card__title {
  margin: 0 0 14px;
  font-size: 18px;
  line-height: 26px;
}

.est-card__title--sub {
  margin-top: 18px;
}

.est-logo {
  display: block;
  max-width: 140px;
  height: auto;
  margin: 0 0 12px;
  border-radius: 6px;
}

.est-logo[hidden] {
  display: none;
}

/* позиции: на большом экране - строкой, на телефоне - карточкой */
.est-lines {
  margin: 0 0 14px;
  padding: 0;
  list-style: none;
}

.est-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-line:first-child {
  border-top: 0;
  padding-top: 0;
}

.est-line__nums {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.est-line__field {
  width: 90px;
}

.est-line__field:nth-child(2) {
  width: 110px;
}

.est-line__taxable {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 40px;
  font-size: 13px;
  color: #6b6d70;
  white-space: nowrap;
  cursor: pointer;
}

.est-line__amount {
  min-width: 90px;
  height: 40px;
  font-weight: 700;
  line-height: 40px;
  text-align: right;
  white-space: nowrap;
}

.est-line__tools {
  display: flex;
  gap: 4px;
  padding-top: 26px;
}

/* подписи полей позиции - только у первой из подряд идущих позиций на большом экране
   (после заголовка раздела - снова с подписями) */
.est-line--item + .est-line--item .est-line__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.est-line--item + .est-line--item .est-line__tools {
  padding-top: 4px;
}

/* заголовок раздела: одно поле во всю ширину, жирным, кнопки сразу справа */
.est-line--section {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.est-line--section .est-line__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.est-line__section {
  border-color: transparent;
  background: #f3f9fc;
  font-weight: 700;
}

.est-line--section .est-line__tools {
  padding-top: 0;
}

/* описание к позиции - под названием, мельче */
.est-line__details {
  margin-top: 6px;
  color: #50575e;
  font-size: 14px;
  line-height: 20px;
}

.est-lines__add {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* панель «Отправка»: PDF, ссылка для клиента, статус, «в инвойс» */
.est-send__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.est-send__row form {
  margin: 0;
}

.est-send__title {
  margin: 18px 0 8px;
  font-size: 15px;
  line-height: 22px;
}

.est-send__link {
  display: flex;
  gap: 10px;
  margin: 0 0 10px;
}

.est-send__link .est-input {
  flex: 1;
  min-width: 0;
  color: #50575e;
}

.est-send__from {
  font-size: 14px;
  color: #3ebce6;
}

.est-send__row--status {
  justify-content: space-between;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-send__status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.est-send__status .est-label {
  margin: 0;
}

.est-send__status .est-input {
  width: auto;
}

.est-btn[hidden] {
  display: none;
}

/* итог */
.est-totals__list {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 16px;
  margin: 0;
  font-size: 15px;
}

.est-totals__list dt {
  color: #6b6d70;
}

.est-totals__list dd {
  margin: 0;
  text-align: right;
  white-space: nowrap;
}

.est-totals__list .est-totals__total {
  padding-top: 10px;
  border-top: 1px solid rgba(174, 174, 174, 0.5);
  color: #2d2e30;
  font-size: 20px;
  font-weight: 700;
}

.est-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 24px 0 0;
}

.est-actions .est-btn--danger {
  margin-left: auto;
}

@media (max-width: 900px) {
  .est-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 767px) {
  .est__wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }

  .est-card {
    padding: 16px 14px;
  }

  .est-line {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .est-line__nums {
    flex-wrap: wrap;
  }

  .est-line__field,
  .est-line__field:nth-child(2) {
    flex: 1 1 90px;
    width: auto;
  }

  .est-line__amount {
    flex: 1 0 100%;
    height: auto;
    line-height: 22px;
  }

  .est-line__tools {
    justify-content: flex-end;
    padding-top: 0;
  }

  .est-line--item + .est-line--item .est-line__label {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
  }

  .est-line--item + .est-line--item .est-line__tools {
    padding-top: 0;
  }

  .est-line--section {
    grid-template-columns: minmax(0, 1fr);
  }

  .est-list__link {
    padding: 12px 14px;
  }
}

/* ------------------------------ лендинг /tools/invoice ------------------------------ */

.est-message[hidden] {
  display: none;
}

.est-hero {
  margin: 0 0 28px;
}

.est-hero__lead {
  max-width: 760px;
  margin: 0 0 14px;
  font-size: 18px;
  line-height: 28px;
}

.est-hero__points {
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  columns: 2 320px;
  column-gap: 32px;
}

.est-hero__points li {
  position: relative;
  margin: 0 0 8px;
  padding-left: 26px;
  break-inside: avoid;
  font-size: 15px;
  line-height: 22px;
}

.est-hero__points li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #3ebce6;
  font-weight: 700;
}

.est-quick__lead {
  margin: -8px 0 16px;
}

.est-card__title--small {
  margin: 4px 0 12px;
  font-size: 16px;
}

.est-quick__bottom {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-quick .est-actions {
  margin-top: 16px;
}

.est-quick__save a {
  color: #3ebce6;
}

/* ------------------------------ настройки и способы оплаты (этап 4) ------------------------------ */

.est-new__settings {
  margin-left: auto;
}

.est-settings__hint {
  margin: -6px 0 14px;
}

.est-settings__inline {
  margin: 10px 0 0;
}

.est-file {
  max-width: 100%;
  font-size: 14px;
}

.est-check--block {
  display: flex;
  margin: 0 0 6px;
}

.est-hint-inline {
  color: #8a8c8f;
  font-size: 13px;
}

.est-pay-list {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.est-pay-list__item {
  padding: 10px 0;
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-pay-list__item:first-child {
  border-top: 0;
  padding-top: 0;
}

.est-pay-list__form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.est-pay-list__type {
  flex: 0 0 90px;
  font-weight: 700;
}

.est-pay-list__form .est-input {
  flex: 1 1 180px;
  width: auto;
}

/* кнопки способа - одной группой: помещаются - в строку, нет - под полем целиком */
.est-pay-list__tools {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
}

.est-pay-list__url {
  display: block;
  margin: 4px 0 0 98px;
  overflow: hidden;
  color: #3ebce6;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.est-pay-add__type {
  flex: 0 0 170px !important;
}

/* ---------- команда (этап 4.5) ---------- */
.est-new__settings {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.est-company {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
}

.est-company__label {
  margin: 0;
}

.est-company__select {
  width: auto;
  max-width: 100%;
  min-width: 220px;
}

.est-list__author {
  overflow: hidden;
  color: #8a8c8f;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.est-invites__item + .est-invites__item {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-invites__text {
  margin: 0 0 10px;
}

.est-team {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.est-team__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  padding: 12px 0;
  border-top: 1px solid rgba(174, 174, 174, 0.35);
}

.est-team__item:first-child {
  border-top: 0;
  padding-top: 0;
}

.est-team__who {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  min-width: 0;
}

.est-team__name {
  overflow-wrap: anywhere;
}

.est-team__tag {
  padding: 1px 8px;
  border-radius: 10px;
  background: #eef8fc;
  color: #2a8fb3;
  font-size: 12px;
}

.est-team__tag--warn {
  background: #fff4e0;
  color: #a86b00;
}

.est-team__email {
  flex-basis: 100%;
  color: #8a8c8f;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.est-team__rights {
  color: #6b6d70;
  font-size: 14px;
}

.est-team__form,
.est-team__checks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 14px;
}

.est-team__form .est-check,
.est-team__checks .est-check {
  margin: 0;
}

.est-team__checks {
  margin: 0 0 16px;
}

.est-team__tools {
  display: flex;
  gap: 6px;
}

.est-team__input {
  flex: 1 1 200px;
  width: auto;
}

.est__wrapper--narrow {
  max-width: 740px;
}

.est-invite__text {
  margin: 0 0 8px;
  font-size: 17px;
}

.est-invite .est-message {
  margin-top: 16px;
}

.est-history {
  margin-top: 20px;
}

.est-history__title {
  margin: 0;
  cursor: pointer;
}

.est-history__list {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
}

.est-history__item {
  padding: 4px 0;
}

.est-history__date {
  display: inline-block;
  min-width: 130px;
  color: #8a8c8f;
}

@media (max-width: 767px) {
  .est-new__settings {
    margin-left: 0;
  }

  .est-pay-list__url {
    margin-left: 0;
  }
}
