/* © 2026 Mark Kats. Все права защищены. Копирование и переработка запрещены. */

[data-user-preview-id] {
	cursor: pointer;
}

[data-user-preview-id]:focus-visible {
	outline: 2px solid var(--ui-focus-ring, var(--app-focus-ring, #78baff));
	outline-offset: 2px;
}

.user-preview-modal .shd-modal-body {
	margin-top: 2px;
}

.shd-modal.user-preview-modal {
	width: min(520px, calc(100vw - 24px));
	max-width: calc(100vw - 24px);
}

.user-preview-modal .shd-form:empty {
	display: none;
}

.user-preview-card {
	display: grid;
	gap: 16px;
	padding: 0;
}

.user-preview-top {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	align-items: center;
	gap: 8px;
}

.user-preview-identity {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.user-preview-avatar {
	flex: 0 0 64px;
	width: 64px;
	height: 64px;
	border: 1px solid var(--ui-border, var(--shd-dialog-border));
	border-radius: 50%;
	background: var(--ui-surface-raised, var(--shd-dialog-surface));
	color: var(--ui-text, var(--shd-dialog-text));
	object-fit: cover;
}

.user-preview-avatar--empty {
	display: grid;
	place-items: center;
	font-size: 25px;
	font-weight: 600;
}

.user-preview-heading {
	display: grid;
	gap: 2px;
	min-width: 0;
}

.user-preview-name {
	overflow-wrap: anywhere;
	font-size: 1rem;
	line-height: 1.15;
}

.user-preview-username,
.user-preview-info-row dt {
	color: var(--ui-text-muted, var(--shd-dialog-muted));
}

.user-preview-info {
	display: grid;
	gap: 3px;
	margin: 0;
}

.user-preview-info-row {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	gap: 8px;
	padding: 3px 0;
}

.user-preview-info-row dt,
.user-preview-info-row dd {
	margin: 0;
	overflow-wrap: anywhere;
}

.user-preview-info-row dd {
	color: var(--ui-text, var(--shd-dialog-text));
}

.user-preview-actions {
	display: flex;
	justify-content: flex-start;
}

.user-preview-message-button {
	min-width: 0;
}

.user-preview-projects {
	display: grid;
	gap: 5px;
}

.user-preview-projects-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.user-preview-projects-header h3 {
	margin: 0;
	color: var(--ui-text, var(--shd-dialog-text));
	font-size: 0.9rem;
}

.user-preview-loading,
.user-preview-empty,
.user-preview-error {
	margin: 0;
	padding: 8px 2px;
	color: var(--ui-text-dim, var(--shd-dialog-muted));
	text-align: center;
}

.user-preview-error {
	color: var(--ui-danger-icon-text, var(--shd-dialog-danger-text));
}

@media (max-width: 520px) {
	.user-preview-top {
		grid-template-columns: 1fr;
	}

	.user-preview-avatar {
		flex-basis: 56px;
		width: 56px;
		height: 56px;
	}

	.user-preview-info-row {
		grid-template-columns: 1fr;
		gap: 1px;
	}
}