/* Additions for persistence + uploads. Deliberately reuses the page's existing
   variables and type scale — this file adds controls, it does not restyle the form. */

/* save indicator, sits in the top bar next to the draft/locked status */
.savestate{font-family:var(--mono);font-size:10px;letter-spacing:1.2px;text-transform:uppercase;
  border-radius:6px;padding:4px 9px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;}
/* before the first edit there is no submission — the chip shows nothing at all */
.savestate.is-idle{display:none;}
.savestate.is-pending{background:var(--panel);color:var(--muted);}
.savestate.is-saving{background:var(--blue-l);color:var(--blue);}
.savestate.is-saved{background:var(--green-l);color:var(--green);}
.savestate.is-locked{background:var(--green-l);color:var(--green);}
.savestate.is-failed{background:var(--warn-l);color:var(--warn);border:1px solid #e3bfb6;
  white-space:normal;letter-spacing:.6px;}
.save-retry{font-family:var(--mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;
  background:var(--warn);color:#fff;border:none;border-radius:5px;padding:3px 8px;cursor:pointer;}
@media(max-width:640px){.top .in2{flex-wrap:wrap;}.savestate{font-size:9px;}}

/* concurrent-edit warning. Full width, top of the page, impossible to miss —
   it only appears when autosaving has already stopped. */
.conflict{background:var(--warn-l);color:var(--warn);border-bottom:2px solid var(--warn);
  padding:12px 18px;line-height:1.45;}
.conflict strong{display:block;font-size:14px;margin-bottom:4px;}
.conflict p{margin:0 0 8px;font-size:13px;}
.conflict-btn{font-family:var(--mono);font-size:10px;letter-spacing:1px;text-transform:uppercase;
  background:var(--warn);color:#fff;border:none;border-radius:5px;padding:5px 10px;cursor:pointer;}

/* upload control, sits under the matching link field */
.up{margin-top:7px;}
.up-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;
  letter-spacing:1px;text-transform:uppercase;color:var(--green);background:var(--green-l);
  border:1px solid #bfe0cd;border-radius:7px;padding:6px 11px;cursor:pointer;font-weight:700;}
.up-btn:hover{filter:brightness(.98);}
.up-btn input[type=file]{display:none;}
.locked-mode .up-btn{display:none;}

.up-msg{font-size:11.5px;color:var(--muted);margin-top:5px;}
.up-msg.is-bad{color:var(--warn);}

.up-list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;}
.up-list li{display:flex;align-items:baseline;gap:8px;font-size:12.5px;color:var(--ink);
  background:var(--panel);border:1px solid var(--line2);border-radius:7px;padding:5px 9px;}
.up-list .up-name{overflow-wrap:anywhere;}
.up-list .up-size{font-family:var(--mono);font-size:10.5px;color:var(--muted);margin-left:auto;flex:none;}
.up-list .up-none{color:var(--muted);background:none;border:1px dashed var(--line);font-style:italic;}

@media print{.savestate,.up-btn,.up-msg{display:none!important;}}