/* Inline-Bearbeiten fuer die Galerie (galerie-inline.js): die Werkzeuge, die im
   Bearbeiten-Modus ueber/unter den echten Kacheln erscheinen. Diese Optik gehoert zum
   WERKZEUG und bleibt neutral (schwarz/weiss/grau) - sie nutzt KEINE Kundenfarben, auch
   wenn die Galerie selbst die Kundenfarben traegt. Wirkt nur im Bearbeiten-Modus. */

/* Im Bearbeiten-Modus soll die Kachel nicht "zoomen" und nicht wie ein Vergroessern-Link
   wirken - das stoert beim Arbeiten. */
.gi-edit .galerie-thumb { cursor: default; }
.gi-edit:hover .galerie-thumb img { transform: none; }

/* Der Galerie-Editor benutzt exakt den vorhandenen Listen-/Slider-Bildeditor. Nur die
   kundenseitigen Galerie-Masse werden hier an dessen quadratischen Shop-Standard angepasst. */
.gi-edit .galerie-thumb.shop-slider {
  aspect-ratio: 4 / 3;
  margin-bottom: 0;
  border-radius: 0;
}
.gi-edit .li-bild-waehlen > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Titel/Text nutzt das gemeinsame Feld (.wz-feld aus editor-shell.css) - Rahmen, Fokus und
   Platzhalter kommen von dort. Hier nur die figcaption-Eigenheiten aufheben: keine
   Kursivschrift, linksbuendig (sonst zentriert .galerie-cap den Text im Feld). */
.gi-cap { font-style: normal; text-align: left; }

/* "+ Kachel hinzufuegen" - gestrichelte leere Kachel im selben Raster */
.gi-add-flaeche {
  width: 100%;
  aspect-ratio: 4 / 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  background: transparent;
  border: 2px dashed #bbb;
  color: #777;
  cursor: pointer;
  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.gi-add-flaeche:hover { border-color: #111; color: #111; background: rgba(0, 0, 0, 0.02); }
.gi-add-plus { font-size: 2rem; line-height: 1; }
.gi-add-text { font-size: 0.85rem; }