/* F131 — Entwurf per Link teilen: Knopf im KI-Designer und öffentliche Seite. */

.lf-ki-history-share {
    flex: 0 0 auto;
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: .35em;
    height: 28px;
    padding: 0 .7em;
    border: 1px solid var(--lf-border-soft, #ddd);
    border-radius: 14px;
    background: #fff;
    color: var(--lf-green-link, #1b7a3a);
    font: inherit;
    font-size: var(--lf-fs-sm);
    white-space: nowrap;
    cursor: pointer;
}
.lf-ki-history-share svg { flex: 0 0 auto; fill: currentColor; }
.lf-ki-history-share:focus:not(:focus-visible) { outline: none; }
.lf-ki-history-share:hover,
.lf-ki-history-share:focus-visible {
    border-color: var(--lf-green);
    background: var(--lf-green);
    color: #fff;
}
/* Schmal nur das Icon: Die Pille nähme sonst der Beschriftung der Version so
   viel Breite, dass „Version 1“ umbricht. */
@media (max-width: 479px) {
    .lf-ki-history-share { width: 28px; padding: 0; justify-content: center; border-radius: 50%; }
    .lf-ki-history-share-label { display: none; }
}
.lf-ki-share-status { margin-top: .6em; }
.lf-ki-share-message { margin: 0 0 .4em; font-size: var(--lf-fs-sm); color: var(--lf-green-link, #1b7a3a); }
.lf-ki-share-status.is-error .lf-ki-share-message { color: #b3261e; }
.lf-ki-share-url { font-size: var(--lf-fs-sm); }

.lf-share-page { max-width: 960px; margin: 0 auto 3em; }
.lf-share-title { margin: 0 0 .4em; }
.lf-share-lead { color: var(--lf-muted); margin: 0 0 1.5em; }

/* Das Etikett auf der getönten Fläche des KI-Designers, damit die Seite als
   Teil davon erkennbar bleibt. Feste Höhe, damit „Weiterarbeiten“ auf dem
   Laptop ohne Scrollen sichtbar bleibt. */
.lf-share-stage {
    display: flex;
    justify-content: center;
    padding: 1.5em;
    border-radius: var(--lf-card-radius, 16px);
    background: var(--lf-tint);
}
.lf-share-label-link { display: block; max-width: 100%; }
.lf-share-label-img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 370px;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
}

.lf-share-actions { max-width: 460px; margin: 1.25em auto 0; text-align: center; }
.lf-share-adopt-btn { width: 100%; min-height: 44px; }
.lf-share-hint { margin: .6em 0 1em; font-size: var(--lf-fs-sm); color: var(--lf-muted); }
.lf-share-own { display: inline-block; padding: .5em 0; font-size: var(--lf-fs-sm); }
.lf-share-error { color: #b3261e; margin-bottom: 1em; }

@media (max-width: 767px) {
    .lf-share-stage { padding: 1em; }
    .lf-share-label-img { max-height: 360px; }
}