/* Stream "Add stream" sheet in the composer look shared by Create, Community,
   Map Post, Shop Add item and Booking Add service. Doubled ids and !important
   throughout to beat the page's blanket modal rules. */
#mobileStreamModal#mobileStreamModal { position: fixed !important; inset: 0 !important; z-index: 999999 !important; overflow-y: auto !important; overflow-x: hidden !important; -webkit-overflow-scrolling: touch; background: #FBFBF9 !important; color: #111214 !important; -webkit-text-fill-color: #111214 !important; color-scheme: light !important; font-family: Manrope, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important; }
#mobileStreamModal#mobileStreamModal * { box-sizing: border-box; font-family: Manrope, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important; }
#mobileStreamModal#mobileStreamModal .fa, #mobileStreamModal#mobileStreamModal .fas, #mobileStreamModal#mobileStreamModal .fa-solid { font-family: "Font Awesome 6 Free" !important; font-weight: 900 !important; }
#mobileStreamModal#mobileStreamModal .fab { font-family: "Font Awesome 6 Brands" !important; font-weight: 400 !important; }
#mobileStreamModal#mobileStreamModal [hidden], #mobileStreamModal#mobileStreamModal div[hidden] { display: none !important; }
#mobileStreamModal#mobileStreamModal button { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; filter: none !important; text-shadow: none !important; -webkit-font-smoothing: antialiased !important; }
#mobileStreamModal#mobileStreamModal .mobile-stream-add-shell { width: 100% !important; max-width: 100% !important; min-height: 100dvh !important; margin: 0 !important; padding: calc(14px + env(safe-area-inset-top, 0px)) 18px calc(112px + env(safe-area-inset-bottom, 0px)) !important; }

#mobileStreamModal#mobileStreamModal .stc-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; margin: 0 0 14px !important; padding: 6px 0 0 !important; }
#mobileStreamModal#mobileStreamModal .stc-bar-cancel, #mobileStreamModal#mobileStreamModal .stc-bar-spacer { width: 64px !important; flex: 0 0 64px !important; }
#mobileStreamModal#mobileStreamModal .stc-bar-cancel { min-height: 0 !important; margin: 0 !important; padding: 8px 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; text-align: left !important; font-size: 13px !important; font-weight: 600 !important; color: #63635F !important; -webkit-text-fill-color: #63635F !important; cursor: pointer; }
#mobileStreamModal#mobileStreamModal .stc-bar-title { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 2px !important; }
#mobileStreamModal#mobileStreamModal .stc-bar-title strong { font-size: 15px !important; font-weight: 800 !important; letter-spacing: -0.02em !important; color: #111214 !important; -webkit-text-fill-color: #111214 !important; }
#mobileStreamModal#mobileStreamModal .stc-bar-title small { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace !important; font-size: 9px !important; font-weight: 500 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #70706B !important; -webkit-text-fill-color: #70706B !important; }

#mobileStreamModal#mobileStreamModal .stc-posting { display: flex !important; align-items: center !important; gap: 12px !important; padding: 12px !important; border: 1px solid #EAEAE6 !important; border-radius: 18px !important; background: #FFFFFF !important; box-shadow: 0 1px 2px rgba(17, 18, 20, 0.03) !important; }
#mobileStreamModal#mobileStreamModal .stc-posting-avatar { width: 38px !important; height: 38px !important; flex: 0 0 38px !important; border-radius: 12px !important; overflow: hidden !important; background: #111214 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
#mobileStreamModal#mobileStreamModal .stc-posting-avatar span { font-size: 13px !important; font-weight: 800 !important; color: #FBFBF9 !important; -webkit-text-fill-color: #FBFBF9 !important; }
#mobileStreamModal#mobileStreamModal .stc-posting-avatar img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
#mobileStreamModal#mobileStreamModal .stc-posting-copy { display: flex !important; flex-direction: column !important; gap: 3px !important; min-width: 0 !important; }
#mobileStreamModal#mobileStreamModal .stc-posting-label { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace !important; font-size: 9px !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #70706B !important; -webkit-text-fill-color: #70706B !important; }
#mobileStreamModal#mobileStreamModal .stc-posting-name { font-size: 14px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; color: #111214 !important; -webkit-text-fill-color: #111214 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }

#mobileStreamModal#mobileStreamModal .stc-eyebrow, #mobileStreamModal#mobileStreamModal .stc-eyebrow span { font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace !important; font-size: 9px !important; font-weight: 500 !important; letter-spacing: 0.14em !important; text-transform: uppercase !important; color: #70706B !important; -webkit-text-fill-color: #70706B !important; }
#mobileStreamModal#mobileStreamModal .stc-eyebrow { display: flex !important; align-items: baseline !important; justify-content: space-between !important; margin: 16px 0 8px !important; padding: 0 4px !important; }
#mobileStreamModal#mobileStreamModal .stc-eyebrow span:last-child:not(:first-child) { letter-spacing: 0.08em !important; text-transform: none !important; }

#mobileStreamModal#mobileStreamModal .stc-segment { display: flex !important; gap: 6px !important; margin: 0 !important; padding: 4px !important; border: 0 !important; border-radius: 14px !important; background: #F1F1ED !important; }
#mobileStreamModal#mobileStreamModal .stc-segment button { flex: 1 !important; height: 40px !important; min-height: 40px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 11px !important; background: transparent !important; box-shadow: none !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; color: #63635F !important; -webkit-text-fill-color: #63635F !important; opacity: 1 !important; cursor: pointer; }
#mobileStreamModal#mobileStreamModal .stc-segment button i { font-size: 12px !important; color: inherit !important; -webkit-text-fill-color: inherit !important; }
#mobileStreamModal#mobileStreamModal .stc-segment button svg { width: 13px !important; height: 13px !important; display: block !important; fill: currentColor !important; }
#mobileStreamModal#mobileStreamModal .stc-segment button span { font-size: 12px !important; font-weight: 700 !important; color: inherit !important; -webkit-text-fill-color: inherit !important; }
#mobileStreamModal#mobileStreamModal .stc-segment button.is-active { background: #FFFFFF !important; box-shadow: 0 1px 3px rgba(17, 18, 20, 0.10) !important; color: #111214 !important; -webkit-text-fill-color: #111214 !important; }

#mobileStreamModal#mobileStreamModal .stc-card { margin: 0 !important; padding: 0 !important; border: 1px solid #EAEAE6 !important; border-radius: 18px !important; background: #FFFFFF !important; box-shadow: 0 1px 2px rgba(17, 18, 20, 0.03) !important; overflow: hidden !important; }
#mobileStreamModal#mobileStreamModal .stc-row { display: flex !important; align-items: center !important; gap: 10px !important; min-height: 50px !important; padding: 0 14px !important; }
#mobileStreamModal#mobileStreamModal .stc-card--link { display: flex !important; align-items: flex-start !important; gap: 12px !important; padding: 12px 14px !important; }
#mobileStreamModal#mobileStreamModal .stc-link-icon { width: 34px !important; height: 34px !important; flex: 0 0 34px !important; border-radius: 11px !important; background: #111214 !important; display: grid !important; place-items: center !important; margin-top: -3px !important; }
#mobileStreamModal#mobileStreamModal .stc-link-icon i { font-size: 13px !important; color: #FBFBF9 !important; -webkit-text-fill-color: #FBFBF9 !important; }
#mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card input, #mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card textarea, #mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card input:focus, #mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card textarea:focus {
    flex: 1 1 auto !important; width: 100% !important; min-width: 0 !important; height: 50px !important; min-height: 50px !important; margin: 0 !important; padding: 0 !important;
    border: 0 !important; border-radius: 0 !important; outline: none !important; box-shadow: none !important; background: transparent !important; background-color: transparent !important;
    font-size: 14px !important; font-weight: 600 !important; line-height: 1.4 !important; color: #111214 !important; -webkit-text-fill-color: #111214 !important; caret-color: #0FBFA4 !important;
    -webkit-appearance: none !important; appearance: none !important; resize: none !important; color-scheme: light !important;
}
#mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card--link textarea, #mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card--link textarea:focus { height: auto !important; min-height: 28px !important; padding: 4px 0 0 !important; font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.5 !important; overflow: hidden !important; }
#mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card--text { padding: 2px 4px !important; }
#mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card--text textarea, #mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card--text textarea:focus { height: auto !important; min-height: 88px !important; padding: 14px 10px !important; font-weight: 500 !important; line-height: 1.5 !important; }
#mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card input::placeholder, #mobileStreamModal#mobileStreamModal#mobileStreamModal#mobileStreamModal .stc-card textarea::placeholder { color: #A3A3A0 !important; -webkit-text-fill-color: #A3A3A0 !important; opacity: 1 !important; }
#mobileStreamModal#mobileStreamModal .stc-hint { margin: 8px 4px 0 !important; font-size: 11.5px !important; font-weight: 500 !important; line-height: 1.4 !important; color: #70706B !important; -webkit-text-fill-color: #70706B !important; }

#mobileStreamModal#mobileStreamModal .stc-card--preview { padding: 0 !important; background: #111214 !important; border-color: #111214 !important; }
#mobileStreamModal#mobileStreamModal .stc-preview-stage { position: relative !important; width: 100% !important; aspect-ratio: 16 / 9 !important; background: #111214 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
#mobileStreamModal#mobileStreamModal .stc-preview-stage iframe, #mobileStreamModal#mobileStreamModal .stc-preview-stage video { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; border: 0 !important; border-radius: 0 !important; display: block !important; }
#mobileStreamModal#mobileStreamModal .stc-preview-stage > div { color: rgba(251, 251, 249, 0.72) !important; -webkit-text-fill-color: rgba(251, 251, 249, 0.72) !important; font-size: 12px !important; }
#mobileStreamModal#mobileStreamModal .stc-preview-stage > div i { color: rgba(251, 251, 249, 0.72) !important; -webkit-text-fill-color: rgba(251, 251, 249, 0.72) !important; }

#mobileStreamModal#mobileStreamModal .stc-foot { margin: 18px 0 0 !important; }
#mobileStreamModal#mobileStreamModal .stc-submit, #mobileStreamModal#mobileStreamModal button.stc-submit, #mobileStreamModal#mobileStreamModal .stc-submit:disabled { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 54px !important; min-height: 54px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 16px !important; background: #EDEDE8 !important; box-shadow: none !important; transform: none !important; opacity: 1 !important; font-family: "IBM Plex Mono", ui-monospace, Menlo, monospace !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0.22em !important; text-transform: uppercase !important; color: #8A8A84 !important; -webkit-text-fill-color: #8A8A84 !important; }
#mobileStreamModal#mobileStreamModal .stc-submit span { font: inherit !important; color: inherit !important; -webkit-text-fill-color: inherit !important; }
#mobileStreamModal#mobileStreamModal .stc-submit::before, #mobileStreamModal#mobileStreamModal .stc-submit::after { content: none !important; display: none !important; }
#mobileStreamModal#mobileStreamModal .stc-submit.is-ready { background: #111214 !important; box-shadow: 0 12px 24px -12px rgba(17, 18, 20, 0.55) !important; color: #FBFBF9 !important; -webkit-text-fill-color: #FBFBF9 !important; }
#mobileStreamModal#mobileStreamModal .stc-submit.is-busy { letter-spacing: 0.16em !important; }
#mobileStreamModal#mobileStreamModal .stc-note { margin: 9px 0 0 !important; text-align: center !important; font-size: 11.5px !important; font-weight: 500 !important; color: #63635F !important; -webkit-text-fill-color: #63635F !important; }
#mobileStreamModal#mobileStreamModal .mobile-stream-add-status { margin: 10px 0 0 !important; padding: 10px 12px !important; border-radius: 12px !important; font-size: 12px !important; font-weight: 600 !important; }
