/* ==========================================================================
   Save flow — панель проекта + модалка сохранения / перезаписи / конфликта
   Kashtan Design System
   ========================================================================== */

/* ── Панель контекста проекта (под шапкой редактора) ── */
.project-bar {
  background: var(--k-white);
  border-bottom: 1px solid var(--k-gray-ed);
  padding: 10px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.project-bar__left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.project-bar__back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 12px;
  background: transparent;
  border: 1px solid var(--k-gray-da);
  border-radius: var(--k-radius);
  color: var(--k-gray-60);
  font-family: var(--k-font);
  font-size: 12px;
  font-weight: var(--k-fw-medium);
  text-transform: uppercase;
  letter-spacing: var(--k-ls-label);
  cursor: pointer;
  transition: all var(--k-dur-micro) var(--k-ease);
}
.project-bar__back:hover { background: var(--k-green-light); border-color: var(--k-green); color: var(--k-green-dark); }

.project-bar__divider { width: 1px; height: 22px; background: var(--k-gray-ed); }
.project-bar__file { display: flex; color: var(--k-green); flex-shrink: 0; }
.project-bar__name {
  font-size: 15px;
  font-weight: var(--k-fw-bold);
  color: var(--k-gray-20);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 42vw;
}

/* Статус сохранённости */
.pbar-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--k-gray-60);
  white-space: nowrap;
}
.pbar-status__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--k-gray-da); }
.pbar-status.is-saved { color: var(--k-green); }
.pbar-status.is-saved .pbar-status__dot { background: var(--k-green); }
.pbar-status.is-dirty { color: var(--k-orange); }
.pbar-status.is-dirty .pbar-status__dot { background: var(--k-orange); }
.pbar-status.is-draft { color: var(--k-gray-60); }

/* Кнопка «Заметки» в панели проекта */
.pbar-notes {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  background: var(--k-white);
  border: 1px solid var(--k-gray-da);
  border-radius: var(--k-radius);
  font-family: var(--k-font);
  font-size: 12px;
  font-weight: var(--k-fw-medium);
  color: var(--k-gray-60);
  cursor: pointer;
  transition: all var(--k-dur-micro) var(--k-ease);
}
.pbar-notes:hover { background: var(--k-green-light); border-color: var(--k-green); color: var(--k-green-dark); }
.pbar-notes.has-unread {
  border-color: var(--k-orange);
  color: #8a5a00;
  background: #FFF6E6;
}
.pbar-notes__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--k-orange);
  color: var(--k-white);
  font-size: 11px;
  font-weight: var(--k-fw-bold);
}

.project-bar__actions { display: flex; align-items: center; gap: 10px; }
.project-bar__actions .btn {
  height: 38px;
  padding: 0 16px;
  font-size: 12px;
}

@media (max-width: 720px) {
  .project-bar { padding: 10px 16px; }
  .project-bar__name { max-width: 50vw; }
  .pbar-status { display: none; }
  .project-bar__actions .btn { padding: 0 12px; }
}

/* ── Модалка сохранения ── */
.save-modal { max-width: 480px; }

.save-field { display: flex; flex-direction: column; gap: 7px; }
.save-field__label {
  font-size: 11px;
  font-weight: var(--k-fw-medium);
  text-transform: uppercase;
  letter-spacing: var(--k-ls-label);
  color: var(--k-gray-60);
  display: flex;
  align-items: center;
  gap: 8px;
}
.save-field__opt {
  text-transform: none;
  letter-spacing: 0;
  font-weight: var(--k-fw-regular);
  font-size: 11px;
  color: var(--k-gray-da);
}
.save-field__count {
  margin-left: auto;
  text-transform: none;
  letter-spacing: 0;
  font-weight: var(--k-fw-regular);
  font-size: 11px;
  color: var(--k-gray-da);
  font-variant-numeric: tabular-nums;
}
.save-field__count.is-limit {
  color: var(--k-red);
  font-weight: var(--k-fw-medium);
}
.save-note {
  width: 100%;
  padding: 11px 14px;
  font-family: var(--k-font);
  font-size: 15px;
  line-height: 1.5;
  color: var(--k-gray-20);
  background: var(--k-white);
  border: 1px solid var(--k-gray-da);
  border-radius: var(--k-radius);
  resize: vertical;
  min-height: 76px;
  transition: border-color var(--k-dur-micro) var(--k-ease);
}
.save-note::placeholder { color: var(--k-gray-da); }
.save-note:focus { outline: none; border-color: var(--k-green); }
.save-note:disabled { background: var(--k-gray-f6); color: var(--k-gray-60); }

/* Предупреждение о перезаписи */
.save-warn {
  display: flex;
  gap: 12px;
  padding: 14px 16px;
  margin-bottom: 18px;
  background: #FFF6E6;
  border: 1px solid #F2C94C;
  border-radius: var(--k-radius);
}
.save-warn__icon { flex-shrink: 0; color: #B07700; margin-top: 1px; }
.save-warn__text { font-size: 13.5px; line-height: 1.5; color: #6b4e00; margin: 0; }
.save-warn__text strong { font-weight: var(--k-fw-bold); }

/* Конфликт версий */
.save-conflict {
  display: flex;
  gap: 14px;
  padding: 16px;
  background: #FDECEC;
  border: 1px solid var(--k-red);
  border-radius: var(--k-radius);
}
.save-conflict__icon { flex-shrink: 0; color: var(--k-red); margin-top: 1px; }
.save-conflict__title {
  font-size: 15px;
  font-weight: var(--k-fw-bold);
  color: #B83A3A;
  margin-bottom: 6px;
}
.save-conflict__text { font-size: 13.5px; line-height: 1.55; color: #7a2e2e; margin: 0; }
.save-conflict__text strong { font-weight: var(--k-fw-bold); }

.save-modal__foot--conflict { justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.save-modal__foot-right { display: flex; gap: 8px; margin-left: auto; }
.save-force {
  background: none;
  border: none;
  padding: 4px 0;
  font-family: var(--k-font);
  font-size: 13px;
  color: var(--k-gray-60);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  transition: color var(--k-dur-micro) var(--k-ease);
}
.save-force:hover { color: var(--k-red); }

/* Спиннер «Сохраняем…» */
.save-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255, 255, 255, 0.45);
  border-top-color: var(--k-white);
  border-radius: 50%;
  animation: saveSpin 0.7s linear infinite;
}
@keyframes saveSpin { to { transform: rotate(360deg); } }
.btn--primary.is-busy { opacity: 1; }

/* ==========================================================================
   Mode banner — индикатор режима над рабочей областью
   ========================================================================== */
.mode-banner {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 16px;
  margin-bottom: 24px;
  border-radius: var(--k-radius);
  font-size: 13.5px;
  line-height: 1.45;
}
.mode-banner__ic { flex-shrink: 0; display: flex; margin-top: 1px; }
.mode-banner__text { color: var(--k-gray-20); text-wrap: pretty; }
.mode-banner__text strong { font-weight: var(--k-fw-bold); }

/* Открыт сохранённый проект — изменения для всех */
.mode-banner--shared {
  background: var(--k-green-light);
  border: 1px solid var(--k-green);
}
.mode-banner--shared .mode-banner__ic { color: var(--k-green-dark); }
.mode-banner--shared .mode-banner__text strong { color: var(--k-green-dark); }

/* Создание нового проекта — черновик */
.mode-banner--draft {
  background: var(--k-gray-f6);
  border: 1px dashed var(--k-gray-da);
}
.mode-banner--draft .mode-banner__ic { color: var(--k-gray-60); }

/* ==========================================================================
   ПРОВЕРКА КОПИИ — баннер «Сохранить как новый» (ReviewBanner)
   Янтарный по умолчанию (как warn-banner), красный при наложении логотипов.
   ========================================================================== */
.review-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  margin-bottom: 24px;
  border-radius: var(--k-radius);
  background: #FEF6E0;
  border: 1px solid #F2D98A;
  border-left: 4px solid var(--k-yellow);
  color: #6B5413;
  animation: errSlide 0.35s var(--k-ease);
}
.review-banner__icon { color: #C9961A; flex-shrink: 0; display: flex; }
.review-banner__body { flex: 1; min-width: 0; }
.review-banner__title {
  font-size: 13px;
  font-weight: var(--k-fw-bold);
  text-transform: uppercase;
  letter-spacing: var(--k-ls-section);
  color: #B5830F;
  margin-bottom: 3px;
}
.review-banner__text { font-size: 13.5px; line-height: 1.45; color: #6B5413; text-wrap: pretty; }
.review-banner__action { flex-shrink: 0; white-space: nowrap; }

.review-banner--conflict {
  background: color-mix(in srgb, var(--k-red) 7%, var(--k-white));
  border-color: var(--k-red);
  border-left-color: var(--k-red);
}
.review-banner--conflict .review-banner__icon,
.review-banner--conflict .review-banner__title { color: var(--k-red); }
.review-banner--conflict .review-banner__text { color: var(--k-gray-20); }

@media (max-width: 700px) {
  .review-banner { flex-wrap: wrap; }
  .review-banner__action { width: 100%; justify-content: center; }
}
