.container { max-width: 24rem; margin-inline: auto; } .suggestedInfoText { color: var(--color-text-high); font-size: var(--font-lg); } .topContainer { display: flex; align-items: center; justify-content: space-between; } .topContainerCentered { justify-content: center; } .radios { display: flex; align-items: center; justify-content: center; gap: var(--s-5); } .radioContainer { display: flex; flex-direction: column; align-items: center; gap: var(--s-1); } .radioLabel { font-size: var(--font-sm); margin-block-end: 0; } .usersCount { color: var(--color-text-high); font-size: var(--font-2xs); } .suggestedUserInfo { display: flex; align-items: center; gap: var(--s-2); } .comment { white-space: pre-wrap; } .commentButton { max-width: 12rem; margin-inline-start: auto; } .viewCommentsAction { color: var(--color-text-high); font-size: var(--font-xs); font-weight: var(--weight-semi); } .commentTime { color: var(--color-text-high); font-size: var(--font-2xs); } .deleteButton { display: inline; } .modalSelect { max-width: 6rem; } .modalTextarea { width: 100% !important; resize: none; } .votingContainer { max-width: 32rem; margin-inline: auto; } .votingVoteButton { width: 4rem; } .votingVoteButtonDownvote { border-color: var(--color-error); color: var(--color-error); outline-color: var(--color-error); } .votingSubmitButton { display: flex; width: 12rem; height: 2.5rem; margin-block-start: var(--s-6); margin-inline: auto; } .votingProgress { width: 100%; } .votingAlert { display: flex; align-items: center; justify-content: center; border-radius: var(--radius-box); background-color: var(--color-success-high); color: var(--color-text); font-size: var(--font-sm); font-weight: var(--weight-semi); gap: var(--s-2); line-height: 0.75; margin-inline: auto; padding-block: var(--s-1); padding-inline: var(--s-3) var(--s-4); } .votingAlert > svg { height: 1.75rem; fill: var(--color-success); } .votingBioHeader { font-size: var(--font-lg); padding-block-end: var(--s-2); }