body { background: -moz-dialog; color: -moz-dialogtext; margin: initial; font: message-box; } @media (prefers-color-scheme: dark) { body { background: var(--grey-70) !important; color: white !important; } .media-select { border-bottom-color: var(--grey-50) !important; } .receiver__address { color: var(--grey-10-a60) !important; } } .media-select { border-bottom: 1px solid rgba(0, 0, 0, 0.25); margin: 0 1em; padding: 0.75em 0; } .media-select__label-cast, .media-select__label-to { display: inline-block; } .media-select__label-cast:not(:empty) { margin-inline-end: 0.5em; } .media-select__label-to:not(:empty) { margin-inline-start: 0.5em; } .media-select__dropdown { display: inline-block; } .receivers { list-style: none; margin: initial; padding: initial; } .receivers__not-found { align-items: center; display: flex; height: 50px; justify-content: center; padding: 0.75em 1em; } .receiver { column-gap: 0.75em; display: grid; grid-template-columns: 1fr min-content; grid-template-rows: min-content min-content 1fr; grid-template-areas: "name connect" "address connect"; justify-content: center; margin: 0 1em; padding: 0.75em 0; position: relative; } .receiver:not(:last-child) { border-bottom: 1px solid rgba(0, 0, 0, 0.25); } .receiver__name, .receiver__address { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .receiver__name { font-size: 1.1em; grid-area: name; } .receiver__address { color: GrayText; grid-area: address; } .receiver__status { grid-area: status; } .receiver__connect { align-self: center; grid-area: connect; justify-self: end; min-width: 100px; height: 32px; }