.delete-user__content { display: flex; flex-direction: column; gap: 1.5rem; padding: 1rem 0; } .delete-user__warning { background: #fff3cd; border: 1px solid #ffc107; border-radius: 6px; padding: 1rem; .delete-user__warning-text { margin: 0; color: #856404; font-size: 0.95rem; line-height: 1.5; font-weight: 500; } } .delete-user__user-info { display: flex; flex-direction: column; gap: 1rem; padding: 1rem; background: #f7f7f8; border-radius: 6px; border: 1px solid #e0e0e0; } .delete-user__row { display: flex; flex-direction: column; gap: 0.4rem; .delete-user__label { font-weight: 600; color: #444; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.5px; } .delete-user__value { background: #fff; border: 1px solid #e0e0e0; border-radius: 6px; padding: 0.75rem 1rem; font-size: 0.95rem; color: #222; word-break: break-word; } } .delete-user__error { background: #f8d7da; border: 1px solid #f5c6cb; border-radius: 6px; padding: 0.75rem 1rem; color: #721c24; font-size: 0.9rem; } .delete-user__actions { display: flex; gap: 1rem; justify-content: flex-end; margin-top: 0.5rem; } .delete-user__button { padding: 0.75rem 1.5rem; border-radius: 6px; font-size: 0.95rem; font-weight: 600; cursor: pointer; border: none; transition: all 0.2s; display: flex; align-items: center; gap: 0.5rem; min-width: 120px; justify-content: center; &:disabled { opacity: 0.6; cursor: not-allowed; } &--cancel { background: #f5f5f5; color: #333; border: 1px solid #ddd; &:hover:not(:disabled) { background: #e8e8e8; border-color: #bbb; } } &--delete { background: #dc3545; color: #fff; &:hover:not(:disabled) { background: #c82333; } } } /* Responsive tweak for smaller screens */ @media (max-width: 600px) { .delete-user__content { gap: 1rem; } .delete-user__actions { flex-direction: column-reverse; .delete-user__button { width: 100%; } } }