/*
 * Стилизация админки под общий дизайн Skinhaptics.
 * Палитра из common.css: кремовый фон, тёплый чёрный текст, оливково-зелёный акцент,
 * заголовки — Playfair Display, скругление 16px. Правила ограничены .admin-page,
 * чтобы не затронуть остальной сайт (MudBlazor темизируется глобально).
 */

.admin-page {
	--admin-accent: var(--colors-text-highlight, #a3a98b);
	--admin-ink: var(--colors-text-main, #20190f);
	--admin-cream: var(--colors-secondary, #fbf3e8);
	--admin-surface: var(--colors-primary, #ffffff);
	--admin-line: rgba(163, 169, 139, 0.4);

	min-height: 100vh;
	background: var(--admin-cream);
	font-family: var(--font-primary, 'Montserrat', sans-serif);
	color: var(--admin-ink);
	padding-block: 1.5rem 4rem;
}

/* --- Заголовки: сериф, как на витрине --- */
.admin-page .mud-typography-h4,
.admin-page .mud-typography-h5,
.admin-page .mud-typography-h6 {
	font-family: 'Playfair Display', serif;
	color: var(--admin-ink);
	letter-spacing: 0.02em;
}

/* --- Карточки/панели --- */
.admin-page .mud-paper {
	background: var(--admin-surface);
	border: 1px solid var(--admin-line);
	border-radius: var(--radii-lg, 16px);
	box-shadow: 0 10px 34px rgba(32, 25, 15, 0.06) !important;
}

/* --- Плитки показателей --- */
.admin-page .admin-stat {
	position: relative;
	overflow: hidden;
}

.admin-page .admin-stat::before {
	content: '';
	position: absolute;
	inset: 0 auto 0 0;
	width: 4px;
	background: var(--admin-accent);
}

.admin-page .admin-stat .admin-stat__label {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.7rem;
	color: rgba(32, 25, 15, 0.55);
}

.admin-page .admin-stat .admin-stat__value {
	font-family: 'Playfair Display', serif;
	font-size: 1.6rem;
	line-height: 1.2;
	color: var(--admin-ink);
	margin-top: 0.35rem;
}

/* --- Кнопки: тёплый чёрный (filled) и оливковый контур (outlined) --- */
.admin-page .mud-button-filled.mud-button-filled-primary {
	background-color: var(--admin-ink);
	color: var(--admin-surface);
	border-radius: 999px;
	box-shadow: none;
}

.admin-page .mud-button-filled.mud-button-filled-primary:hover {
	background-color: #000;
}

.admin-page .mud-button-outlined.mud-button-outlined-primary {
	border-color: var(--admin-accent);
	color: var(--admin-ink);
	border-radius: 999px;
}

.admin-page .mud-button-outlined.mud-button-outlined-primary:hover {
	background-color: rgba(163, 169, 139, 0.14);
}

/* --- Таблицы --- */
.admin-page .mud-table {
	background: var(--admin-surface);
}

.admin-page .mud-table-head .mud-table-cell {
	background: var(--admin-cream);
	color: var(--admin-ink);
	font-weight: 600;
	letter-spacing: 0.03em;
	border-bottom: 1px solid var(--admin-line);
}

.admin-page .mud-table-row:hover .mud-table-cell {
	background: rgba(163, 169, 139, 0.1) !important;
}

.admin-page .mud-table-cell {
	color: var(--admin-ink);
}

/* --- Акцентные контролы (переключатели, прогресс, выделение дат) --- */
.admin-page .mud-switch.mud-switch-primary .mud-switch-track.mud-checked,
.admin-page .mud-switch .mud-switch-input:checked + .mud-switch-track {
	background-color: var(--admin-accent) !important;
}

.admin-page .mud-progress-linear-bar,
.admin-page .mud-progress-circular-circle {
	color: var(--admin-accent);
}

/* --- Поля ввода: скругление и акцент фокуса --- */
.admin-page .mud-input-outlined-border {
	border-radius: 12px;
}

.admin-page .mud-input.mud-input-outlined.mud-focused .mud-input-outlined-border {
	border-color: var(--admin-accent) !important;
}

/* --- Чипы статусов: оставляем семантику, но мягче --- */
.admin-page .mud-chip {
	border-radius: 999px;
	font-weight: 500;
}