/* KDS Upload – nutzt Theme-Tokens (mit Fallbacks). */
.rmup{
  --_ink: var(--ink, #111);
  --_line: var(--line, #e5e2dc);
  --_tint: var(--tint, #f5f3f0);
  --_muted: var(--muted, #8a857d);
  --_bg: var(--bg, #fff);
  --_disp: var(--font-display, Georgia, serif);
  max-width: 640px; margin-inline: auto;
}

.rmup--gate{ text-align: center; padding: clamp(24px,6vh,60px) 0; }
.rmup--gate p{ color: var(--_muted); margin: 0 0 20px; }

/* Tabs */
.rmup__tabs{ display: flex; gap: 4px; border-bottom: 1px solid var(--_line); margin-bottom: 28px; }
.rmup__tab{
  appearance: none; background: none; border: 0; cursor: pointer; font: inherit;
  padding: 12px 4px; margin-right: 22px; color: var(--_muted);
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .18s ease, border-color .18s ease;
}
.rmup__tab:hover{ color: var(--_ink); }
.rmup__tab.is-active{ color: var(--_ink); border-bottom-color: var(--_ink); }

/* Felder */
.rmup__label{ display: block; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; color: var(--_muted); margin: 0 0 16px; }
.rmup__input{
  display: block; width: 100%; box-sizing: border-box; margin-top: 7px;
  background: var(--_bg); border: 1px solid var(--_line); color: var(--_ink);
  padding: 12px 13px; font: inherit; font-size: 1rem; transition: border-color .18s ease;
}
.rmup__input:focus{ outline: none; border-color: var(--_ink); }
textarea.rmup__input{ resize: vertical; }
.rmup__row{ display: grid; grid-template-columns: 1.4fr 1fr .8fr; gap: 14px; }
@media (max-width: 560px){ .rmup__row{ grid-template-columns: 1fr; } }

.rmup__check{ display: flex; gap: 10px; align-items: flex-start; font-size: .95rem; color: var(--_ink); line-height: 1.5; margin: 2px 0 8px; }
.rmup__check input{ margin-top: 3px; }
.rmup__hint{ color: var(--_muted); font-size: .95rem; line-height: 1.55; margin: 0 0 6px; }
.rmup__hint code{ background: var(--_tint); padding: 1px 6px; font-size: .85em; }

/* Datei-Bereich */
.rmup__drop{ border: 1px dashed var(--_line); background: var(--_tint); padding: 22px; margin: 20px 0 8px; transition: border-color .18s ease; }
.rmup__drop.is-hover{ border-color: var(--_ink); }
.rmup__label--file{ margin: 0; }
.rmup__file{ display: block; width: 100%; margin-top: 8px; font: inherit; color: var(--_ink); }
.rmup__files{ margin: 12px 0 0; font-size: .88rem; color: var(--_muted); }

/* Buttons */
.rmup__btn, .rmup__submit{
  appearance: none; cursor: pointer; display: inline-block; font: inherit; font-size: .98rem; letter-spacing: .02em;
  background: var(--_ink); color: #fff; border: 1px solid var(--_ink); padding: 14px 30px; margin-top: 22px;
  text-decoration: none; transition: opacity .18s ease;
}
.rmup__btn:hover, .rmup__submit:hover{ opacity: .85; }
.rmup__submit[disabled]{ opacity: .5; cursor: progress; }
.rmup__note{ font-size: .82rem; color: var(--_muted); margin: 12px 0 0; }

/* Meldungen */
.rmup__notice{ padding: 13px 16px; margin-bottom: 22px; font-size: .95rem; border: 1px solid var(--_line); }
.rmup__notice--ok{ border-color: #1e7d46; color: #1e7d46; background: rgba(30,125,70,.06); }
.rmup__notice--err{ border-color: #b3261e; color: #b3261e; background: rgba(179,38,30,.06); }

/* Impressionen-Galerie (Anzeige) */
.rmup-gallery{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
@media (max-width: 700px){ .rmup-gallery{ grid-template-columns: repeat(2, 1fr); } }
.rmup-gallery__item{ margin: 0; overflow: hidden; background: var(--tint,#f5f3f0); aspect-ratio: 1/1; }
.rmup-gallery__img{ width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.rmup-gallery__item:hover .rmup-gallery__img{ transform: scale(1.04); }

/* ---- KI-Textassistent ---- */
.rmup__ai{ background:var(--_tint); border:1px solid var(--_line); padding:18px 18px 14px; margin:0 0 18px; }
.rmup__label--ai{ margin-bottom:12px; }
.rmup__ai-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.rmup__ai-btn{
  appearance:none; cursor:pointer; font:inherit; font-size:.92rem; letter-spacing:.02em;
  background:var(--_bg); color:var(--_ink); border:1px solid var(--_ink);
  padding:10px 20px; transition:background .18s ease, color .18s ease, opacity .18s ease;
}
.rmup__ai-btn:hover{ background:var(--_ink); color:#fff; }
.rmup__ai-btn[disabled]{ opacity:.55; cursor:progress; }
.rmup__ai-status{ font-size:.86rem; color:var(--_muted); }
.rmup__ai-hint{ margin:12px 0 0; font-size:.82rem; line-height:1.55; color:var(--_muted); }

/* ---- Überarbeitung: Checkbox, Datei-Bereich, Rhythmus ---- */
.rmup__form{ margin-top:4px; }

/* Checkbox sauber ausgerichtet, Text direkt daneben */
.rmup__check{
  display:grid; grid-template-columns:20px 1fr; align-items:start; gap:12px;
  margin:6px 0 4px; font-size:.95rem; color:var(--_ink); line-height:1.5;
  text-transform:none; letter-spacing:0;
}
.rmup__check input{ width:18px; height:18px; margin:2px 0 0; accent-color:var(--_ink); }
.rmup__check span{ display:block; }

/* Datei-Bereich: eigener Knopf statt rohem Browser-Element */
.rmup__drop{ text-align:center; padding:30px 22px; }
.rmup__droptitle{
  margin:0 0 16px; font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; color:var(--_muted);
}
.rmup__file{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.rmup__filebtn{
  display:inline-block; cursor:pointer; font-size:.95rem; letter-spacing:.02em;
  background:var(--_bg); color:var(--_ink); border:1px solid var(--_ink);
  padding:12px 24px; transition:background .18s ease, color .18s ease;
}
.rmup__filebtn:hover{ background:var(--_ink); color:#fff; }
.rmup__file:focus-visible + .rmup__filebtn{ outline:2px solid var(--_ink); outline-offset:3px; }
.rmup__dropnote{ margin:14px 0 0; font-size:.85rem; color:var(--_muted); }
.rmup__files{ margin:10px 0 0; font-size:.88rem; color:var(--_muted); }

/* Absende-Knopf mittig unter dem Formular, mit Luft */
.rmup__submit{ display:block; width:100%; margin-top:26px; padding:16px 30px; }
.rmup__note{ text-align:center; }

/* Tabs etwas ruhiger */
.rmup__tabs{ margin-bottom:32px; }

/* Gegen `input{width:100%}` aus dem Eltern-Theme (Bricks) absichern. */
.rmup__check input[type="checkbox"]{ width:18px !important; min-width:0; }

/* ---- Weitere Angaben (aufklappbar) + Leistungsphasen ---- */
.rmup__more{ border:1px solid var(--_line); margin:8px 0 6px; }
.rmup__more>summary{ cursor:pointer; padding:14px 16px; font-size:.82rem; letter-spacing:.04em; text-transform:uppercase; color:var(--_muted); list-style:none; user-select:none; }
.rmup__more>summary::-webkit-details-marker{ display:none; }
.rmup__more>summary::after{ content:"+"; float:right; font-size:1.1rem; line-height:1; }
.rmup__more[open]>summary::after{ content:"–"; }
.rmup__more-grid{ padding:6px 16px 18px; }
.rmup__note-priv{ font-size:.78rem; color:var(--_muted); margin:-6px 0 14px; }
.rmup__lp{ border:0; padding:0; margin:6px 0 0; min-width:0; }
.rmup__lp legend{ font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; color:var(--_muted); padding:0; margin:0 0 10px; }
.rmup__lp-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px 20px; }
@media(max-width:560px){ .rmup__lp-grid{ grid-template-columns:1fr; } }
.rmup__lp-item{ display:flex; align-items:flex-start; gap:9px; font-size:.9rem; color:var(--_ink); line-height:1.4; text-transform:none; letter-spacing:0; margin:0; }
.rmup__lp-item input[type=checkbox]{ width:16px !important; height:16px; min-width:0; margin:2px 0 0; flex:0 0 auto; accent-color:var(--_ink); }

/* ---- Bearbeiten: Projektauswahl + vorhandene Bilder ---- */
.rmup__switch{ margin:0 0 24px; padding:0 0 20px; border-bottom:1px solid var(--_line); }
.rmup__pick{ cursor:pointer; }
.rmup__newlink{ display:inline-block; margin-top:12px; font-size:.88rem; color:var(--_ink); border-bottom:1px solid var(--_line); text-decoration:none; }
.rmup__newlink:hover{ border-bottom-color:var(--_ink); }
.rmup__editing{ font-family:var(--_disp); font-weight:400; font-size:1.5rem; margin:0 0 20px; }
.rmup__gallery-edit{ margin:20px 0 8px; }
.rmup__thumbs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:12px; margin:12px 0; }
.rmup__thumb{ display:block; cursor:pointer; margin:0; }
.rmup__thumb img{ width:100%; height:88px; object-fit:cover; display:block; border:1px solid var(--_line); }
.rmup__thumb-rm{ display:flex; align-items:center; gap:5px; font-size:.72rem; color:var(--_muted); margin-top:5px; text-transform:none; letter-spacing:0; }
.rmup__thumb-rm input[type=checkbox]{ width:14px !important; height:14px; min-width:0; margin:0; accent-color:var(--_ink); }
.rmup__thumb:has(input:checked) img{ opacity:.35; outline:2px solid #b3261e; outline-offset:-2px; }

/* ---- Bilder sortieren (Drag & Drop) ---- */
.rmup__thumbs[data-sortable] .rmup__thumb{ cursor:grab; position:relative; }
.rmup__thumbs[data-sortable] .rmup__thumb:active{ cursor:grabbing; }
.rmup__thumb.is-dragging{ opacity:.4; }
.rmup__thumbs[data-sortable] .rmup__thumb::before{
  content:"⠿"; position:absolute; top:4px; left:4px; z-index:1;
  color:#fff; font-size:14px; line-height:1; text-shadow:0 1px 2px rgba(0,0,0,.6);
  opacity:.85; pointer-events:none;
}

/* Beim Sortieren nicht das Bild selbst ziehen, sondern die Kachel. */
.rmup__thumbs[data-sortable] .rmup__thumb img{ -webkit-user-drag:none; user-select:none; pointer-events:none; }