/* ============================================================
   CMS 2.0 · плавающая панель + режим редактирования
   ============================================================ */

.cms-toolbar {
  position: fixed;
  bottom: 22px;
  right: 22px;
  display: flex;
  gap: 8px;
  padding: 8px;
  background: rgba(16, 19, 26, 0.92);
  border: 1px solid rgba(255, 215, 0, 0.35);
  border-radius: 14px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
  z-index: 99999;
  backdrop-filter: blur(10px);
  font-family: -apple-system, system-ui, 'Segoe UI', Roboto, sans-serif;
}

.cms-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 9px 14px;
  background: #1c1f29;
  color: #f5e7a0;
  border: 1px solid rgba(255, 215, 0, 0.25);
  border-radius: 9px;
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, border-color .15s, transform .1s;
  white-space: nowrap;
}
.cms-btn:hover { background: rgba(255, 215, 0, 0.12); border-color: #ffd700; color: #ffd700; }
.cms-btn:active { transform: translateY(1px); }

.cms-btn.cms-save {
  background: linear-gradient(135deg, #b8860b, #ffd700);
  color: #10131a;
  border-color: #ffd700;
}
.cms-btn.cms-save:hover { filter: brightness(1.05); }

.cms-btn.cms-cancel {
  background: #2a2d38;
  color: #ffb4b4;
  border-color: rgba(255, 107, 107, 0.3);
}

.cms-btn.cms-panel {
  background: #10131a;
  color: #8fc8ff;
  border-color: rgba(140, 200, 255, 0.3);
}
.cms-btn.cms-panel:hover { color: #b6dcff; border-color: #8fc8ff; }

/* ---------------- поля в режиме редактирования ---------------- */
body.cms-editing .cms-field {
  outline: 1px dashed rgba(255, 215, 0, 0.45);
  outline-offset: 4px;
  border-radius: 4px;
  transition: outline-color .15s, background .15s;
}
body.cms-editing .cms-field:hover {
  outline-color: #ffd700;
  background: rgba(255, 215, 0, 0.05);
}
body.cms-editing .cms-field:focus {
  outline: 2px solid #ffd700;
  background: rgba(255, 215, 0, 0.08);
  box-shadow: 0 0 0 4px rgba(255, 215, 0, 0.15);
}

/* чтобы каретка была видна поверх тёмных фонов */
body.cms-editing .cms-field { caret-color: #ffd700; }

/* ---------------- тост ---------------- */
.cms-toast {
  position: fixed;
  bottom: 90px;
  right: 22px;
  padding: 10px 16px;
  background: rgba(16, 19, 26, 0.95);
  color: #ffd700;
  border: 1px solid rgba(255, 215, 0, 0.35);
  border-radius: 10px;
  font-size: 0.88rem;
  font-family: -apple-system, system-ui, 'Segoe UI', Roboto, sans-serif;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .2s, transform .2s;
  z-index: 99999;
  pointer-events: none;
}
.cms-toast.show { opacity: 1; transform: translateY(0); }
.cms-toast.ok  { border-color: rgba(107, 211, 154, 0.5); color: #6bd39a; }
.cms-toast.err { border-color: rgba(255, 107, 107, 0.5); color: #ff8a8a; }

/* на мобильных — панель снизу в центре */
@media (max-width: 640px) {
  .cms-toolbar {
    right: 50%;
    transform: translateX(50%);
    bottom: 12px;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 95vw;
  }
  .cms-btn { padding: 8px 10px; font-size: 0.78rem; }
}
