/* LMe v733 profile/presence/upload owner; call controls now owned by call-ui-v608.css. */

/* Presence is owned by the avatar bounds. Avoid duplicated nested dots. */
body #participantProfileCard #participantProfileHero .profile-modal-avatar-shell,
body #chatProfileTrigger .chat-avatar-presence-shell {
  position: relative !important;
  overflow: visible !important;
  isolation: isolate !important;
}

body #participantProfileCard #participantProfilePresence {
  position: absolute !important;
  inset: auto 1px 1px auto !important;
  transform: none !important;
  width: 20px !important;
  min-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border: 3px solid #17131f !important;
  border-radius: 50% !important;
  background: var(--lme-status-offline, #2b2931) !important;
  box-shadow: none !important;
  z-index: 5 !important;
}

body #participantProfileCard #participantProfilePresence.is-online,
body #chatProfileTrigger #currentChatStatusDot.is-online {
  background: var(--lme-status-online, #d0bcff) !important;
}

body #participantProfileCard #participantProfilePresence > .profile-status-dot {
  display: none !important;
}

body #chatProfileTrigger .chat-avatar-presence-shell {
  min-height: 0 !important;
  line-height: 0 !important;
}

body #chatProfileTrigger #currentChatStatusDot {
  position: absolute !important;
  inset: auto 0 0 auto !important;
  transform: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  width: 12px !important;
  min-width: 12px !important;
  height: 12px !important;
  min-height: 12px !important;
  border: 2px solid #17131f !important;
  border-radius: 50% !important;
  background: var(--lme-status-offline, #2b2931) !important;
  box-shadow: none !important;
  z-index: 5 !important;
}

/* Mobile profile keeps its saved media visible while the DOM media layer catches up. */
@media (max-width: 920px), (pointer: coarse) {
  html body.profile-mobile-open.call-minimized-ui #participantProfileModal.profile-modal:not(.hidden) {
    padding-bottom: calc(148px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html body #participantProfileCard #participantProfileName {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.1 !important;
  }

  html body.profile-mobile-open #participantProfileCard.profile-modal-card,
  html body.mobile-ui #participantProfileCard.profile-modal-card,
  html body.embedded-webview #participantProfileCard.profile-modal-card {
    background:
      var(--profile-card-image, none) center / cover no-repeat,
      linear-gradient(135deg, var(--profile-gradient-from, #171321), var(--profile-gradient-to, #090912)) !important;
  }

  html body.profile-mobile-open #participantProfileCard .profile-modal-cover-refined,
  html body.mobile-ui #participantProfileCard .profile-modal-cover-refined,
  html body.embedded-webview #participantProfileCard .profile-modal-cover-refined {
    background:
      linear-gradient(180deg, rgba(5,5,10,.08), rgba(5,5,10,.55)),
      var(--profile-banner-image, none) center / cover no-repeat,
      radial-gradient(circle at 22% 12%, rgba(203,178,255,.22), transparent 34%),
      linear-gradient(135deg, rgba(34,30,46,.98), rgba(8,7,12,.98)) !important;
  }
}

/* Upload UI: final flat surface; no wide decorative gradient or moving shimmer. */
.composer-attachment-tray {
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(16,18,28,.92) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.composer-attachment-chip {
  gap: 10px !important;
  padding: 10px !important;
  background: rgba(255,255,255,.035) !important;
  border-color: rgba(255,255,255,.075) !important;
}

.composer-attachment-icon {
  background: rgba(108,84,235,.92) !important;
}

.composer-attachment-head button,
.composer-attachment-chip button {
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.045) !important;
}

.upload-progress-fill {
  background: linear-gradient(90deg, rgba(122,232,210,.88), rgba(144,183,255,.92)) !important;
  box-shadow: 0 0 8px rgba(144,183,255,.12) !important;
}

.upload-progress-fill::after {
  content: none !important;
  animation: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .upload-progress-fill {
    transition-duration: .01ms !important;
  }
}
