/* The rhizome's edit mode (js/rhizome-edit.js): the Rhizome Editor window,
   and what edit mode shows on the pages themselves. Owner-only, local-only.
   The window is plain XP: Tahoma 11px, a tab strip, Explorer-style details
   tables. */

/* ---------- on the pages ---------- */

body.rz-editing .rz[contenteditable="true"] { outline: none; caret-color: #316ac5; }
body.rz-editing .rz :is(p, blockquote, li, .rz-term, figure):hover { background: #fffbe6; }
body.rz-editing .rz [data-to] { outline: 1px dotted var(--rz-owner, #4b2a7b); outline-offset: 1px; }
body.rz-editing .rz .rz-inspected { background: #dfe9fb; outline: 2px solid #316ac5; outline-offset: 1px; }
body.rz-editing .rz-meta .rze-chip { color: #0000ee; text-decoration: underline; cursor: pointer; }

/* ---------- the window ---------- */

.rze {
  display: flex;
  flex-direction: column;
  height: 100%;
  font: 11px Tahoma, sans-serif;
  background: #ece9d8;
  color: #000;
}
.rze button { font: 11px Tahoma, sans-serif; }
.rze input, .rze select, .rze textarea { font: 11px Tahoma, sans-serif; }
.rze input[type="number"] { width: 52px; }
.rze textarea { width: 96%; }

.rze-bar { display: flex; gap: 6px; align-items: center; padding: 5px 6px; border-bottom: 1px solid #aca899; }
.rze-status { margin-left: auto; color: #7a4b00; }

.rze-tabs { display: flex; gap: 2px; padding: 6px 6px 0; }
.rze-tabs button {
  border: 1px solid #919b9c;
  border-bottom: 0;
  background: linear-gradient(#fff, #ecebe5);
  padding: 3px 10px;
  border-radius: 3px 3px 0 0;
}
.rze-tabs button.on { background: #fff; border-top: 2px solid #ffc83c; position: relative; top: 1px; }

.rze-panel {
  flex: 1;
  overflow: auto;
  margin: 0 6px 6px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid #919b9c;
}
.rze-panel h3 { font-size: 13px; margin: 0 0 6px; }
.rze-panel h4 { font-size: 11px; margin: 12px 0 4px; }
.rze-id { color: #666; font-size: 10px; }
.rze-lede { margin: 8px 0 4px; font-weight: bold; }
.rze-note { color: #555; }
.rze-empty { color: #555; margin: 20px 4px; }
.rze-warn { color: #a00; }
.rze-row { margin: 8px 0; }
.rze-quote { margin: 0 0 8px 12px; color: #333; font: 12px/1.35 "Times New Roman", serif; }
.rze-faces { margin: 0 0 6px; padding-left: 18px; }
.rze fieldset { margin: 0 0 10px; border: 1px solid #d0d0bf; }
.rze fieldset label { display: inline-block; margin: 2px 10px 2px 0; }

.rze-table { border-collapse: collapse; width: 100%; }
.rze-table th {
  text-align: left;
  font-weight: normal;
  background: linear-gradient(#fff, #ebeadb);
  border: 1px solid #d0d0bf;
  padding: 2px 5px;
}
.rze-table td { border-bottom: 1px solid #efefe8; padding: 2px 5px; vertical-align: top; }
.rze-table tr.off td { color: #999; }
.rze-click tr[data-show], .rze-click tr[data-open-doc] { cursor: pointer; }
.rze-click tr[data-show]:hover td, .rze-click tr[data-open-doc]:hover td { background: #316ac5; color: #fff; }
.rze-why { color: #555; max-width: 260px; }

.rze-bar-cell { position: relative; width: 90px; white-space: nowrap; }
.rze-barfill { display: inline-block; height: 8px; margin-right: 4px; background: linear-gradient(#8fb4ec, #316ac5); vertical-align: middle; max-width: 60px; }