/* ═══════════════════════════════════════════════════════════════════════════
   Form-Builder (Block F.2) — Admin-Editor + Share-Link-Modal
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Form-Builder-Felder (Editor) ─── */
.form-field-row{
  display:grid;grid-template-columns:130px 1fr auto;gap:10px;align-items:flex-start;
  padding:10px 12px;background:var(--s2);border:1px solid var(--b1);border-radius:9px;
  margin-bottom:6px;
}
.form-field-type{
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;
  color:var(--t3);padding:4px 0;
}
.form-field-body{display:flex;flex-direction:column;gap:6px}
.form-field-body input,.form-field-body textarea{font-size:12.5px;padding:6px 9px;min-height:30px}
.form-field-body textarea{min-height:54px}
.form-field-actions{display:flex;flex-direction:column;gap:4px}

/* ─── Share-Link-Modal (Formular-Link teilen) ─── */
.share-link-wrap{
  position:relative;display:flex;align-items:center;
  background:var(--s2);border:1px solid var(--b2);border-radius:10px;
  overflow:hidden;transition:all .18s;
}
.share-link-wrap:focus-within{border-color:var(--np);box-shadow:0 0 0 3px rgba(200,149,90,.12)}
.share-link-wrap input{
  flex:1;border:none!important;background:transparent!important;
  box-shadow:none!important;padding:12px 14px!important;
  color:var(--t1);font-family:'SF Mono',Menlo,Consolas,monospace;
  min-height:44px;
}
.share-link-wrap input:focus{box-shadow:none!important;background:transparent!important}
.share-link-copy{
  flex-shrink:0;padding:10px 18px;
  background:linear-gradient(135deg,var(--np),var(--na));
  border:none;color:#fff;font-family:var(--font);font-size:12.5px;
  font-weight:700;cursor:pointer;transition:all .18s;
  min-height:44px;white-space:nowrap;
}
.share-link-copy:hover{filter:brightness(1.08)}
.share-link-copy.copied{background:var(--ng);pointer-events:none}

.share-link-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;
}
.share-btn{
  display:flex;align-items:center;gap:10px;
  padding:14px 16px;
  border:1.5px solid var(--b2);border-radius:12px;
  background:var(--s1);color:var(--t1);
  font-family:var(--font);font-size:13.5px;font-weight:700;
  text-decoration:none;cursor:pointer;transition:all .18s;
}
.share-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 14px rgba(14,27,77,.08);
}
.share-btn svg{flex-shrink:0}
.share-btn span{flex:1}

.share-btn.share-wa{
  background:linear-gradient(135deg,#25D366,#128C7E);
  color:#fff;border-color:#128C7E;
  box-shadow:0 3px 10px rgba(37,211,102,.28);
}
.share-btn.share-wa:hover{box-shadow:0 6px 18px rgba(37,211,102,.42)}

.share-btn.share-email{
  background:linear-gradient(135deg,#3b9eff,#2474dc);
  color:#fff;border-color:#2474dc;
  box-shadow:0 3px 10px rgba(59,158,255,.28);
}
.share-btn.share-email:hover{box-shadow:0 6px 18px rgba(59,158,255,.42)}

.share-btn.share-open{
  background:var(--s2);color:var(--t2);
}
.share-btn.share-open:hover{
  background:var(--s3);color:var(--t1);border-color:var(--np);
}

.share-btn.share-qr{
  background:var(--s2);color:var(--t2);
}
.share-btn.share-qr:hover{
  background:var(--s3);color:var(--t1);border-color:var(--np);
}

#share-qr-box svg{max-width:220px;height:auto;display:inline-block}

/* ─── Dialog-Head verbessern (dlg-close) ─── */
.dlg-bg .dlg-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 22px;border-bottom:1px solid var(--b1);
}
.dlg-bg .dlg-title{
  font-size:16px;font-weight:800;color:var(--t1);letter-spacing:-.2px;
}
.dlg-bg .dlg-close{
  width:32px;height:32px;border-radius:8px;
  background:var(--s2);border:1px solid var(--b1);
  color:var(--t2);font-size:17px;line-height:1;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-family:var(--font);padding:0;transition:all .15s;
}
.dlg-bg .dlg-close:hover{background:var(--s3);color:var(--t1);border-color:var(--b2)}
.dlg-bg .dlg-body{padding:18px 22px}
.dlg-bg .dlg-foot{
  display:flex;gap:8px;justify-content:flex-end;
  padding:14px 22px;border-top:1px solid var(--b1);background:var(--s2);
}

@media (max-width:620px){
  .form-field-row{grid-template-columns:1fr auto}
  .form-field-type{grid-column:1/-1}
  .share-link-grid{grid-template-columns:1fr}
  .share-link-wrap input{font-size:11px!important}
}