.cms-edit-mode [data-cms-editable="text"] {
  cursor: text;
  outline: 2px dashed rgba(216, 60, 64, 0.55);
  outline-offset: 4px;
  border-radius: 2px;
}

.cms-edit-mode [data-cms-editable="text"]:focus {
  outline: 3px solid #d83c40;
  background: rgba(255, 255, 255, 0.96);
  color: #071d3a;
}

.cms-edit-mode [data-cms-editable="image"] {
  cursor: pointer;
  outline: 3px dashed #d83c40;
  outline-offset: 3px;
}

.cms-edit-mode [data-cms-editable="image"]:hover {
  filter: brightness(0.78);
}

.cms-edit-mode .hero-media {
  cursor: pointer;
}

.cms-edit-mode .hero-media::before {
  content: "Headerbild bearbeiten";
  position: absolute;
  top: 110px;
  right: 34px;
  z-index: 3;
  padding: 12px 16px;
  border: 2px solid white;
  border-radius: 8px;
  background: rgba(7, 29, 58, .9);
  color: white;
  font: 800 13px/1.2 Arial, sans-serif;
  box-shadow: 0 8px 24px rgba(7, 29, 58, .25);
  pointer-events: none;
}

.cms-managed-placeholder {
  position: relative;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.cms-managed-placeholder > * { visibility: hidden; }

.cms-edit-mode .cms-managed-placeholder::after {
  content: "Bild hochladen";
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  padding: 10px 14px;
  border-radius: 7px;
  background: rgba(7, 29, 58, .88);
  color: white;
  font: 700 13px/1.2 Arial, sans-serif;
  white-space: nowrap;
}
