.new-user__content { display: flex; flex-direction: column; gap: 1.5rem; padding: 1rem 0; .new-user__row { display: flex; flex-direction: column; gap: 0.4rem; .new-user__label { font-weight: 600; color: #444; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.5px; } .new-user__value { background: #f7f7f8; border: 1px solid #e0e0e0; border-radius: 6px; padding: 0.75rem 1rem; font-size: 0.95rem; color: #222; word-break: break-word; code { background: #272822; color: #f8f8f2; padding: 0.2rem 0.4rem; border-radius: 4px; font-family: "Source Code Pro", monospace; font-size: 0.9rem; } } } } /* Optional: Add a subtle hover highlight for readability */ .new-user__row:hover .new-user__value { border-color: #bdbdbd; background: #fafafa; } /* Responsive tweak for smaller screens */ @media (max-width: 600px) { .new-user__content { gap: 1rem; } .new-user__row { .new-user__label { font-size: 0.85rem; } .new-user__value { font-size: 0.9rem; padding: 0.6rem 0.8rem; } } }