/* UmrahRoom Live Chat — reference-mockup implementation using production SVG asset pack.
   Scope intentionally limited to community-chat.php / body.community-live-v5. */

body.community-live-v5{
  --ur-live-blue:#0876f9;
  --ur-live-blue-dark:#085dcc;
  --ur-live-navy:#0a2457;
  --ur-live-text:#15386d;
  --ur-live-muted:#6e85a5;
  --ur-live-line:#dce8f7;
  --ur-live-surface:#f7fbff;
  --ur-live-bubble:#f0f6fd;
  --ur-live-reply:#eef6ff;
  --ur-live-green:#16bf68;
  --ur-live-red:#ef2b2d;
}

/* Reusable asset masks. */
body.community-live-v5 .ur-live-icon{
  display:inline-block;
  width:1em;
  height:1em;
  flex:0 0 auto;
  background:currentColor;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-size:contain;
  mask-size:contain;
}
body.community-live-v5 .ur-live-icon-back{-webkit-mask-image:url('../ui/live-chat/icons/back.svg');mask-image:url('../ui/live-chat/icons/back.svg')}
body.community-live-v5 .ur-live-icon-community{-webkit-mask-image:url('../ui/live-chat/icons/community.svg');mask-image:url('../ui/live-chat/icons/community.svg')}
body.community-live-v5 .ur-live-icon-shield{-webkit-mask-image:url('../ui/live-chat/icons/shield-check.svg');mask-image:url('../ui/live-chat/icons/shield-check.svg')}
body.community-live-v5 .ur-live-icon-hashtag{-webkit-mask-image:url('../ui/live-chat/icons/hashtag.svg');mask-image:url('../ui/live-chat/icons/hashtag.svg')}
body.community-live-v5 .ur-live-icon-chevron{-webkit-mask-image:url('../ui/live-chat/icons/chevron-right.svg');mask-image:url('../ui/live-chat/icons/chevron-right.svg')}
body.community-live-v5 .ur-live-icon-reply{-webkit-mask-image:url('../ui/live-chat/icons/reply.svg');mask-image:url('../ui/live-chat/icons/reply.svg')}
body.community-live-v5 .ur-live-icon-helpful{-webkit-mask-image:url('../ui/live-chat/icons/helpful.svg');mask-image:url('../ui/live-chat/icons/helpful.svg')}
body.community-live-v5 .ur-live-icon-more{-webkit-mask-image:url('../ui/live-chat/icons/more-vertical.svg');mask-image:url('../ui/live-chat/icons/more-vertical.svg')}
body.community-live-v5 .ur-live-icon-plus{-webkit-mask-image:url('../ui/live-chat/icons/plus.svg');mask-image:url('../ui/live-chat/icons/plus.svg')}
body.community-live-v5 .ur-live-icon-emoji{-webkit-mask-image:url('../ui/live-chat/icons/emoji.svg');mask-image:url('../ui/live-chat/icons/emoji.svg')}
body.community-live-v5 .ur-live-icon-attachment{-webkit-mask-image:url('../ui/live-chat/icons/attachment.svg');mask-image:url('../ui/live-chat/icons/attachment.svg')}
body.community-live-v5 .ur-live-icon-send{-webkit-mask-image:url('../ui/live-chat/icons/send.svg');mask-image:url('../ui/live-chat/icons/send.svg')}
body.community-live-v5 .ur-live-icon-users{-webkit-mask-image:url('../ui/live-chat/icons/users.svg');mask-image:url('../ui/live-chat/icons/users.svg')}
body.community-live-v5 .ur-live-icon-translation{-webkit-mask-image:url('../ui/live-chat/icons/translation.svg');mask-image:url('../ui/live-chat/icons/translation.svg')}

@media(max-width:900px){
  body.community-live-v5{
    padding-bottom:calc(60px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
  }
  body.community-live-v5 .floating-actions{display:none!important}
  body.community-live-v5 .ur-community-topnav,
  body.community-live-v5 .urc-topnav{display:none!important}
  body.community-live-v5 .ur-community-app{padding:0!important}
  body.community-live-v5 .urc-live-layout{padding:0!important;width:100%!important;max-width:none!important}
  body.community-live-v5 .urc-live-left,
  body.community-live-v5 .urc-live-right{display:none!important}

  body.community-live-v5 .urc-live-main{
    position:relative!important;
    height:calc(100dvh - 114px)!important;
    min-height:540px!important;
    border:0!important;
    border-radius:0!important;
    background:#fff!important;
    display:grid!important;
    grid-template-rows:auto auto auto auto minmax(0,1fr) auto!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  /* Reference header row below the locked 54px UmrahRoom global shell. */
  body.community-live-v5 .urc-live-header{
    position:relative!important;
    height:72px!important;
    min-height:72px!important;
    padding:0 11px!important;
    border-bottom:0!important;
    background:#fff!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:7px!important;
  }
  body.community-live-v5 .urc-live-header-title{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    gap:8px!important;
    flex:1 1 auto!important;
  }
  body.community-live-v5 .urc-live-back-label{
    display:flex!important;
    align-items:center!important;
    gap:3px!important;
    min-width:70px!important;
    color:var(--ur-live-blue)!important;
    text-decoration:none!important;
    font:700 8.6px/1.08 Inter,system-ui,sans-serif!important;
  }
  body.community-live-v5 .urc-live-back-label .ur-live-icon{font-size:19px!important}
  body.community-live-v5 .urc-live-header-divider{
    width:1px!important;
    height:38px!important;
    background:#dfe8f4!important;
    flex:0 0 auto!important;
  }
  body.community-live-v5 .urc-live-title-icon{
    width:38px!important;
    height:38px!important;
    border-radius:11px!important;
    background:var(--ur-live-blue)!important;
    color:#fff!important;
    display:grid!important;
    place-items:center!important;
    flex:0 0 auto!important;
    box-shadow:0 5px 12px rgba(8,118,249,.16)!important;
  }
  body.community-live-v5 .urc-live-title-icon .ur-live-icon{font-size:22px!important}
  body.community-live-v5 .urc-live-title-copy{min-width:0!important;display:block!important}
  body.community-live-v5 .urc-live-title-copy h1{
    margin:0!important;
    color:var(--ur-live-navy)!important;
    font:800 16px/1.05 Inter,system-ui,sans-serif!important;
    letter-spacing:-.35px!important;
    white-space:nowrap!important;
  }
  body.community-live-v5 .urc-live-title-copy p{
    margin:4px 0 0!important;
    color:#60799a!important;
    font:600 7.5px/1.1 Inter,system-ui,sans-serif!important;
    white-space:nowrap!important;
  }
  body.community-live-v5 .urc-live-presence{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    flex:0 0 auto!important;
    min-width:77px!important;
    height:34px!important;
    padding:0 9px!important;
    border-radius:14px!important;
    background:#f4f9ff!important;
    border:1px solid #dce9f8!important;
    color:var(--ur-live-navy)!important;
  }
  body.community-live-v5 .urc-live-presence i{
    width:9px!important;height:9px!important;border-radius:50%!important;
    background:var(--ur-live-green)!important;
    box-shadow:0 0 0 4px rgba(22,191,104,.12)!important;
  }
  body.community-live-v5 .urc-live-presence b{font:800 9px/1 Inter,system-ui,sans-serif!important;white-space:nowrap!important}

  /* Safety card. */
  body.community-live-v5 .urc-live-mobile-safety{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:9px!important;
    margin:0 10px 8px!important;
    padding:10px 11px!important;
    min-height:68px!important;
    border:1px solid #d7e7f8!important;
    border-radius:13px!important;
    background:linear-gradient(100deg,#eef6ff 0%,#f8fbff 100%)!important;
    color:#264b7b!important;
    box-shadow:none!important;
  }
  body.community-live-v5 .urc-live-safety-icon{
    width:36px!important;height:36px!important;border-radius:10px!important;
    display:grid!important;place-items:center!important;background:var(--ur-live-blue)!important;color:#fff!important;
  }
  body.community-live-v5 .urc-live-safety-icon .ur-live-icon{font-size:21px!important}
  body.community-live-v5 .urc-live-mobile-safety p{margin:0!important;font:600 8px/1.35 Inter,system-ui,sans-serif!important;color:#526d91!important;min-width:0!important}
  body.community-live-v5 .urc-live-mobile-safety p b{display:block!important;color:#0b4fae!important;font-size:10px!important;line-height:1.15!important;margin-bottom:2px!important}
  body.community-live-v5 .urc-live-mobile-safety a{
    display:flex!important;align-items:center!important;gap:2px!important;
    color:#0876f9!important;text-decoration:none!important;font:800 8px/1 Inter,system-ui,sans-serif!important;white-space:nowrap!important;
  }
  body.community-live-v5 .urc-live-mobile-safety a .ur-live-icon{font-size:12px!important}

  /* Single #General room card from the reference. Topic filtering remains available on desktop. */
  body.community-live-v5 .urc-live-mobile-room{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    align-items:center!important;
    gap:10px!important;
    margin:0 10px 7px!important;
    padding:9px 11px!important;
    min-height:58px!important;
    border:1px solid #dce8f7!important;
    border-radius:13px!important;
    background:#f8fbff!important;
  }
  body.community-live-v5 .urc-live-room-icon{
    width:36px!important;height:36px!important;border-radius:10px!important;
    display:grid!important;place-items:center!important;background:var(--ur-live-blue)!important;color:#fff!important;
  }
  body.community-live-v5 .urc-live-room-icon .ur-live-icon{font-size:20px!important}
  body.community-live-v5 .urc-live-mobile-room p{margin:0!important;min-width:0!important}
  body.community-live-v5 .urc-live-mobile-room b{display:block!important;color:var(--ur-live-navy)!important;font:800 10px/1.15 Inter,system-ui,sans-serif!important;margin-bottom:3px!important}
  body.community-live-v5 .urc-live-mobile-room span:not(.urc-live-room-icon):not(.ur-live-icon){display:block!important;color:#667e9e!important;font:600 7.7px/1.25 Inter,system-ui,sans-serif!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  body.community-live-v5 .urc-live-mobile-topics{display:none!important}

  /* Joined divider. */
  body.community-live-v5 .urc-live-joined{
    display:grid!important;
    grid-template-columns:minmax(20px,1fr) auto minmax(20px,1fr)!important;
    align-items:center!important;
    gap:8px!important;
    padding:3px 12px 7px!important;
    background:#fff!important;
  }
  body.community-live-v5 .urc-live-joined>span{height:1px!important;background:#75aefb!important}
  body.community-live-v5 .urc-live-joined>div{text-align:center!important;display:grid!important;gap:2px!important}
  body.community-live-v5 .urc-live-joined b{display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;color:#0876f9!important;font:800 9.2px/1 Inter,system-ui,sans-serif!important}
  body.community-live-v5 .urc-live-joined small{color:#748aa8!important;font:600 7.3px/1.2 Inter,system-ui,sans-serif!important}
  body.community-live-v5 .urc-joined-icon{width:24px!important;height:24px!important;border-radius:50%!important;background:#e9f3ff!important;color:#0876f9!important;display:grid!important;place-items:center!important;font-style:normal!important}
  body.community-live-v5 .urc-joined-icon .ur-live-icon{font-size:14px!important}

  /* Message canvas + subtle production doodle asset. */
  body.community-live-v5 .urc-live-messages{
    position:relative!important;
    padding:5px 12px 76px!important;
    background-color:#fff!important;
    background-image:linear-gradient(rgba(255,255,255,.74),rgba(255,255,255,.74)),url('../ui/live-chat/doodles/live-chat-doodle-pattern.svg')!important;
    background-size:auto,390px 640px!important;
    background-repeat:repeat,repeat!important;
    background-position:center top!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:none!important;
    scroll-behavior:smooth!important;
  }
  body.community-live-v5 .urc-live-messages::-webkit-scrollbar{display:none!important}
  body.community-live-v5 .urc-live-messages .ur-chat-message{
    position:relative!important;
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    gap:8px!important;
    margin:0 0 12px!important;
    align-items:start!important;
    touch-action:pan-y!important;
    transition:transform .16s ease!important;
    will-change:transform!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.urc-swiping{transition:none!important}
  body.community-live-v5 .urc-swipe-reply-indicator{
    position:absolute!important;
    inset-inline-start:-34px!important;
    top:30px!important;
    width:31px!important;height:31px!important;border-radius:50%!important;
    display:grid!important;place-items:center!important;
    background:#e9f3ff!important;color:#0876f9!important;
    opacity:0!important;transform:scale(.75)!important;transition:opacity .12s ease,transform .12s ease!important;
    pointer-events:none!important;
  }
  body.community-live-v5 .urc-swiping .urc-swipe-reply-indicator{opacity:1!important;transform:scale(1)!important}
  body.community-live-v5 .urc-swipe-reply-indicator .ur-live-icon{font-size:17px!important}
  body.community-live-v5 .urc-live-messages .ur-community-avatar{
    width:38px!important;height:38px!important;border-radius:50%!important;border:2px solid #fff!important;
    box-shadow:0 2px 8px rgba(20,60,110,.10)!important;overflow:hidden!important;
    display:grid!important;place-items:center!important;background:#e4effd!important;color:#0876f9!important;font:800 11px Inter!important;
  }
  body.community-live-v5 .urc-live-messages .ur-community-avatar img{width:100%!important;height:100%!important;object-fit:cover!important}
  body.community-live-v5 .urc-message-body{min-width:0!important;width:100%!important;background:transparent!important;border:0!important;padding:0!important}
  body.community-live-v5 .ur-chat-message-head{
    min-height:23px!important;display:flex!important;align-items:center!important;gap:6px!important;padding:0 3px 3px!important;
  }
  body.community-live-v5 .ur-chat-message-head b{color:var(--ur-live-navy)!important;font:800 10px/1 Inter,system-ui,sans-serif!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:105px!important}
  body.community-live-v5 .ur-chat-message-head time{margin:0!important;color:#738aa9!important;font:600 8.2px/1 Inter,system-ui,sans-serif!important;white-space:nowrap!important}
  body.community-live-v5 .urc-message-topic{
    margin-inline-start:auto!important;
    border-radius:999px!important;
    background:#dceeff!important;color:#0876f9!important;
    padding:4px 9px!important;
    font:700 7.5px/1 Inter,system-ui,sans-serif!important;
    white-space:nowrap!important;
  }
  body.community-live-v5 .urc-message-topic-hotels{background:#ecdfff!important;color:#7a16e5!important}
  body.community-live-v5 .urc-message-topic-makkah{background:#def6e9!important;color:#178d55!important}
  body.community-live-v5 .urc-message-topic-madinah{background:#fff0d8!important;color:#b86600!important}
  body.community-live-v5 .urc-message-topic-general{background:#eaf3ff!important;color:#0b64cf!important}
  body.community-live-v5 .ur9-chat-more,
  body.community-live-v5 .ur9-chat-more-preview{
    width:24px!important;height:24px!important;min-width:24px!important;padding:0!important;margin:0!important;
    border:0!important;background:transparent!important;color:#0b4fae!important;display:grid!important;place-items:center!important;
  }
  body.community-live-v5 .ur9-chat-more .ur-live-icon,
  body.community-live-v5 .ur9-chat-more-preview .ur-live-icon{font-size:15px!important}

  body.community-live-v5 .urc-message-bubble{
    width:fit-content!important;max-width:100%!important;
    padding:8px 10px!important;
    border:0!important;
    border-radius:5px 13px 13px 13px!important;
    background:rgba(240,246,253,.96)!important;
    color:var(--ur-live-text)!important;
    box-shadow:0 2px 9px rgba(31,78,133,.025)!important;
  }
  body.community-live-v5 .urc-message-bubble>p{
    margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;
    color:#173c70!important;font:500 10.5px/1.42 Inter,system-ui,sans-serif!important;box-shadow:none!important;
  }
  body.community-live-v5 .urc-chat-quote{
    position:relative!important;
    margin:-1px -1px 7px!important;
    padding:7px 8px 7px 13px!important;
    border:0!important;border-radius:7px!important;
    background:#e7f1fd!important;
    overflow:hidden!important;
  }
  body.community-live-v5 .urc-chat-quote::before{content:""!important;position:absolute!important;left:0!important;top:0!important;bottom:0!important;width:3px!important;background:#0876f9!important}
  body.community-live-v5 .urc-chat-quote b{display:flex!important;align-items:center!important;gap:4px!important;font:800 8.8px/1.1 Inter,system-ui,sans-serif!important;color:#0876f9!important}
  body.community-live-v5 .urc-chat-quote b .ur-live-icon{font-size:11px!important}
  body.community-live-v5 .urc-chat-quote span{display:block!important;margin-top:3px!important;font:600 8px/1.25 Inter,system-ui,sans-serif!important;color:#657d9d!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

  body.community-live-v5 .urc-demo-translation{display:grid!important;gap:3px!important;margin-top:5px!important;color:#173c70!important}
  body.community-live-v5 .urc-demo-translation b{display:flex!important;align-items:center!important;gap:4px!important;color:#0876f9!important;font:700 8.2px/1.1 Inter,system-ui,sans-serif!important}
  body.community-live-v5 .urc-demo-translation b .ur-live-icon{font-size:11px!important}
  body.community-live-v5 .urc-demo-translation span{font:500 9.5px/1.3 Inter,system-ui,sans-serif!important;color:#526d91!important}

  body.community-live-v5 .urc-live-message-actions{
    display:flex!important;align-items:center!important;gap:18px!important;padding:5px 5px 0!important;
  }
  body.community-live-v5 .urc-live-message-actions button{
    min-height:19px!important;border:0!important;background:transparent!important;color:#0b61c9!important;
    display:flex!important;align-items:center!important;gap:4px!important;padding:0!important;
    font:700 8.8px/1 Inter,system-ui,sans-serif!important;cursor:pointer!important;
  }
  body.community-live-v5 .urc-live-message-actions button .ur-live-icon{font-size:13px!important}
  body.community-live-v5 .urc-live-message-actions button.active{color:#0876f9!important}
  body.community-live-v5 .urc-live-message-actions button:first-child span:last-child{min-width:8px!important;text-align:left!important}
  body.community-live-v5 .urc-translate-reserved{display:none!important}

  /* Own messages keep the reference language but align naturally to the right. */
  body.community-live-v5 .ur-chat-message.is-mine{grid-template-columns:minmax(0,1fr)!important;padding-left:46px!important}
  body.community-live-v5 .ur-chat-message.is-mine>.ur-community-avatar{display:none!important}
  body.community-live-v5 .ur-chat-message.is-mine .urc-message-body{margin-left:auto!important;max-width:88%!important}
  body.community-live-v5 .ur-chat-message.is-mine .urc-message-bubble{margin-left:auto!important;background:#eaf4ff!important;border-radius:13px 5px 13px 13px!important}
  body.community-live-v5 .ur-chat-message.is-mine .urc-live-message-actions{justify-content:flex-end!important}

  body.community-live-v5 .ur-chat-empty{min-height:145px!important;display:grid!important;place-items:center!important;align-content:center!important;gap:4px!important;color:#6f87a5!important;text-align:center!important}
  body.community-live-v5 .ur-chat-empty span{font-size:22px!important;color:#a6bad1!important}
  body.community-live-v5 .ur-chat-empty b{font-size:10px!important}
  body.community-live-v5 .ur-chat-empty p{font-size:8px!important;margin:0!important}

  /* Composer matches the supplied reference: add button, field, emoji, attachment, send. */
  body.community-live-v5 .urc-live-composer{
    position:fixed!important;left:0!important;right:0!important;bottom:60px!important;top:auto!important;
    width:100%!important;margin:0!important;
    padding:7px 9px!important;
    border-top:1px solid #e3ebf6!important;
    background:#fff!important;
    box-shadow:0 -4px 16px rgba(19,65,120,.035)!important;
    box-sizing:border-box!important;z-index:5900!important;
  }
  body.community-live-v5 .urc-live-composer form{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) 44px!important;
    gap:7px!important;align-items:center!important;
  }
  body.community-live-v5 .urc-reply-preview,
  body.community-live-v5 .urc-privacy-error{grid-column:1/-1!important}
  body.community-live-v5 .urc-reply-preview{
    position:relative!important;
    padding:8px 32px 8px 12px!important;
    border-left:3px solid #0876f9!important;border-radius:8px!important;
    background:#eef6ff!important;color:#4e6b8f!important;font:600 8.4px/1.35 Inter,system-ui,sans-serif!important;
  }
  body.community-live-v5 .urc-reply-preview button{position:absolute!important;right:8px!important;top:50%!important;transform:translateY(-50%)!important;border:0!important;background:transparent!important;color:#5d7594!important;font-size:18px!important;line-height:1!important}
  body.community-live-v5 .urc-composer-tool,
  body.community-live-v5 .urc-composer-send,
  body.community-live-v5 .urc-composer-inline{
    border:0!important;display:grid!important;place-items:center!important;padding:0!important;cursor:pointer!important;
  }
  body.community-live-v5 .urc-composer-tool{
    width:40px!important;height:40px!important;border-radius:50%!important;
    background:#f4f8fe!important;border:1px solid #dce8f7!important;color:#0876f9!important;
  }
  body.community-live-v5 .urc-composer-tool .ur-live-icon{font-size:21px!important}
  body.community-live-v5 .urc-composer-field{
    height:42px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 28px 28px!important;align-items:center!important;
    gap:0!important;border:1px solid #cbdcf0!important;border-radius:999px!important;background:#fff!important;overflow:hidden!important;
  }
  body.community-live-v5 .urc-composer-field textarea{
    min-height:40px!important;max-height:76px!important;width:100%!important;border:0!important;border-radius:0!important;
    padding:12px 8px 11px 14px!important;background:transparent!important;color:#173b72!important;
    font:500 10px/1.25 Inter,system-ui,sans-serif!important;resize:none!important;outline:none!important;
  }
  body.community-live-v5 .urc-composer-inline{width:28px!important;height:40px!important;background:transparent!important;color:#0a2f72!important}
  body.community-live-v5 .urc-composer-inline .ur-live-icon{font-size:18px!important}
  body.community-live-v5 .urc-composer-send{
    width:44px!important;height:44px!important;border-radius:50%!important;background:#0876f9!important;color:#fff!important;
    box-shadow:0 6px 14px rgba(8,118,249,.20)!important;
  }
  body.community-live-v5 .urc-composer-send .ur-live-icon{font-size:21px!important}
  body.community-live-v5 .ur-chat-login{width:100%!important;height:42px!important;border:0!important;border-radius:12px!important;background:#0876f9!important;color:#fff!important;font:800 10px Inter!important}

  /* Use the delivered SVG asset family in the locked 6-item global bottom nav on this screen. */
  body.community-live-v5 .ur-global-mobile-nav svg{display:none!important}
  body.community-live-v5 .ur-global-mobile-nav>a::before,
  body.community-live-v5 .ur-global-mobile-nav>button::before{
    content:""!important;display:block!important;width:20px!important;height:20px!important;background:currentColor!important;
    -webkit-mask-position:center!important;mask-position:center!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;-webkit-mask-size:contain!important;mask-size:contain!important;
  }
  body.community-live-v5 .ur-global-mobile-nav>*:nth-child(1)::before{-webkit-mask-image:url('../ui/live-chat/icons/home.svg')!important;mask-image:url('../ui/live-chat/icons/home.svg')!important}
  body.community-live-v5 .ur-global-mobile-nav>*:nth-child(2)::before{-webkit-mask-image:url('../ui/live-chat/icons/live-chat.svg')!important;mask-image:url('../ui/live-chat/icons/live-chat.svg')!important}
  body.community-live-v5 .ur-global-mobile-nav>*:nth-child(3)::before{-webkit-mask-image:url('../ui/live-chat/icons/feed.svg')!important;mask-image:url('../ui/live-chat/icons/feed.svg')!important}
  /* Discussions stays the locked people/community glyph from the existing shell because the delivered discussions.svg differs from the approved reference. */
  body.community-live-v5 .ur-global-mobile-nav>*:nth-child(4)::before{-webkit-mask-image:url('../ui/live-chat/icons/community.svg')!important;mask-image:url('../ui/live-chat/icons/community.svg')!important}
  body.community-live-v5 .ur-global-mobile-nav>*:nth-child(5)::before{-webkit-mask-image:url('../ui/live-chat/icons/notifications.svg')!important;mask-image:url('../ui/live-chat/icons/notifications.svg')!important}
  body.community-live-v5 .ur-global-mobile-nav>*:nth-child(6)::before{-webkit-mask-image:url('../ui/live-chat/icons/profile.svg')!important;mask-image:url('../ui/live-chat/icons/profile.svg')!important}
  body.community-live-v5 .mobile-sticky-actions.ur-global-mobile-nav>a,
  body.community-live-v5 .mobile-sticky-actions.ur-global-mobile-nav>button{gap:2px!important}

  /* Match header bell asset without touching other Community pages. */
  body.community-live-v5 .ur-global-head-icon svg{display:none!important}
  body.community-live-v5 .ur-global-head-icon::before{
    content:""!important;width:20px!important;height:20px!important;display:block!important;background:currentColor!important;
    -webkit-mask:url('../ui/live-chat/icons/bell.svg') center/contain no-repeat!important;mask:url('../ui/live-chat/icons/bell.svg') center/contain no-repeat!important;
  }
}

@media(max-width:370px){
  body.community-live-v5 .urc-live-back-label{min-width:61px!important;font-size:7.8px!important}
  body.community-live-v5 .urc-live-title-icon{width:34px!important;height:34px!important}
  body.community-live-v5 .urc-live-title-copy h1{font-size:14px!important}
  body.community-live-v5 .urc-live-title-copy p{font-size:6.7px!important}
  body.community-live-v5 .urc-live-presence{min-width:69px!important;padding:0 7px!important}
  body.community-live-v5 .urc-live-presence b{font-size:8px!important}
  body.community-live-v5 .urc-live-mobile-safety{grid-template-columns:36px minmax(0,1fr)!important}
  body.community-live-v5 .urc-live-mobile-safety>a{display:none!important}
}

/* Desktop / tablet landscape implementation for the same Live Chat component set.
   Keeps the existing three-column Community shell and prevents mobile-only markup
   from falling back to unstyled browser defaults above 900px. */
@media (min-width:901px){
  body.community-live-v5 .urc-live-layout{
    max-width:1440px!important;
    display:grid!important;
    grid-template-columns:220px minmax(0,1fr) 260px!important;
    gap:12px!important;
    align-items:stretch!important;
    padding-top:12px!important;
  }
  body.community-live-v5 .urc-live-left,
  body.community-live-v5 .urc-live-right{min-width:0!important}

  body.community-live-v5 .urc-live-main{
    position:relative!important;
    height:calc(100vh - 155px)!important;
    min-height:610px!important;
    background:#fff!important;
    border:1px solid #dfeaf8!important;
    border-radius:14px!important;
    display:grid!important;
    grid-template-rows:auto auto auto auto minmax(0,1fr) auto!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  body.community-live-v5 .urc-live-header{
    min-height:70px!important;
    height:70px!important;
    padding:0 16px!important;
    border-bottom:1px solid #e6eef9!important;
    background:#fff!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
  }
  body.community-live-v5 .urc-live-header-title{
    display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;
  }
  body.community-live-v5 .urc-live-back-label,
  body.community-live-v5 .urc-live-header-divider{display:none!important}
  body.community-live-v5 .urc-live-title-icon{
    width:42px!important;height:42px!important;border-radius:12px!important;
    background:var(--ur-live-blue)!important;color:#fff!important;
    display:grid!important;place-items:center!important;flex:0 0 auto!important;
    box-shadow:0 5px 14px rgba(8,118,249,.14)!important;
  }
  body.community-live-v5 .urc-live-title-icon .ur-live-icon{font-size:24px!important}
  body.community-live-v5 .urc-live-title-copy h1{
    margin:0!important;color:var(--ur-live-navy)!important;
    font:800 24px/1.05 'Plus Jakarta Sans',Inter,system-ui,sans-serif!important;
    letter-spacing:-.45px!important;
  }
  body.community-live-v5 .urc-live-title-copy p{
    margin:4px 0 0!important;color:#667f9f!important;font:600 9px/1.2 Inter,system-ui,sans-serif!important;
  }
  body.community-live-v5 .urc-live-presence{
    display:flex!important;align-items:center!important;gap:7px!important;
    height:34px!important;padding:0 11px!important;border-radius:999px!important;
    background:#f3f9ff!important;border:1px solid #dce9f8!important;color:var(--ur-live-navy)!important;
    flex:0 0 auto!important;
  }
  body.community-live-v5 .urc-live-presence i{
    width:9px!important;height:9px!important;border-radius:50%!important;background:var(--ur-live-green)!important;
    box-shadow:0 0 0 4px rgba(22,191,104,.12)!important;
  }
  body.community-live-v5 .urc-live-presence b{font:800 10px/1 Inter,system-ui,sans-serif!important;white-space:nowrap!important}

  body.community-live-v5 .urc-live-mobile-safety{
    display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;
    margin:10px 12px 0!important;padding:10px 12px!important;min-height:66px!important;
    border:1px solid #d7e7f8!important;border-radius:12px!important;
    background:linear-gradient(100deg,#eef6ff 0%,#f9fcff 100%)!important;
  }
  body.community-live-v5 .urc-live-safety-icon{
    width:38px!important;height:38px!important;border-radius:10px!important;background:var(--ur-live-blue)!important;color:#fff!important;
    display:grid!important;place-items:center!important;
  }
  body.community-live-v5 .urc-live-safety-icon .ur-live-icon{font-size:22px!important}
  body.community-live-v5 .urc-live-mobile-safety p{margin:0!important;color:#526d91!important;font:600 9px/1.35 Inter,system-ui,sans-serif!important}
  body.community-live-v5 .urc-live-mobile-safety p b{display:block!important;margin-bottom:2px!important;color:#0b4fae!important;font-size:11px!important}
  body.community-live-v5 .urc-live-mobile-safety a{display:flex!important;align-items:center!important;gap:3px!important;color:#0876f9!important;text-decoration:none!important;font:800 9px/1 Inter!important;white-space:nowrap!important}
  body.community-live-v5 .urc-live-mobile-safety a .ur-live-icon{font-size:12px!important}

  body.community-live-v5 .urc-live-mobile-room{
    display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important;
    margin:9px 12px 0!important;padding:9px 12px!important;min-height:58px!important;
    border:1px solid #dce8f7!important;border-radius:12px!important;background:#f9fcff!important;
  }
  body.community-live-v5 .urc-live-room-icon{
    width:38px!important;height:38px!important;border-radius:10px!important;background:var(--ur-live-blue)!important;color:#fff!important;
    display:grid!important;place-items:center!important;
  }
  body.community-live-v5 .urc-live-room-icon .ur-live-icon{font-size:21px!important}
  body.community-live-v5 .urc-live-mobile-room p{margin:0!important;min-width:0!important}
  body.community-live-v5 .urc-live-mobile-room b{display:block!important;color:var(--ur-live-navy)!important;font:800 11px/1.15 Inter!important;margin-bottom:3px!important}
  body.community-live-v5 .urc-live-mobile-room span:not(.urc-live-room-icon):not(.ur-live-icon){display:block!important;color:#657d9d!important;font:600 9px/1.25 Inter!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  body.community-live-v5 .urc-live-mobile-topics{display:none!important}

  body.community-live-v5 .urc-live-joined{
    display:grid!important;grid-template-columns:minmax(30px,1fr) auto minmax(30px,1fr)!important;align-items:center!important;gap:10px!important;
    padding:8px 16px 6px!important;background:#fff!important;
  }
  body.community-live-v5 .urc-live-joined>span{height:1px!important;background:#b9d6fb!important}
  body.community-live-v5 .urc-live-joined>div{text-align:center!important;display:grid!important;gap:2px!important}
  body.community-live-v5 .urc-live-joined b{display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;color:#0876f9!important;font:800 9px/1 Inter!important}
  body.community-live-v5 .urc-live-joined small{color:#7a8fac!important;font:600 7.5px/1.2 Inter!important}
  body.community-live-v5 .urc-joined-icon{width:22px!important;height:22px!important;border-radius:50%!important;background:#e9f3ff!important;color:#0876f9!important;display:grid!important;place-items:center!important}
  body.community-live-v5 .urc-joined-icon .ur-live-icon{font-size:13px!important}

  body.community-live-v5 .urc-live-messages{
    position:relative!important;padding:10px 14px 16px!important;overflow-y:auto!important;
    background-color:#fbfdff!important;
    background-image:linear-gradient(rgba(251,253,255,.88),rgba(251,253,255,.88)),url('../ui/live-chat/doodles/live-chat-doodle-pattern.svg')!important;
    background-size:auto,520px 820px!important;background-repeat:repeat,repeat!important;background-position:center top!important;
    scrollbar-width:thin!important;overscroll-behavior:contain!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message{
    position:relative!important;display:grid!important;grid-template-columns:38px minmax(0,1fr)!important;gap:9px!important;
    margin:0 0 12px!important;align-items:start!important;
  }
  body.community-live-v5 .urc-live-messages .ur-community-avatar{
    width:38px!important;height:38px!important;border-radius:50%!important;border:2px solid #fff!important;overflow:hidden!important;
    display:grid!important;place-items:center!important;background:#e4effd!important;color:#0876f9!important;font:800 11px Inter!important;
    box-shadow:0 2px 8px rgba(20,60,110,.10)!important;
  }
  body.community-live-v5 .urc-live-messages .ur-community-avatar img{width:100%!important;height:100%!important;object-fit:cover!important}
  body.community-live-v5 .urc-message-body{min-width:0!important;width:auto!important;max-width:76%!important;background:transparent!important;border:0!important;padding:0!important}
  body.community-live-v5 .ur-chat-message-head{display:flex!important;align-items:center!important;gap:7px!important;min-height:22px!important;padding:0 3px 3px!important}
  body.community-live-v5 .ur-chat-message-head b{color:var(--ur-live-navy)!important;font:800 10px/1 Inter!important;white-space:nowrap!important}
  body.community-live-v5 .ur-chat-message-head time{margin:0!important;color:#7a8fac!important;font:600 8px/1 Inter!important;white-space:nowrap!important}
  body.community-live-v5 .urc-message-topic{margin-inline-start:auto!important;border-radius:999px!important;background:#dceeff!important;color:#0876f9!important;padding:4px 9px!important;font:700 7.5px/1 Inter!important;white-space:nowrap!important}
  body.community-live-v5 .ur9-chat-more,
  body.community-live-v5 .ur9-chat-more-preview{width:24px!important;height:24px!important;min-width:24px!important;padding:0!important;border:0!important;background:transparent!important;color:#0b4fae!important;display:grid!important;place-items:center!important}
  body.community-live-v5 .ur9-chat-more .ur-live-icon,
  body.community-live-v5 .ur9-chat-more-preview .ur-live-icon{font-size:15px!important}
  body.community-live-v5 .urc-message-bubble{
    width:fit-content!important;max-width:100%!important;padding:9px 11px!important;border:1px solid #e2ebf7!important;
    border-radius:6px 13px 13px 13px!important;background:rgba(255,255,255,.98)!important;color:var(--ur-live-text)!important;
    box-shadow:0 3px 12px rgba(31,78,133,.035)!important;
  }
  body.community-live-v5 .urc-message-bubble>p{margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;color:#173c70!important;font:500 10.5px/1.45 Inter!important}
  body.community-live-v5 .urc-chat-quote{position:relative!important;margin:-1px -1px 7px!important;padding:7px 8px 7px 13px!important;border:0!important;border-radius:7px!important;background:#edf5ff!important;overflow:hidden!important}
  body.community-live-v5 .urc-chat-quote::before{content:""!important;position:absolute!important;left:0!important;top:0!important;bottom:0!important;width:3px!important;background:#0876f9!important}
  body.community-live-v5 .urc-chat-quote b{display:flex!important;align-items:center!important;gap:4px!important;color:#0876f9!important;font:800 8.8px/1.1 Inter!important}
  body.community-live-v5 .urc-chat-quote span{display:block!important;margin-top:3px!important;color:#657d9d!important;font:600 8px/1.25 Inter!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  body.community-live-v5 .urc-live-message-actions{display:flex!important;align-items:center!important;gap:18px!important;padding:5px 5px 0!important}
  body.community-live-v5 .urc-live-message-actions button{min-height:19px!important;border:0!important;background:transparent!important;color:#0b61c9!important;display:flex!important;align-items:center!important;gap:4px!important;padding:0!important;font:700 8.8px/1 Inter!important;cursor:pointer!important}
  body.community-live-v5 .urc-live-message-actions button .ur-live-icon{font-size:13px!important}
  body.community-live-v5 .urc-translate-reserved{display:none!important}

  body.community-live-v5 .ur-chat-message.is-mine{grid-template-columns:minmax(0,1fr)!important;padding-left:25%!important}
  body.community-live-v5 .ur-chat-message.is-mine>.ur-community-avatar{display:none!important}
  body.community-live-v5 .ur-chat-message.is-mine .urc-message-body{margin-left:auto!important;max-width:100%!important}
  body.community-live-v5 .ur-chat-message.is-mine .urc-message-bubble{margin-left:auto!important;background:#eaf4ff!important;border-color:#cde3ff!important;border-radius:13px 6px 13px 13px!important}
  body.community-live-v5 .ur-chat-message.is-mine .urc-live-message-actions{justify-content:flex-end!important}

  body.community-live-v5 .urc-live-composer{
    position:static!important;left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;width:auto!important;margin:0!important;
    padding:8px 10px!important;border-top:1px solid #e3ebf6!important;background:#fff!important;box-shadow:none!important;z-index:auto!important;
  }
  body.community-live-v5 .urc-live-composer form{display:grid!important;grid-template-columns:42px minmax(0,1fr) 46px!important;gap:8px!important;align-items:center!important}
  body.community-live-v5 .urc-reply-preview,
  body.community-live-v5 .urc-privacy-error{grid-column:1/-1!important}
  body.community-live-v5 .urc-reply-preview{position:relative!important;padding:8px 32px 8px 12px!important;border-left:3px solid #0876f9!important;border-radius:8px!important;background:#eef6ff!important;color:#4e6b8f!important;font:600 8.4px/1.35 Inter!important}
  body.community-live-v5 .urc-reply-preview button{position:absolute!important;right:8px!important;top:50%!important;transform:translateY(-50%)!important;border:0!important;background:transparent!important;color:#5d7594!important;font-size:18px!important}
  body.community-live-v5 .urc-composer-tool{width:42px!important;height:42px!important;border-radius:50%!important;background:#f4f8fe!important;border:1px solid #dce8f7!important;color:#0876f9!important;display:grid!important;place-items:center!important;padding:0!important}
  body.community-live-v5 .urc-composer-tool .ur-live-icon{font-size:21px!important}
  body.community-live-v5 .urc-composer-field{height:42px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 30px 30px!important;align-items:center!important;border:1px solid #cbdcf0!important;border-radius:999px!important;background:#fff!important;overflow:hidden!important}
  body.community-live-v5 .urc-composer-field textarea{min-height:40px!important;max-height:78px!important;width:100%!important;border:0!important;padding:12px 8px 11px 15px!important;background:transparent!important;color:#173b72!important;font:500 10.5px/1.25 Inter!important;resize:none!important;outline:none!important}
  body.community-live-v5 .urc-composer-inline{width:30px!important;height:40px!important;border:0!important;background:transparent!important;color:#0a2f72!important;display:grid!important;place-items:center!important;padding:0!important}
  body.community-live-v5 .urc-composer-inline .ur-live-icon{font-size:18px!important}
  body.community-live-v5 .urc-composer-send{width:46px!important;height:46px!important;border-radius:50%!important;border:0!important;background:#0876f9!important;color:#fff!important;display:grid!important;place-items:center!important;padding:0!important;box-shadow:0 6px 14px rgba(8,118,249,.18)!important}
  body.community-live-v5 .urc-composer-send .ur-live-icon{font-size:21px!important}

  body.community-live-v5 .urc-live-right{display:grid!important;gap:12px!important;align-content:start!important}
}

/* Desktop message-flow hardening V3 — prevent fit-content/min-content collapse. */
@media (min-width:901px){
  body.community-live-v5 .urc-live-messages{
    display:block!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message:not(.is-mine) .urc-message-body{
    width:min(76%,760px)!important;
    max-width:min(76%,760px)!important;
    min-width:0!important;
    justify-self:start!important;
  }
  body.community-live-v5 .urc-live-messages .urc-message-bubble{
    display:inline-block!important;
    width:auto!important;
    min-width:96px!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    vertical-align:top!important;
  }
  body.community-live-v5 .urc-live-messages .urc-message-bubble>p{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    hyphens:none!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine{
    width:100%!important;
    max-width:none!important;
    padding-left:0!important;
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .urc-message-body{
    width:min(76%,760px)!important;
    max-width:min(76%,760px)!important;
    min-width:0!important;
    margin-left:0!important;
    justify-self:end!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .urc-message-bubble{
    float:right!important;
    clear:both!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .urc-live-message-actions{
    clear:both!important;
  }
}

/* ==========================================================
   Live Chat UX V4 — mobile topics, scrollable intro, live
   presence sheet, desktop message alignment, single nav.
   ========================================================== */

/* Wrapper is transparent to the existing desktop grid. */
body.community-live-v5 .urc-live-scroll-region{display:contents}

@media(max-width:900px){
  /* Keep one and only one bottom navigation on Live Chat. */
  body.community-live-v5 .ur-community-bottom-nav,
  body.community-live-v5 .ur-mobile-bottom-nav:not(.ur-global-mobile-nav){display:none!important}

  /* Header stays visible; safety/room/topics/joined now scroll with chat. */
  body.community-live-v5 .urc-live-main{
    grid-template-rows:auto minmax(0,1fr)!important;
  }
  body.community-live-v5 .urc-live-scroll-region{
    display:block!important;
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:none!important;
    background:#fff!important;
    padding-top:0!important;
    padding-bottom:74px!important;
  }
  body.community-live-v5 .urc-live-scroll-region::-webkit-scrollbar{display:none!important}
  body.community-live-v5 .urc-live-messages{
    overflow:visible!important;
    min-height:180px!important;
    padding-bottom:14px!important;
  }

  /* Mobile topic switching requested by owner. */
  body.community-live-v5 .urc-live-mobile-topics{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    margin:0!important;
    padding:1px 10px 9px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    background:#fff!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.community-live-v5 .urc-live-mobile-topics::-webkit-scrollbar{display:none!important}
  body.community-live-v5 .urc-live-mobile-topics button{
    flex:0 0 auto!important;
    min-height:30px!important;
    padding:0 11px!important;
    border:1px solid #dce8f7!important;
    border-radius:999px!important;
    background:#fff!important;
    color:#31577f!important;
    font:800 8px/1 Inter,system-ui,sans-serif!important;
    white-space:nowrap!important;
    cursor:pointer!important;
  }
  body.community-live-v5 .urc-live-mobile-topics button.active{
    border-color:#0876f9!important;
    background:#0876f9!important;
    color:#fff!important;
    box-shadow:0 4px 10px rgba(8,118,249,.14)!important;
  }

  /* Online pill becomes an interactive member-list trigger on mobile. */
  body.community-live-v5 .urc-live-presence{
    appearance:none!important;
    cursor:pointer!important;
  }
  body.community-live-v5 .urc-mobile-online-sheet[hidden]{display:none!important}
  body.community-live-v5 .urc-mobile-online-sheet{
    position:fixed!important;
    inset:0!important;
    z-index:9500!important;
    display:block!important;
  }
  body.community-live-v5 .urc-mobile-online-backdrop{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    border:0!important;
    background:rgba(5,27,66,.28)!important;
    backdrop-filter:blur(2px)!important;
  }
  body.community-live-v5 .urc-mobile-online-panel{
    position:absolute!important;
    left:8px!important;
    right:8px!important;
    bottom:calc(66px + env(safe-area-inset-bottom))!important;
    max-height:min(58vh,430px)!important;
    overflow:hidden!important;
    border:1px solid #dce8f7!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 22px 55px rgba(12,45,88,.22)!important;
  }
  body.community-live-v5 .urc-mobile-online-head{
    min-height:62px!important;
    padding:12px 14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    border-bottom:1px solid #e7eef8!important;
  }
  body.community-live-v5 .urc-mobile-online-head h2{margin:0!important;color:#0a2457!important;font:800 15px/1.1 Inter,system-ui,sans-serif!important}
  body.community-live-v5 .urc-mobile-online-head p{margin:4px 0 0!important;color:#7188a7!important;font:600 9px/1.2 Inter,system-ui,sans-serif!important}
  body.community-live-v5 .urc-mobile-online-head>button{
    width:34px!important;height:34px!important;border:0!important;border-radius:50%!important;background:#f1f6fc!important;color:#31577f!important;font:500 22px/1 Inter!important;
  }
  body.community-live-v5 .urc-mobile-online-list{
    max-height:calc(min(58vh,430px) - 62px)!important;
    overflow-y:auto!important;
    padding:6px 10px 10px!important;
  }
  body.community-live-v5 .urc-mobile-online-list>a{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) 9px!important;
    align-items:center!important;
    gap:9px!important;
    min-height:56px!important;
    padding:7px 5px!important;
    text-decoration:none!important;
    border-bottom:1px solid #edf2f8!important;
  }
  body.community-live-v5 .urc-mobile-online-list .ur-community-mini-avatar{width:38px!important;height:38px!important;border-radius:50%!important;overflow:hidden!important;display:grid!important;place-items:center!important;background:#e7f1fe!important;color:#0876f9!important;font:800 11px Inter!important}
  body.community-live-v5 .urc-mobile-online-list .ur-community-mini-avatar img{width:100%!important;height:100%!important;object-fit:cover!important}
  body.community-live-v5 .urc-mobile-online-list a span:nth-child(2){display:grid!important;gap:2px!important}
  body.community-live-v5 .urc-mobile-online-list a b{color:#0a2457!important;font:800 10px/1.1 Inter!important}
  body.community-live-v5 .urc-mobile-online-list a small{color:#7288a5!important;font:600 8px/1.1 Inter!important}
  body.community-live-v5 .urc-mobile-online-list a>i{width:8px!important;height:8px!important;border-radius:50%!important;background:#16bf68!important}
}

@media(min-width:901px){
  /* Mobile-only swipe indicator must never leak onto desktop. */
  body.community-live-v5 .urc-swipe-reply-indicator{display:none!important}
  body.community-live-v5 .urc-mobile-online-sheet{display:none!important}
  body.community-live-v5 .urc-live-presence{cursor:default!important}

  /* Own message header, bubble and actions stay together on the right. */
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .urc-message-body{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-end!important;
    width:min(68%,680px)!important;
    max-width:min(68%,680px)!important;
    justify-self:end!important;
    margin-left:0!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .ur-chat-message-head{
    width:auto!important;
    max-width:100%!important;
    align-self:flex-end!important;
    justify-content:flex-end!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .ur-chat-message-head .urc-message-topic{
    margin-inline-start:0!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .urc-message-bubble{
    float:none!important;
    clear:none!important;
    align-self:flex-end!important;
    margin-left:0!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message.is-mine .urc-live-message-actions{
    align-self:flex-end!important;
    justify-content:flex-end!important;
    clear:none!important;
  }
}

@media(min-width:901px){
  /* Safety / General / joined strip are part of chat history, not pinned chrome. */
  body.community-live-v5 .urc-live-main{
    grid-template-rows:auto minmax(0,1fr) auto!important;
  }
  body.community-live-v5 .urc-live-scroll-region{
    display:block!important;
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin!important;
    background:#fff!important;
  }
  body.community-live-v5 .urc-live-messages{
    overflow:visible!important;
    min-height:260px!important;
    padding-bottom:18px!important;
  }
}

/* ==========================================================
   Live Chat UX V5 hardening — single icons, context menu,
   attachments, topic empty states, reconnect + RTL/keyboard.
   ========================================================== */

/* The global shell has a higher-specificity svg display rule. Override it so
   the Live Chat asset-mask icon is the ONLY icon in each bottom-nav item. */
@media(max-width:900px){
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav svg{display:none!important}
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>a::before,
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>button::before{display:block!important;flex:0 0 20px!important}
  html body.community-live-v5 .ur-global-head-icon svg{display:none!important}

  /* When the software keyboard is open, use the full visual viewport for chat. */
  html body.community-live-v5.ur-live-keyboard-open{padding-bottom:0!important}
  html body.community-live-v5.ur-live-keyboard-open .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav{display:none!important}
  html body.community-live-v5.ur-live-keyboard-open .urc-live-composer{bottom:0!important}
}

body.community-live-v5 .urc-live-header-status{display:flex;align-items:center;gap:8px;min-width:0}
body.community-live-v5 .urc-live-connection{border-radius:999px;padding:5px 8px;background:#fff4e5;color:#9a6100;font:800 8px/1 Inter,system-ui,sans-serif;white-space:nowrap}
body.community-live-v5 .urc-live-connection[data-state="error"]{background:#fff0f0;color:#bf2c2c}
body.community-live-v5 .urc-live-connection[data-state="ok"]{background:#eaf9f1;color:#128852}

body.community-live-v5 .urc-topic-empty{margin:18px auto 22px;max-width:330px;padding:18px 16px;border:1px dashed #cbdcf1;border-radius:13px;background:rgba(248,251,255,.88);text-align:center}
body.community-live-v5 .urc-topic-empty b{display:block;color:#15386d;font:800 10px/1.25 Inter,system-ui,sans-serif}
body.community-live-v5 .urc-topic-empty span{display:block;margin-top:5px;color:#7186a3;font:500 8.5px/1.4 Inter,system-ui,sans-serif}

body.community-live-v5 .urc-chat-attachment{display:block;margin-top:7px;max-width:280px;border-radius:10px;overflow:hidden;border:1px solid #d9e6f6;background:#f6faff}
body.community-live-v5 .urc-chat-attachment img{display:block;width:100%;max-height:260px;object-fit:cover}

body.community-live-v5 .urc-composer-add-wrap{position:relative;display:grid;place-items:center;min-width:0}
body.community-live-v5 .urc-composer-add-menu{position:absolute;left:0;bottom:calc(100% + 8px);min-width:112px;padding:6px;border:1px solid #dbe7f6;border-radius:10px;background:#fff;box-shadow:0 10px 28px rgba(18,56,103,.14);z-index:6100}
body.community-live-v5 .urc-composer-add-menu button{width:100%;border:0;border-radius:7px;padding:9px 10px;background:#f5f9ff;color:#0b5fc9;text-align:left;font:800 9px/1 Inter,system-ui,sans-serif;cursor:pointer}
body.community-live-v5 .urc-attachment-preview{grid-column:1/-1;position:relative;min-width:0;padding:8px 31px 8px 11px;border:1px solid #d8e6f7;border-radius:8px;background:#f7fbff;color:#456585;font:700 8.4px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.community-live-v5 .urc-attachment-preview span{display:block;overflow:hidden;text-overflow:ellipsis}
body.community-live-v5 .urc-attachment-preview button{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#5d7594;font-size:18px;line-height:1;cursor:pointer}

/* True three-dot context menu. */
.urc-chat-context-menu{position:fixed;z-index:12000;padding:6px;border:1px solid #dbe5f3;border-radius:11px;background:#fff;box-shadow:0 16px 38px rgba(13,46,88,.18);display:grid;gap:2px}
.urc-chat-context-menu button{width:100%;border:0;border-radius:7px;background:transparent;padding:9px 10px;text-align:left;color:#15386d;font:700 10px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.urc-chat-context-menu button:hover,.urc-chat-context-menu button:focus-visible{background:#f1f7ff;outline:none}
.urc-chat-context-menu button[data-community-delete]{color:#bf2c2c}
.urc-chat-context-menu span{padding:8px 10px;color:#7489a5;font:600 9px Inter,system-ui,sans-serif}

body.community-live-v5 .urc-mobile-online-viewall{display:block;margin:4px 14px 14px;padding:10px;border-radius:9px;background:#f2f7ff;color:#0876f9;text-align:center;text-decoration:none;font:800 9px/1 Inter,system-ui,sans-serif}

/* Mixed Arabic/English content should choose direction from the actual message. */
body.community-live-v5 .urc-message-bubble>p[dir="auto"],
body.community-live-v5 .urc-chat-quote span[dir="auto"],
body.community-live-v5 .urc-composer-field textarea[dir="auto"]{text-align:start!important;unicode-bidi:plaintext}
html[dir="rtl"] body.community-live-v5 .urc-chat-quote::before{left:auto!important;right:0!important}
html[dir="rtl"] body.community-live-v5 .urc-chat-quote{padding-left:8px!important;padding-right:13px!important}
html[dir="rtl"] body.community-live-v5 .urc-composer-add-menu{left:auto;right:0}
html[dir="rtl"] body.community-live-v5 .urc-chat-context-menu button{text-align:right}

@media(max-width:900px){
  body.community-live-v5 .urc-live-connection{position:absolute;right:10px;top:54px;z-index:2;box-shadow:0 3px 10px rgba(18,56,103,.08)}
  body.community-live-v5 .urc-chat-attachment{max-width:230px}
  body.community-live-v5 .urc-topic-empty{margin:14px 12px 20px}
}

/* ==========================================================
   Live Chat UX V6 mobile polish — sticky topics + compact flow.
   Visual-only overrides. Backend/chat behavior intentionally unchanged.
   ========================================================== */
@media(max-width:900px){
  /* Only the horizontal topic switcher stays available while reading chat.
     Safety card, current-room card and join divider still scroll away normally. */
  body.community-live-v5 .urc-live-mobile-topics{
    position:sticky!important;
    top:0!important;
    z-index:35!important;
    margin:0!important;
    padding:7px 10px 7px!important;
    background:rgba(255,255,255,.97)!important;
    border-top:1px solid rgba(232,239,248,.72)!important;
    border-bottom:1px solid #e7eef8!important;
    box-shadow:0 5px 13px rgba(18,56,103,.045)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }
  body.community-live-v5 .urc-live-mobile-topics button{
    min-height:29px!important;
    height:29px!important;
    padding:0 10px!important;
    font-size:8.2px!important;
  }

  /* Make the conversation read like the approved compact mockup instead of
     large separated cards. */
  body.community-live-v5 .urc-live-messages{
    padding:7px 10px 14px!important;
  }
  body.community-live-v5 .urc-live-messages .ur-chat-message{
    gap:8px!important;
    margin:0 0 6px!important;
  }
  body.community-live-v5 .urc-live-messages .ur-community-avatar{
    width:36px!important;
    height:36px!important;
  }
  body.community-live-v5 .ur-chat-message-head{
    min-height:19px!important;
    gap:5px!important;
    padding:0 2px 2px!important;
  }
  body.community-live-v5 .ur-chat-message-head b{
    font-size:9.6px!important;
    max-width:112px!important;
  }
  body.community-live-v5 .ur-chat-message-head time{
    font-size:7.6px!important;
  }
  body.community-live-v5 .urc-message-topic{
    padding:3px 7px!important;
    font-size:7px!important;
  }
  body.community-live-v5 .ur9-chat-more,
  body.community-live-v5 .ur9-chat-more-preview{
    width:21px!important;
    height:21px!important;
    min-width:21px!important;
  }
  body.community-live-v5 .ur9-chat-more .ur-live-icon,
  body.community-live-v5 .ur9-chat-more-preview .ur-live-icon{
    font-size:14px!important;
  }
  body.community-live-v5 .urc-message-bubble{
    padding:7px 9px!important;
    border-radius:5px 12px 12px 12px!important;
  }
  body.community-live-v5 .urc-message-bubble>p{
    font-size:10px!important;
    line-height:1.38!important;
  }
  body.community-live-v5 .urc-chat-quote{
    margin:-1px -1px 5px!important;
    padding:6px 7px 6px 12px!important;
  }

  /* Compact single Helpful + Reply row, matching the visual reference. */
  body.community-live-v5 .urc-live-message-actions{
    gap:14px!important;
    min-height:18px!important;
    padding:3px 4px 0!important;
  }
  body.community-live-v5 .urc-live-message-actions button{
    min-height:18px!important;
    gap:3px!important;
    font-size:8.2px!important;
    line-height:1!important;
  }
  body.community-live-v5 .urc-live-message-actions button .ur-live-icon{
    font-size:12px!important;
  }

  /* Own messages remain compact on the right and do not create artificial
     empty vertical space between consecutive messages. */
  body.community-live-v5 .ur-chat-message.is-mine{
    padding-left:44px!important;
    margin-bottom:6px!important;
  }
  body.community-live-v5 .ur-chat-message.is-mine .urc-message-body{
    max-width:90%!important;
  }
  body.community-live-v5 .ur-chat-message.is-mine .urc-message-bubble{
    border-radius:12px 5px 12px 12px!important;
  }

  /* Keep enough clearance for the fixed composer without making each message
     look vertically stretched. */
  body.community-live-v5 .urc-live-scroll-region{
    padding-bottom:70px!important;
  }
}

/* ==========================================================
   Batch 1 final icon lock — 2026-10-07
   Use the approved inline global-shell SVG family on Live Chat too.
   This intentionally overrides the older V1 asset-mask navigation layer.
   ========================================================== */
@media(max-width:900px){
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav svg.ur-nav-icon{
    display:block!important;
    width:20px!important;
    height:20px!important;
    flex:0 0 20px!important;
  }
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>a::before,
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>button::before{
    content:none!important;
    display:none!important;
  }
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav .ur-nav-icon .active-shape{display:none!important}
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav .ur-nav-icon .inactive-shape{display:inline!important}
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>a.active .ur-nav-icon .active-shape,
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>button.active .ur-nav-icon .active-shape{display:inline!important}
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>a.active .ur-nav-icon .inactive-shape,
  html body.community-live-v5 .mobile-sticky-actions.ur-mobile-bottom-nav.ur-global-mobile-nav>button.active .ur-nav-icon .inactive-shape{display:none!important}
}
