.pharmora-message-receipt {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  color: #8a98ad;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: -0.12em;
  line-height: 1;
  vertical-align: baseline;
}

.pharmora-message-receipt.is-read {
  color: #3f6ea8;
}

.pharmora-ticket-message-card,
.pharmora-message-own,
.pharmora-message-opponent {
  box-sizing: border-box !important;
  width: min(720px, calc(100% - 24px)) !important;
  max-width: min(720px, calc(100% - 24px)) !important;
  flex: 0 1 min(720px, calc(100% - 24px)) !important;
}

.pharmora-message-own {
  margin-left: auto !important;
  margin-right: 0 !important;
}

.pharmora-message-opponent {
  margin-left: 0 !important;
  margin-right: auto !important;
}

.pharmora-message-own.ml-4,
.pharmora-message-own.mr-4,
.pharmora-message-opponent.ml-4,
.pharmora-message-opponent.mr-4 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.pharmora-message-own {
  justify-self: end !important;
}

.pharmora-message-opponent {
  justify-self: start !important;
}

.pharmora-message-own > .flex.items-center.justify-between.mb-1,
.pharmora-message-opponent > .flex.items-center.justify-between.mb-1,
.pharmora-message-own > header,
.pharmora-message-opponent > header,
.pharmora-message-own > .message-card-meta,
.pharmora-message-opponent > .message-card-meta,
.pharmora-message-own > p,
.pharmora-message-opponent > p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-indent: 0 !important;
}

.pharmora-ticket-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 22px !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  text-wrap: nowrap !important;
  transition: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  caret-color: transparent !important;
}

.pharmora-ticket-status-pill:hover,
.pharmora-ticket-status-pill:focus,
.pharmora-ticket-status-pill:active,
.pharmora-ticket-status-pill[class*="hover\\:bg"]:hover {
  background-color: var(--pharmora-status-bg, currentColor) !important;
  filter: none !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

.pharmora-ticket-status-pill > span,
.pharmora-ticket-status-pill > strong,
.pharmora-ticket-status-pill > b {
  background: transparent !important;
  box-shadow: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

.pharmora-ticket-status-pill::selection,
.pharmora-ticket-status-pill *::selection {
  background: transparent !important;
  color: inherit !important;
}

.pharmora-route-admin button[role="combobox"]:has(.pharmora-ticket-status-pill),
.pharmora-route-admin button[role="combobox"]:has(.pharmora-ticket-status-pill) *,
.pharmora-route-tickets .pharmora-ticket-status-pill,
.pharmora-route-tickets .pharmora-ticket-status-pill * {
  -webkit-user-select: none !important;
  user-select: none !important;
}

.pharmora-ticket-status-pill.bg-muted,
.pharmora-ticket-status-pill[class*="bg-muted"] {
  --pharmora-status-bg: hsl(var(--muted, 210 40% 96.1%));
}

.pharmora-ticket-status-pill.bg-primary,
.pharmora-ticket-status-pill[class*="bg-primary"] {
  --pharmora-status-bg: hsl(var(--primary, 214 45% 45%));
}

[role="listbox"]:has(.pharmora-ticket-status-pill),
[data-radix-select-content]:has(.pharmora-ticket-status-pill),
[data-radix-select-viewport]:has(.pharmora-ticket-status-pill),
[data-slot="select-content"]:has(.pharmora-ticket-status-pill),
[data-slot="select-viewport"]:has(.pharmora-ticket-status-pill),
[data-radix-popper-content-wrapper] [role="listbox"]:has(.pharmora-ticket-status-pill) {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  width: min(280px, calc(100vw - 32px)) !important;
  min-width: min(280px, calc(100vw - 32px)) !important;
  max-width: min(280px, calc(100vw - 32px)) !important;
  gap: 6px !important;
}

[role="option"]:has(.pharmora-ticket-status-pill),
[data-radix-select-item]:has(.pharmora-ticket-status-pill),
[data-slot="select-item"]:has(.pharmora-ticket-status-pill),
[data-radix-collection-item]:has(.pharmora-ticket-status-pill) {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 0 !important;
}

[role="option"]:has(.pharmora-ticket-status-pill) .pharmora-ticket-status-pill,
[data-radix-select-item]:has(.pharmora-ticket-status-pill) .pharmora-ticket-status-pill,
[data-slot="select-item"]:has(.pharmora-ticket-status-pill) .pharmora-ticket-status-pill,
[data-radix-collection-item]:has(.pharmora-ticket-status-pill) .pharmora-ticket-status-pill {
  width: 100% !important;
  max-width: 100% !important;
  justify-content: flex-start !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

.pharmora-ticket-list-grouped {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.pharmora-route-admin .ticket-list,
.pharmora-route-admin .ticket-list.pharmora-ticket-list-grouped {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
}

.pharmora-route-admin .ticket-list > .ticket-row {
  width: 100% !important;
  min-width: 0 !important;
}

.pharmora-route-tickets .ticket-row,
.pharmora-route-tickets .ticket-row *,
.pharmora-route-tickets .pharmora-ticket-card,
.pharmora-route-tickets .pharmora-ticket-card *,
.pharmora-route-admin .ticket-list > .ticket-row,
.pharmora-route-admin .ticket-list > .ticket-row *,
.pharmora-route-admin .pharmora-ticket-card,
.pharmora-route-admin .pharmora-ticket-card *,
.pharmora-ticket-status-pill,
.pharmora-ticket-status-pill * {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;
  caret-color: transparent !important;
}

.pharmora-route-tickets .ticket-row::selection,
.pharmora-route-tickets .ticket-row *::selection,
.pharmora-route-tickets .pharmora-ticket-card::selection,
.pharmora-route-tickets .pharmora-ticket-card *::selection,
.pharmora-route-admin .ticket-list > .ticket-row::selection,
.pharmora-route-admin .ticket-list > .ticket-row *::selection,
.pharmora-route-admin .pharmora-ticket-card::selection,
.pharmora-route-admin .pharmora-ticket-card *::selection,
.pharmora-ticket-status-pill::selection,
.pharmora-ticket-status-pill *::selection {
  background: transparent !important;
  color: inherit !important;
}

.pharmora-route-tickets .pharmora-ticket-card [class*="hover:bg-primary/80"]:hover,
.pharmora-route-tickets .pharmora-ticket-card [class*="hover\\:bg-primary\\/80"]:hover,
.pharmora-route-admin .pharmora-ticket-card [class*="hover:bg-primary/80"]:hover,
.pharmora-route-admin .pharmora-ticket-card [class*="hover\\:bg-primary\\/80"]:hover {
  background-color: hsl(var(--primary, 214 45% 45%) / 0.1) !important;
  color: hsl(var(--primary, 214 45% 45%)) !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
}

.pharmora-route-tickets .ticket-row:hover,
.pharmora-route-tickets button.ticket-row:hover,
.pharmora-route-tickets .pharmora-ticket-card:hover,
.pharmora-route-tickets .pharmora-ticket-card.hover\:shadow-card-hover:hover,
.pharmora-route-tickets button:has(.pharmora-ticket-status-pill):hover,
.pharmora-route-tickets .ticket-row:focus,
.pharmora-route-tickets .ticket-row:focus-visible,
.pharmora-route-tickets .ticket-row:active,
.pharmora-route-tickets .pharmora-ticket-card:focus,
.pharmora-route-tickets .pharmora-ticket-card:focus-visible,
.pharmora-route-tickets .pharmora-ticket-card:active,
.pharmora-route-admin .ticket-list > .ticket-row:hover,
.pharmora-route-admin .pharmora-ticket-card:hover,
.pharmora-route-admin .pharmora-ticket-card.hover\:shadow-card-hover:hover,
.pharmora-route-admin .ticket-list > .ticket-row:focus,
.pharmora-route-admin .ticket-list > .ticket-row:focus-visible,
.pharmora-route-admin .ticket-list > .ticket-row:active,
.pharmora-route-admin .pharmora-ticket-card:focus,
.pharmora-route-admin .pharmora-ticket-card:focus-visible,
.pharmora-route-admin .pharmora-ticket-card:active,
.pharmora-route-admin button:has(.pharmora-ticket-status-pill):hover {
  background-color: hsl(var(--card, 0 0% 100%)) !important;
  box-shadow: none !important;
  outline: none !important;
}

.pharmora-ticket-group-heading {
  width: 100% !important;
  margin: 8px 0 0 !important;
  color: #315481 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
}

.pharmora-ticket-group-heading.is-closed {
  margin-top: 14px !important;
  padding-top: 12px !important;
  border-top: 1px solid #e3e8f2 !important;
  color: #68758d !important;
}

.pharmora-ticket-card-active {
  order: 10 !important;
}

.pharmora-ticket-card-closed {
  order: 30 !important;
}

@media (max-width: 480px) {
  .pharmora-ticket-message-card,
  .pharmora-message-own,
  .pharmora-message-opponent {
    width: min(100%, calc(100vw - 64px)) !important;
    max-width: min(100%, calc(100vw - 64px)) !important;
    flex-basis: min(100%, calc(100vw - 64px)) !important;
    padding: 12px !important;
  }

  .pharmora-message-own > .flex.items-center.justify-between.mb-1,
  .pharmora-message-opponent > .flex.items-center.justify-between.mb-1,
  .pharmora-message-own > header,
  .pharmora-message-opponent > header,
  .pharmora-message-own > .message-card-meta,
  .pharmora-message-opponent > .message-card-meta,
  .message-card-meta,
  .message-card header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    justify-items: start !important;
    justify-content: start !important;
    gap: 2px !important;
    min-width: 0 !important;
  }

  .pharmora-message-own > .flex.items-center.justify-between.mb-1 > *,
  .pharmora-message-opponent > .flex.items-center.justify-between.mb-1 > *,
  .pharmora-message-own > header > *,
  .pharmora-message-opponent > header > *,
  .pharmora-message-own > .message-card-meta > *,
  .pharmora-message-opponent > .message-card-meta > *,
  .message-card-meta > *,
  .message-card header > * {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .message-card-meta strong,
  .message-card header strong {
    overflow-wrap: anywhere !important;
    line-height: 1.25 !important;
  }

  .message-card-meta span,
  .message-card header time,
  .message-card header span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    color: #68758d !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
  }

  .pharmora-message-receipt,
  .message-receipt {
    flex: 0 0 auto !important;
    margin-left: 6px !important;
  }

  .pharmora-ticket-status-pill {
    max-width: calc(100vw - 64px) !important;
    min-height: 34px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
  }

  .pharmora-route-tickets .ticket-thread > .muted-text,
  .pharmora-route-tickets .ticket-thread > p:first-child,
  .pharmora-route-tickets .space-y-4 > .flex.items-center.gap-2.text-sm.text-muted-foreground {
    display: block !important;
    max-width: 100% !important;
    color: #68758d !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .pharmora-route-tickets .ticket-thread > .muted-text .pharmora-ticket-status-pill,
  .pharmora-route-tickets .ticket-thread > p:first-child .pharmora-ticket-status-pill,
  .pharmora-route-tickets .space-y-4 > .flex.items-center.gap-2.text-sm.text-muted-foreground .pharmora-ticket-status-pill {
    display: flex !important;
    width: fit-content !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
  }

  .pharmora-route-tickets .pharmora-ticket-meta-text {
    display: block !important;
    max-width: 100% !important;
    color: #68758d !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
  }

  .pharmora-route-admin .flex.items-center.justify-between:has(.pharmora-ticket-status-pill),
  .pharmora-route-admin .pharmora-ticket-status-row,
  .pharmora-route-admin .rounded-xl.border.bg-card > div:first-child,
  .pharmora-route-admin .rounded-xl.border.bg-card > .flex.items-center.justify-between:has(.pharmora-ticket-status-pill) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
    justify-items: start !important;
    justify-content: start !important;
    width: 100% !important;
    gap: 10px !important;
  }

  .pharmora-route-admin .flex.items-center.justify-between:has(.pharmora-ticket-status-pill) > * {
    min-width: 0 !important;
  }

  .pharmora-route-admin .pharmora-ticket-status-row > * {
    min-width: 0 !important;
  }

  .pharmora-route-admin .flex.items-center.justify-between:has(.pharmora-ticket-status-pill) a,
  .pharmora-route-admin .flex.items-center.justify-between:has(.pharmora-ticket-status-pill) button:not(.pharmora-ticket-status-pill),
  .pharmora-route-admin .pharmora-ticket-status-row a,
  .pharmora-route-admin .pharmora-ticket-status-row button:not(.pharmora-ticket-status-pill) {
    width: fit-content !important;
    white-space: nowrap !important;
  }

  .pharmora-route-admin .flex.items-center.justify-between:has(.pharmora-ticket-status-pill) .pharmora-ticket-status-pill,
  .pharmora-route-admin .pharmora-ticket-status-row .pharmora-ticket-status-pill,
  .pharmora-route-admin .rounded-xl.border.bg-card > .flex.items-center.justify-between:has(.pharmora-ticket-status-pill) .pharmora-ticket-status-pill {
    justify-self: start !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: min(280px, calc(100vw - 96px)) !important;
    max-width: min(280px, calc(100vw - 96px)) !important;
  }
}