/* Chat sharing extends the Live Hub's blue, white and ink palette. */
.chat-share-controls { padding: .8rem 1.2rem; border-bottom: 1px solid #e5edf8; color: #243954; background: #fff; flex-shrink: 0; }
.chat-share-controls summary { cursor: pointer; font-size: .85rem; font-weight: 650; min-height: 32px; align-content: center; }
.chat-share-controls[open] { max-height: 360px; overflow-y: auto; }
.chat-share-controls p { font-size: .8rem; line-height: 1.5; margin: .6rem 0; }
.chat-share-controls button, .shared-chat-page button { font: inherit; cursor: pointer; border: 1px solid #c9d6e8; border-radius: 8px; padding: .6rem .8rem; background: #fff; color: #174b96; min-height: 40px; }
.chat-share-controls button:hover, .shared-chat-page button:hover { background: #edf4ff; }
.chat-share-controls button:disabled, .shared-chat-page button:disabled { cursor: wait; opacity: .65; }
.chat-share-controls .chat-share-primary, .shared-chat-page button[type=submit] { background: #1762d4; color: #fff; border-color: #1762d4; }
.chat-share-controls .chat-share-primary:hover, .shared-chat-page button[type=submit]:hover { background: #124eac; }
.chat-share-controls label { display: block; font-size: .8rem; margin: .7rem 0 .25rem; font-weight: 650; }
.chat-share-controls input { width: 100%; box-sizing: border-box; min-height: 40px; border: 1px solid #c9d6e8; border-radius: 6px; padding: .5rem; font: inherit; font-size: .8rem; color: #172c49; background: #f5f8fd; }
.chat-share-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .65rem; }
.chat-share-links { list-style: none; padding: 0; margin: .7rem 0 0; max-height: 130px; overflow-y: auto; }
.chat-share-links li { display: flex; align-items: center; justify-content: space-between; gap: .6rem; border-top: 1px solid #e5edf8; padding: .45rem 0; font-size: .78rem; }
.chat-share-status { font-size: .85rem; color: #415b7e; overflow-wrap: anywhere; }
.chat-share-status[data-error=true] { color: #b42318; }
.chat-share-controls [hidden], .shared-chat-page [hidden] { display: none !important; }
.chat-share-controls :focus-visible, .shared-chat-page :focus-visible { outline: 3px solid #3379da; outline-offset: 3px; }
.shared-chat-page { margin: 0; background: #f5f8fd; color: #172c49; font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
.shared-chat-page * { box-sizing: border-box; }
.shared-chat-page ::selection { background: #c8dfff; color: #172c49; }
.shared-chat-shell { max-width: 840px; margin: 0 auto; padding: 24px; }
.shared-chat-brand { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0 28px; }
.shared-chat-brand a { text-decoration: none; color: #174b96; font-weight: 750; }
.shared-chat-brand a span { color: #526681; font-weight: 450; }
.chat-readonly-badge { background: #e6effc; color: #254f8c; padding: 5px 10px; border-radius: 20px; font-size: 12px; white-space: nowrap; }
.shared-chat-gate { max-width: 480px; margin: clamp(24px, 9vh, 100px) auto 0; }
.shared-chat-page h1 { font-size: clamp(24px, 4vw, 32px); line-height: 1.2; letter-spacing: -.025em; margin: 0 0 14px; }
.shared-chat-gate > p { color: #526681; margin: 0 0 28px; }
.shared-chat-gate form { display: grid; gap: 12px; }
.shared-chat-gate label { font-size: 14px; font-weight: 650; }
.shared-chat-gate input { width: 100%; min-height: 48px; padding: 12px; font: inherit; border: 1px solid #b4c4d9; border-radius: 8px; background: #fff; color: #172c49; }
.shared-chat-page button { min-height: 44px; }
.shared-chat-gate .chat-share-status { margin-top: 16px; }
.shared-chat-room { background: #fff; border: 1px solid #e0e8f2; border-radius: 14px; overflow: hidden; }
.shared-chat-heading { padding: 22px; display: flex; align-items: flex-start; gap: 16px; justify-content: space-between; border-bottom: 1px solid #e0e8f2; }
.shared-chat-heading > div { min-width: 0; }
.shared-chat-heading h1 { font-size: 22px; overflow-wrap: anywhere; margin: 0 0 6px; }
.shared-chat-heading p { margin: 0; color: #526681; font-size: 13px; }
.shared-chat-heading button { flex-shrink: 0; font-size: 13px; }
.shared-chat-messages { height: min(65vh, 640px); min-height: 250px; overflow-y: auto; scrollbar-color: #b4c4d9 #fff; padding: 0 22px; overscroll-behavior: contain; }
.shared-chat-message { padding: 18px 0; border-bottom: 1px solid #edf1f7; }
.shared-chat-message header { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; font-size: 14px; }
.shared-chat-message header span, .shared-chat-message time { color: #526681; font-size: 12px; }
.shared-chat-message time { margin-left: auto; font-variant-numeric: tabular-nums; }
.shared-chat-message p { margin: 6px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 15px; }
.shared-chat-message[data-staff=true] strong { color: #174b96; }
.shared-chat-message[data-pinned=true] { background: #f2f7ff; }
.shared-chat-empty { padding: 30px 0; color: #526681; }
.shared-chat-room footer { padding: 14px 22px; color: #526681; font-size: 12px; border-top: 1px solid #e0e8f2; }
@media (max-width: 480px) { .shared-chat-shell { padding: 16px; } .shared-chat-heading { padding: 16px; } .shared-chat-messages { padding: 0 16px; } .shared-chat-brand { font-size: 14px; } }
