/* Share sheet (partials/share-sheet.blade.php) – used on the public site and in the /app panel. */
.rt-share {
    --sh-bg: #fff; --sh-soft: #f4f1ec; --sh-border: #e7e2dc; --sh-fg: #1c1917; --sh-muted: #6b635d; --sh-accent: #ea580c;
    display: grid; gap: 16px; color: var(--sh-fg); font-size: .92rem; text-align: left;
}
@media (prefers-color-scheme: dark) {
    .rt-share-dialog .rt-share { --sh-bg: #171412; --sh-soft: #211d1a; --sh-border: #2c2724; --sh-fg: #f5f5f4; --sh-muted: #a8a29e; }
}
.dark .rt-share { --sh-bg: #171412; --sh-soft: #231f1c; --sh-border: rgba(255, 255, 255, .1); --sh-fg: #f5f5f4; --sh-muted: #a8a29e; }

.rt-share-message { margin: 0; padding: 12px 14px; border-radius: 12px; background: var(--sh-soft); color: var(--sh-muted); line-height: 1.45; word-break: break-word; }
.rt-share-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)); gap: 8px; }
.rt-share-btn {
    display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px; border-radius: 14px;
    border: 1px solid var(--sh-border); background: var(--sh-bg); color: var(--sh-fg); font: inherit; font-size: .8rem; font-weight: 600;
    text-decoration: none; cursor: pointer; transition: border-color .15s, transform .15s;
}
.rt-share-btn:hover { border-color: var(--sh-accent); transform: translateY(-1px); }
.rt-share-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; background: #78716c; }
.rt-share-icon svg { width: 21px; height: 21px; }
.rt-share-icon b { font: 800 22px/1 Arial, sans-serif; }
.rt-share-viber .rt-share-icon { background: #7360f2; }
.rt-share-whatsapp .rt-share-icon { background: #25d366; }
.rt-share-facebook .rt-share-icon { background: #1877f2; }
.rt-share-messenger .rt-share-icon { background: linear-gradient(45deg, #0084ff, #a033ff 60%, #ff6080); }
.rt-share-telegram .rt-share-icon { background: #26a5e4; }
.rt-share-email .rt-share-icon { background: #57534e; }
.rt-share-copy .rt-share-icon { background: var(--sh-accent); }
/* Messenger's share link opens the app – only useful on phones. */
@media (hover: hover) and (pointer: fine) { .rt-share-messenger { display: none; } }
.rt-share-more { display: none; }
.rt-can-share .rt-share-more { display: flex; }

.rt-share-story { display: grid; grid-template-columns: 76px 1fr; gap: 14px; align-items: center; padding: 12px; border-radius: 14px; border: 1px solid var(--sh-border); background: var(--sh-soft); }
.rt-share-story img { width: 76px; height: auto; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 8px; background: #12100e; }
.rt-share-story b { display: block; margin-bottom: 2px; }
.rt-share-story p { margin: 0 0 10px; color: var(--sh-muted); font-size: .82rem; line-height: 1.4; }
.rt-share-story-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.rt-share-pill {
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 0; border-radius: 999px; cursor: pointer;
    background: linear-gradient(45deg, #f58529, #dd2a7b 55%, #8134af); color: #fff; font: inherit; font-size: .82rem; font-weight: 700;
}
.rt-share-pill svg, .rt-share-link svg { width: 17px; height: 17px; }
.rt-share-link { display: inline-flex; align-items: center; gap: 4px; color: var(--sh-accent); font-size: .82rem; font-weight: 600; text-decoration: none; }

/* Public site: the sheet in a <dialog> */
.rt-share-dialog { width: min(520px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 0; border: 0; border-radius: 20px; background: #fff; color: #1c1917; box-shadow: 0 24px 64px rgba(0, 0, 0, .35); }
.rt-share-dialog::backdrop { background: rgba(18, 16, 14, .6); backdrop-filter: blur(2px); }
.rt-share-dialog-inner { padding: 20px; }
.rt-share-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.rt-share-dialog-head h2 { margin: 0; font-size: 1.15rem; }
.rt-share-dialog-head button { border: 0; background: none; font-size: 1.6rem; line-height: 1; cursor: pointer; color: #78716c; }
@media (prefers-color-scheme: dark) { .rt-share-dialog { background: #171412; color: #f5f5f4; } }
