/* "Embed or Share this Diagram" box under diagram images (wwa-diagram-share.php). */
.wwa-share-embed { margin: -.75rem 0 1.75rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #f8fafc; }
.wwa-share-embed summary { display: flex; align-items: center; gap: .5rem; min-height: 44px; padding: 0 14px; box-sizing: border-box;
  cursor: pointer; list-style: none; font-size: .85rem; font-weight: 600; color: #475569; }
.wwa-share-embed summary::-webkit-details-marker { display: none; }
.wwa-share-embed summary svg { width: 16px; height: 16px; flex-shrink: 0; color: #0052CC; }
.wwa-share-embed summary:hover { color: #0052CC; }
.wwa-share-embed[open] summary { border-bottom: 1px solid #e2e8f0; }
.wwa-share-embed__body { padding: 12px 14px 14px; }
.wwa-share-embed__body label { display: block; margin-bottom: .45rem; font-size: 12px; color: #64748b; }
.wwa-share-embed__body textarea { display: block; width: 100%; box-sizing: border-box; resize: vertical; margin: 0;
  padding: .6rem .7rem; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff;
  font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: #334155; }
.wwa-share-embed__actions { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-top: .6rem; }
.wwa-share-embed__copy { min-height: 44px; padding: 0 1.1rem; border: 0; border-radius: 8px; background: #0052CC; color: #fff;
  font-weight: 700; font-size: .88rem; cursor: pointer; }
.wwa-share-embed__copy:hover { background: #003D99; }
.wwa-share-embed__status { font-size: 12px; color: #16a34a; }

/* "Embed Diagram" control in the bottom-right corner of HTML/CSS diagram cards.
   Replaces the plain watermark line; the watermark text stays on the left. */
.wwa-diagram-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem .75rem; margin-top: .75rem; }
.wwa-diagram-foot__mark { font-size: 11px; font-weight: 600; color: #94a3b8; }
.wwa-diagram-embed { margin-left: auto; text-align: left; }
.wwa-diagram-embed summary { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; padding: 0 .25rem;
  box-sizing: border-box; cursor: pointer; list-style: none; font-size: 12px; font-weight: 600; color: #64748b; }
.wwa-diagram-embed summary::-webkit-details-marker { display: none; }
.wwa-diagram-embed summary svg { width: 14px; height: 14px; color: #0052CC; }
.wwa-diagram-embed summary:hover { color: #0052CC; }
.wwa-diagram-embed[open] { flex-basis: 100%; margin-left: 0; }
.wwa-diagram-embed[open] summary { float: right; }
.wwa-diagram-embed__panel { clear: both; padding: .75rem; margin-top: .25rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; }
.wwa-diagram-embed__panel label { display: block; margin-bottom: .45rem; font-size: 12px; color: #64748b; }
.wwa-diagram-embed__panel textarea { display: block; width: 100%; box-sizing: border-box; resize: vertical; margin: 0;
  padding: .6rem .7rem; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff;
  font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: #334155; }