/* CampusHub Module 12.3 — Premium Communication & Profile UI
   Scope: chats, conversation, notifications, profile and account deletion only. */
:root{
  --ch-navy:#0b1733;--ch-navy-2:#102348;--ch-blue:#1677ff;--ch-blue-2:#2d8cff;
  --ch-teal:#15c6b5;--ch-bg:#f4f7fb;--ch-card:#fff;--ch-text:#13203a;--ch-muted:#6f7e96;
  --ch-line:#e5ebf3;--ch-soft-blue:#eef6ff;--ch-soft-teal:#ecfffb;
  --ch-shadow:0 14px 36px rgba(15,34,68,.08);--ch-shadow-soft:0 8px 24px rgba(15,34,68,.06);
}
body:has(.premium-communication){
  background:radial-gradient(circle at 10% 0%,rgba(45,140,255,.07),transparent 28%),radial-gradient(circle at 96% 8%,rgba(21,198,181,.055),transparent 25%),var(--ch-bg);
}
body:has(.premium-communication) .topbar{
  background:linear-gradient(135deg,var(--ch-navy) 0%,var(--ch-navy-2) 62%,#12345f 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;box-shadow:0 8px 24px rgba(11,23,51,.14)!important;
}
body:has(.premium-communication) .topbar a,body:has(.premium-communication) .topbar button,body:has(.premium-communication) .topbar i,
body:has(.premium-communication) .topbar .brand,body:has(.premium-communication) .topbar .brand-text,body:has(.premium-communication) .topbar .site-name,
body:has(.premium-communication) .topbar .app-name,body:has(.premium-communication) .topbar .topbar-title,body:has(.premium-communication) .topbar .logo-text{color:#fff!important}
body:has(.premium-communication) .topbar input[type=search],body:has(.premium-communication) .topbar input[type=text]{background:rgba(255,255,255,.97)!important;border-color:rgba(255,255,255,.22)!important;color:var(--ch-text)!important}
body:has(.premium-communication) .topbar input::placeholder{color:#7d899b!important}
body:has(.premium-communication) .topbar img{border-color:rgba(255,255,255,.82)!important}


/* Module 12.3.1 — Premium topbar action alignment hotfix
   Keep notification and avatar controls stable on communication/profile screens. */
body:has(.premium-communication) .topbar .topbar-right{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  flex:0 0 auto!important;
  min-width:max-content!important;
  white-space:nowrap!important;
}
body:has(.premium-communication) .topbar .icon-btn{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  padding:0!important;
  margin:0!important;
  flex:0 0 42px!important;
  overflow:visible!important;
  border-radius:13px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  box-shadow:0 5px 14px rgba(0,0,0,.10)!important;
  text-decoration:none!important;
  line-height:1!important;
}
body:has(.premium-communication) .topbar .icon-btn:hover{
  background:rgba(255,255,255,.17)!important;
  border-color:rgba(255,255,255,.25)!important;
  transform:translateY(-1px);
}
body:has(.premium-communication) .topbar .icon-btn i{
  display:block!important;
  margin:0!important;
  color:#fff!important;
  font-size:18px!important;
  line-height:1!important;
}
body:has(.premium-communication) .topbar .icon-btn .badge,
body:has(.premium-communication) .topbar .icon-btn .notification-count,
body:has(.premium-communication) .topbar .icon-btn .nav-badge,
body:has(.premium-communication) .topbar .icon-btn [data-count],
body:has(.premium-communication) .topbar .icon-btn [data-badge-count]{
  position:absolute!important;
  top:-6px!important;
  right:-6px!important;
  z-index:5!important;
  display:grid!important;
  place-items:center!important;
  min-width:19px!important;
  height:19px!important;
  padding:0 5px!important;
  border-radius:999px!important;
  border:2px solid var(--ch-navy)!important;
  background:#ef4444!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1!important;
  box-shadow:0 3px 8px rgba(239,68,68,.28)!important;
}
body:has(.premium-communication) .topbar .top-avatar{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  flex:0 0 42px!important;
  padding:0!important;
  margin:0!important;
  border-radius:50%!important;
  overflow:visible!important;
  text-decoration:none!important;
}
body:has(.premium-communication) .topbar .top-avatar img{
  display:block!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  min-height:42px!important;
  max-height:42px!important;
  margin:0!important;
  padding:0!important;
  border-radius:50%!important;
  object-fit:cover!important;
  object-position:center!important;
  border:2px solid rgba(255,255,255,.92)!important;
  background:#dbe4f0!important;
  box-shadow:0 5px 14px rgba(0,0,0,.16)!important;
}
body:has(.premium-communication) .topbar .brand-name{
  color:#fff!important;
}
body:has(.premium-communication) .topbar .brand-sub{
  color:#9fb1ca!important;
}
@media(max-width:767.98px){
  body:has(.premium-communication) .topbar .topbar-right{gap:8px!important}
  body:has(.premium-communication) .topbar .icon-btn,
  body:has(.premium-communication) .topbar .top-avatar,
  body:has(.premium-communication) .topbar .top-avatar img{
    width:40px!important;height:40px!important;min-width:40px!important;max-width:40px!important;min-height:40px!important;max-height:40px!important;
  }
  body:has(.premium-communication) .topbar .icon-btn{flex-basis:40px!important;border-radius:12px!important}
  body:has(.premium-communication) .topbar .top-avatar{flex-basis:40px!important}
  body:has(.premium-communication) .topbar .icon-btn i{font-size:17px!important}
}
.premium-communication{align-items:start;gap:18px}.premium-communication .main-content{min-width:0}
.premium-communication .card{border-color:var(--ch-line);box-shadow:var(--ch-shadow-soft)}
.premium-page-head{padding:18px 20px!important;background:linear-gradient(180deg,#fff,#fbfdff);border-bottom:1px solid var(--ch-line)!important}
.premium-page-title-group{display:flex;align-items:center;gap:13px;min-width:0}.premium-page-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(135deg,#eaf3ff,#e9fffa);color:var(--ch-blue);box-shadow:inset 0 0 0 1px #dfeaf6;font-size:1.05rem;flex:0 0 auto}.premium-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.premium-communication .btn{border-radius:13px!important;font-weight:750}.premium-communication .btn-primary{border-color:transparent!important;background:linear-gradient(135deg,var(--ch-blue),#2364e8)!important;box-shadow:0 8px 18px rgba(22,119,255,.18)}

/* Chats */
.premium-chats .chats-page-card{padding:0!important;overflow:hidden;border-radius:24px!important;background:#fff!important;box-shadow:var(--ch-shadow)!important}
.premium-chats #conversationListWrap{margin-top:0!important;padding:10px 12px 14px;background:#fff}.premium-chats .chats-sync-note{margin:12px 14px 4px!important}
.premium-chats .campus-chat-row{display:grid!important;grid-template-columns:54px minmax(0,1fr) auto!important;gap:12px!important;align-items:center!important;min-height:78px;padding:10px 12px!important;border-radius:18px!important;border:1px solid transparent!important;background:#fff!important;color:inherit!important;text-decoration:none!important;margin:2px 0!important;transition:background .17s ease,border-color .17s ease,transform .17s ease,box-shadow .17s ease}
.premium-chats .campus-chat-row:hover{background:#f8fbff!important;border-color:#e2ecf8!important;box-shadow:0 8px 20px rgba(15,34,68,.055);transform:translateY(-1px)}
.premium-chats .campus-chat-row:has(.chat-unread-badge){background:#f2f7ff!important}.premium-chats .campus-chat-avatar{width:54px!important;height:54px!important;min-width:54px!important;border-radius:50%!important;object-fit:cover!important;border:3px solid #fff!important;box-shadow:0 4px 13px rgba(15,34,68,.12)!important;margin:0!important}
.premium-chats .campus-chat-copy{min-width:0!important;margin:0!important}.premium-chats .campus-chat-name{display:flex!important;align-items:center!important;gap:5px!important;min-width:0}.premium-chats .campus-chat-name-text{font-size:.96rem!important;font-weight:800!important;color:var(--ch-text)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.premium-chats .campus-chat-username{margin-top:1px!important;color:#8a96a9!important;font-size:.76rem!important}.premium-chats .campus-chat-preview{margin-top:4px!important;color:#68768b!important;font-size:.84rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.premium-chats .campus-chat-side{display:flex!important;flex-direction:column!important;align-items:flex-end!important;gap:7px!important;min-width:52px}.premium-chats .campus-chat-time{font-size:.72rem!important;color:#8996a8!important;white-space:nowrap}.premium-chats .chat-unread-badge{min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--ch-blue)!important;color:#fff!important;display:inline-grid;place-items:center;font-size:.7rem;font-weight:800;box-shadow:0 4px 10px rgba(22,119,255,.25)}
.premium-chats .right-panel{background:linear-gradient(180deg,#fff,#f9fbff);border:1px solid var(--ch-line);border-radius:22px;padding:20px;box-shadow:var(--ch-shadow-soft)}

/* Conversation */
.premium-conversation .main-content{overflow:hidden}.premium-conversation .chat-shell{gap:14px!important}.premium-conversation .chat-main-card,.premium-conversation .chat-side-card{border:1px solid var(--ch-line)!important;border-radius:24px!important;background:#fff!important;box-shadow:var(--ch-shadow)!important;overflow:hidden}
.premium-conversation .chat-header{background:linear-gradient(135deg,#fbfdff,#f4f8ff)!important;border-bottom:1px solid var(--ch-line)!important;padding:14px 16px!important}.premium-conversation .chat-back{width:40px!important;height:40px!important;border-radius:14px!important;background:#fff!important;border:1px solid #e5ebf3!important;color:var(--ch-navy)!important}.premium-conversation .chat-peer img{width:48px!important;height:48px!important;border:3px solid #fff!important;box-shadow:0 4px 13px rgba(15,34,68,.12)!important}.premium-conversation .chat-peer strong{font-size:1rem;color:var(--ch-text)}.premium-chat-status{margin-top:3px;font-size:.7rem;color:#748198;display:flex;align-items:center;gap:5px}.premium-chat-status span{width:7px;height:7px;border-radius:50%;background:#18b981;box-shadow:0 0 0 3px rgba(24,185,129,.1)}.premium-conversation .chat-refresh{border:1px solid #e1e8f1!important;background:#fff!important;color:#30405a!important;border-radius:13px!important}
.premium-conversation .conversation-message-wrap{background:linear-gradient(180deg,#f7faff 0%,#fbfcfe 100%)!important;padding:16px!important;scrollbar-width:thin;scrollbar-color:#c8d3e2 transparent}.premium-conversation .message-date-separator{background:#eaf1fb!important;color:#67768c!important;border-radius:999px!important;padding:5px 11px!important;font-weight:750!important;font-size:.72rem!important}.premium-conversation .message-bubble{border-radius:18px!important;box-shadow:0 4px 10px rgba(15,34,68,.04)!important;line-height:1.5!important}.premium-conversation .message-bubble.mine{background:linear-gradient(135deg,#1778ff,#2b6bea)!important;color:#fff!important;border-bottom-right-radius:6px!important}.premium-conversation .message-bubble.theirs{background:#fff!important;color:#24334c!important;border:1px solid #e4ebf4!important;border-bottom-left-radius:6px!important}.premium-conversation .message-bubble.mine .muted{color:rgba(255,255,255,.74)!important}.premium-conversation .message-avatar{width:34px!important;height:34px!important;box-shadow:0 3px 10px rgba(15,34,68,.11)}
.premium-conversation .chat-input-wrap{background:#fff!important;border-top:1px solid var(--ch-line)!important;padding:12px 14px 13px!important;box-shadow:0 -8px 22px rgba(15,34,68,.035)!important}.premium-conversation .chat-input{border:1px solid #dde6f1!important;background:#f8fafc!important;border-radius:17px!important;min-height:46px!important;padding:12px 14px!important;box-shadow:none!important}.premium-conversation .chat-input:focus{border-color:#a6c9fb!important;background:#fff!important;box-shadow:0 0 0 4px rgba(22,119,255,.075)!important}.premium-conversation .chat-send{height:46px!important;min-width:50px!important;border-radius:16px!important;border:0!important;background:linear-gradient(135deg,var(--ch-blue),#2364e8)!important;box-shadow:0 8px 18px rgba(22,119,255,.2)!important}.premium-conversation .chat-side-head{padding:17px!important;background:linear-gradient(180deg,#fff,#f8fbff)!important;border-bottom:1px solid var(--ch-line)!important}.premium-conversation .chat-side-head h3{color:var(--ch-navy)!important}.premium-conversation .chat-friend-list{padding:9px!important}.premium-conversation .chat-friend-card{border-radius:17px!important;padding:9px 10px!important;border:1px solid transparent!important;margin-bottom:4px!important;transition:.17s ease}.premium-conversation .chat-friend-card:hover{background:#f7faff!important;border-color:#e3ebf5!important}.premium-conversation .chat-friend-card.active{background:linear-gradient(135deg,#0d1d3e,#112950)!important;box-shadow:0 8px 20px rgba(11,23,51,.12)}

/* Notifications */
.premium-notifications .notifications-page-card{border-radius:24px!important;box-shadow:var(--ch-shadow)!important}.premium-notifications .notifications-page-head{padding:18px 20px!important;background:linear-gradient(180deg,#fff,#fbfdff)!important}.premium-notifications .notifications-page-title{font-size:1.35rem!important;color:var(--ch-navy)!important;font-weight:850!important}.premium-notifications .notification-list{padding:8px 10px 12px;gap:4px}.premium-notifications .notification-item{border:1px solid transparent!important;border-bottom:0!important;border-radius:18px!important;overflow:hidden;margin:0!important;background:#fff!important}.premium-notifications .notification-item.is-unread{background:linear-gradient(90deg,#eef6ff 0%,#f8fbff 100%)!important;border-color:#deebfb!important}.premium-notifications .notification-item:hover{background:#f8fbff!important;border-color:#e3ebf5!important}.premium-notifications .notification-main-link{padding:12px 14px!important;min-height:78px!important}.premium-notifications .notification-avatar{border:3px solid #fff!important;box-shadow:0 4px 12px rgba(15,34,68,.1)}.premium-notifications .notification-type-icon{box-shadow:0 3px 9px rgba(15,34,68,.12)}.premium-notifications .notification-message{color:#25344c!important}.premium-notifications .notification-item.is-unread .notification-message{font-weight:650!important}.premium-notifications .notification-unread-dot{width:9px!important;height:9px!important;box-shadow:0 0 0 4px rgba(24,119,255,.08)}.premium-notifications .right-panel{background:linear-gradient(180deg,#fff,#f9fbff);border:1px solid var(--ch-line);border-radius:22px;padding:20px;box-shadow:var(--ch-shadow-soft)}

/* Profile */
.premium-profile .profile-header-card{border-radius:26px!important;border:1px solid var(--ch-line)!important;box-shadow:var(--ch-shadow)!important;overflow:hidden!important}.premium-profile .profile-no-cover-top{position:relative;padding:26px!important;background:linear-gradient(135deg,#0b1733 0%,#102348 64%,#13416b 100%)!important;border-bottom:0!important}.premium-profile .profile-no-cover-top:after{content:'';position:absolute;right:-70px;top:-100px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(21,198,181,.18),transparent 67%);pointer-events:none}.premium-profile .profile-avatar-large{width:138px!important;height:138px!important;border-radius:34px!important;border:5px solid rgba(255,255,255,.96)!important;box-shadow:0 20px 42px rgba(0,0,0,.24)!important}.premium-profile .profile-avatar-view-btn{background:#fff!important;color:var(--ch-navy)!important;box-shadow:0 8px 18px rgba(0,0,0,.18)!important}.premium-profile .profile-title-grow h2{color:#fff!important;font-size:31px!important}.premium-profile .profile-title-grow>.muted{color:#b9c8df!important}.premium-profile .profile-bio-text{color:#e3eaf5!important}.premium-profile .profile-bio-text.muted{color:#b9c8df!important}.premium-profile .profile-photo-tip{color:#9fb1ca!important}.premium-profile .profile-main-actions .btn-light{background:rgba(255,255,255,.1)!important;color:#fff!important;border-color:rgba(255,255,255,.17)!important}.premium-profile .profile-main-actions .btn-primary{background:linear-gradient(135deg,#1d7cff,#20a4f3)!important}.premium-profile .profile-stats-inline-card{border-radius:20px!important;padding:16px 20px!important;background:#fff!important}.premium-profile .profile-stats-inline{justify-content:space-around!important;gap:8px!important}.premium-profile .profile-stats-inline-item,.premium-profile .profile-stats-inline-btn{flex:1 1 0;justify-content:center!important;padding:6px 12px!important;border-right:1px solid #edf1f6!important}.premium-profile .profile-stats-inline>*:last-child{border-right:0!important}.premium-profile .profile-stats-inline strong{color:var(--ch-navy)!important;font-size:23px!important}.premium-profile .profile-membership-card{border-color:#e4ebf4!important;background:linear-gradient(180deg,#fff,#fbfdff)!important;box-shadow:0 5px 14px rgba(15,34,68,.035);transition:.17s ease}.premium-profile .profile-membership-card:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(15,34,68,.07)}.premium-profile .main-content>section.card:not(.profile-header-card){border-radius:22px!important}.premium-profile .profile-side-card{border-radius:22px!important;box-shadow:var(--ch-shadow-soft)!important}.premium-profile .profile-side-note{background:linear-gradient(135deg,#eef6ff,#effcf9)!important;border-color:#dce9f7!important}.premium-profile .account-danger-card{box-shadow:none!important;border-color:#fee2e2!important}.premium-profile .mobile-logout-card{box-shadow:none!important}

/* Account deletion */
.premium-account-deletion .account-delete-card{border-color:var(--ch-line)!important;box-shadow:var(--ch-shadow)!important;border-radius:26px!important}.premium-account-deletion .account-delete-icon{background:linear-gradient(135deg,#fff0f2,#fff7f7)!important;box-shadow:inset 0 0 0 1px #fee2e2}.premium-account-deletion .account-delete-card h1{color:var(--ch-navy)!important;letter-spacing:-.025em}.premium-account-deletion .delete-note{border-radius:17px!important}.premium-account-deletion .delete-pending{border-radius:17px!important}

@media(max-width:767.98px){
  body:has(.premium-communication) .topbar{background:linear-gradient(135deg,#0b1733,#102348 65%,#12345f)!important}
  .premium-page-head{padding:14px!important;align-items:flex-start!important}.premium-page-title-group{gap:10px}.premium-page-icon{width:40px;height:40px;border-radius:13px}.premium-head-actions .btn-primary{padding-inline:11px!important}.premium-head-actions .btn-light{width:40px!important;height:40px!important;padding:0!important;font-size:0!important;display:grid!important;place-items:center!important}.premium-head-actions .btn-light i{font-size:.9rem!important}
  .premium-chats .chats-page-card,.premium-notifications .notifications-page-card{border-radius:0!important;border-left:0!important;border-right:0!important;box-shadow:none!important}.premium-chats #conversationListWrap{padding:6px 8px 12px}.premium-chats .campus-chat-row{grid-template-columns:50px minmax(0,1fr) auto!important;gap:10px!important;padding:9px 8px!important;min-height:72px}.premium-chats .campus-chat-avatar{width:50px!important;height:50px!important;min-width:50px!important}.premium-chats .campus-chat-preview{font-size:.81rem!important}.premium-chats .campus-chat-time{font-size:.68rem!important}
  .premium-conversation .chat-main-card{border-radius:0!important;border-left:0!important;border-right:0!important;box-shadow:none!important}.premium-conversation .chat-header{padding:10px 11px!important}.premium-conversation .conversation-message-wrap{padding:12px 10px!important}.premium-conversation .chat-input-wrap{padding:9px 10px calc(9px + env(safe-area-inset-bottom,0px))!important}.premium-conversation .chat-refresh{width:40px;height:40px;padding:0!important;font-size:0!important}.premium-conversation .chat-refresh i{font-size:.9rem!important}.premium-conversation .chat-peer img{width:43px!important;height:43px!important}.premium-chat-status{display:none}
  .premium-notifications .notification-list{padding:5px 6px 10px}.premium-notifications .notification-item{border-radius:15px!important}.premium-notifications .notification-main-link{padding:10px 9px!important}.premium-notifications .notifications-head-actions #refreshNotificationsBtn{width:40px;height:40px;padding:0!important;font-size:0!important}.premium-notifications .notifications-head-actions #refreshNotificationsBtn i{font-size:.9rem!important}
  .premium-profile .profile-no-cover-top{padding:22px 16px!important}.premium-profile .profile-avatar-large{width:128px!important;height:128px!important;border-radius:32px!important}.premium-profile .profile-title-grow h2{font-size:26px!important}.premium-profile .profile-stats-inline-card{margin-left:10px!important;margin-right:10px!important}.premium-profile .profile-stats-inline strong{font-size:20px!important}.premium-profile .profile-stats-inline span{font-size:12px!important}.premium-profile .profile-stats-inline-item,.premium-profile .profile-stats-inline-btn{padding:5px 6px!important}.premium-profile .main-content>section.card:not(.profile-header-card){margin-left:10px!important;margin-right:10px!important}.premium-profile .account-danger-card,.premium-profile .mobile-logout-card{margin-bottom:12px!important}
}

/* ============================================================
   Module 12.3.2 — Conversation avatar / bubble layout correction
   The visual target is the store-art direction: incoming avatars
   live beside the bubble, never underneath or inside the bubble.
   ============================================================ */
.premium-conversation .messages-area{
  gap:10px!important;
}

/* The outer message row is layout only. Do not paint the entire row. */
.premium-conversation .message-bubble,
.premium-conversation .message-bubble.mine,
.premium-conversation .message-bubble.theirs{
  display:flex!important;
  align-items:flex-end!important;
  gap:9px!important;
  width:fit-content!important;
  max-width:min(84%,720px)!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}

.premium-conversation .message-bubble.mine{
  align-self:flex-end!important;
  justify-content:flex-end!important;
  margin-left:auto!important;
}

.premium-conversation .message-bubble.theirs{
  align-self:flex-start!important;
  justify-content:flex-start!important;
  margin-right:auto!important;
}

/* Incoming sender photo is a true peer of the bubble. */
.premium-conversation .message-avatar-link{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  margin:0 0 2px 0!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  overflow:visible!important;
  position:relative!important;
  z-index:2!important;
  text-decoration:none!important;
}

.premium-conversation .message-avatar{
  display:block!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  flex:0 0 38px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  object-position:center!important;
  border:3px solid #fff!important;
  background:#e8eef7!important;
  box-shadow:0 4px 12px rgba(15,34,68,.15)!important;
  margin:0!important;
  position:static!important;
  transform:none!important;
}

/* Paint only the content bubble. */
.premium-conversation .message-content{
  width:fit-content!important;
  min-width:0!important;
  max-width:100%!important;
  padding:10px 13px!important;
  border-radius:18px!important;
  box-shadow:0 4px 12px rgba(15,34,68,.055)!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}

.premium-conversation .message-bubble.theirs .message-content{
  background:#fff!important;
  color:#24334c!important;
  border:1px solid #e1e9f3!important;
  border-bottom-left-radius:7px!important;
}

.premium-conversation .message-bubble.mine .message-content{
  background:linear-gradient(135deg,#1778ff,#2468ea)!important;
  color:#fff!important;
  border:0!important;
  border-bottom-right-radius:7px!important;
  box-shadow:0 7px 18px rgba(22,119,255,.17)!important;
}

.premium-conversation .message-text{
  font-size:14px!important;
  line-height:1.48!important;
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
}

.premium-conversation .chat-message-state{
  display:block!important;
  margin-top:4px!important;
  font-size:11px!important;
  line-height:1.2!important;
}

.premium-conversation .message-bubble.theirs .chat-message-state{
  color:#8190a5!important;
}

.premium-conversation .message-bubble.mine .chat-message-state{
  color:rgba(255,255,255,.76)!important;
}

@media(max-width:767.98px){
  .premium-conversation .message-bubble,
  .premium-conversation .message-bubble.mine,
  .premium-conversation .message-bubble.theirs{
    max-width:91%!important;
    gap:7px!important;
  }
  .premium-conversation .message-avatar-link,
  .premium-conversation .message-avatar{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    flex-basis:34px!important;
  }
  .premium-conversation .message-content{
    padding:9px 11px!important;
    border-radius:17px!important;
  }
  .premium-conversation .message-text{
    font-size:13.5px!important;
  }
}