/* ====================================================================
   РЕДИЗАЙН 2026 — ЛИЧНЫЙ КАБИНЕТ + АВТОРИЗАЦИЯ
   Скоупы:  .rd-login  (вход / восстановление / смена пароля / регистрация)
            .rd-account (кабинет: мой профиль, мои данные, смена пароля, избранное)
   Подключается в header.php по $isAuth / $isCabinet.
   Опирается на токены redesign.css (--rd-bg/--rd-dark/--rd-accent/шрифты/
   контейнер). Карточки избранного используют общий .rd-pcard из redesign.css.
   ==================================================================== */

/* Локальные токены раздела */
.rd-login, .rd-account {
	--acc-card:   #1E1E1E;   /* внешняя карта кабинета */
	--acc-panel:  #141414;   /* внутренняя тёмная панель */
	--acc-field:  #2E2E2E;   /* поля ввода (пилюли) */
	--acc-tile:   #2A2A2A;   /* плитки/активные пункты */
	--acc-ph:     #9A9A9A;   /* плейсхолдер */
	--acc-radius: 40px;      /* радиус пилюль */
}

/* ============================ ОБЩЕЕ ============================ */
.rd-login__title,
.rd-account__title {
	font-family: var(--rd-font-head);
	font-weight: 900;
	text-transform: uppercase;
	color: var(--rd-white);
	letter-spacing: -0.02em;
	line-height: 1;
	font-size: clamp(38px, 5vw, 64px);
	margin: 28px 0 40px;
}

/* Поле-пилюля (используется и в авторизации, и в формах кабинета) */
.rd-field {
	display: block;
	width: 100%;
	box-sizing: border-box;
	height: 64px;
	padding: 0 28px;
	background: var(--acc-field);
	border: 1px solid transparent;
	border-radius: var(--acc-radius);
	color: var(--rd-white);
	font-family: var(--rd-font-text);
	font-size: 16px;
	line-height: 1.2;
	outline: none;
	transition: border-color .2s, background .2s;
}
.rd-field::placeholder { color: var(--acc-ph); }
.rd-field:focus { border-color: var(--rd-accent); }

/* Обёртка поля с кнопкой-глазом (пароль) */
.rd-field-wrap { position: relative; }
.rd-field-wrap .rd-field { padding-right: 60px; }
.rd-field__eye {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	width: 26px;
	height: 26px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	color: var(--acc-ph);
	display: flex;
	align-items: center;
	justify-content: center;
}
.rd-field__eye:hover { color: var(--rd-white); }
.rd-field__eye svg { width: 22px; height: 22px; display: block; }
.rd-field__eye .rd-eye-off { display: none; }
.rd-field__eye.is-on .rd-eye-on { display: none; }
.rd-field__eye.is-on .rd-eye-off { display: block; }

/* Кнопки */
.rd-btn-purple,
.rd-btn-ghost {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 64px;
	padding: 0 40px;
	border-radius: var(--acc-radius);
	border: 1px solid transparent;
	font-family: var(--rd-font-text);
	font-weight: 500;
	font-size: 16px;
	cursor: pointer;
	text-decoration: none;
	transition: background .2s, opacity .2s, transform .2s, border-color .2s;
}
.rd-btn-purple { background: var(--rd-accent); color: var(--rd-white); }
.rd-btn-purple:hover { opacity: .9; transform: translateY(-1px); }
.rd-btn-ghost { background: transparent; color: var(--rd-white); border-color: rgba(255,255,255,.35); }
.rd-btn-ghost:hover { border-color: var(--rd-white); }

/* Сообщения об ошибке / успехе форм */
.rd-msg { border-radius: 18px; padding: 14px 22px; font-family: var(--rd-font-text); font-size: 15px; line-height: 1.4; margin-bottom: 16px; }
.rd-msg--error   { background: rgba(255,74,74,.12); color: #ff8b8b; }
.rd-msg--success { background: rgba(47,180,76,.12); color: #7ee08f; }

/* ============================ АВТОРИЗАЦИЯ ============================ */
/* Форма — по центру страницы (колонка 640px, отцентрована по горизонтали) */
.rd-login { padding-bottom: 120px; }
.rd-login__title { text-align: center; }
.rd-login__box { max-width: 640px; margin: 0 auto; }
.rd-login__form { display: flex; flex-direction: column; gap: 16px; }
.rd-login__form .rd-field-wrap { margin: 0; }
.rd-login__submit { width: 100%; margin-top: 4px; }
.rd-login__forgot {
	align-self: center;
	margin-top: 12px;
	color: var(--rd-white);
	font-family: var(--rd-font-text);
	font-size: 16px;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.rd-login__forgot:hover { color: var(--rd-accent); }
.rd-login__alt {
	margin: 22px 0 0;
	color: var(--acc-ph);
	font-family: var(--rd-font-text);
	font-size: 15px;
	text-align: center;
}
.rd-login__alt a { color: var(--rd-accent); text-decoration: none; }
.rd-login__alt a:hover { text-decoration: underline; }

/* Ссылка «назад к авторизации» (восстановление/смена) */
.rd-login__back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 28px;
	color: var(--acc-ph);
	font-family: var(--rd-font-text);
	font-size: 15px;
	text-decoration: none;
}
.rd-login__back:hover { color: var(--rd-white); }
.rd-login__back svg { width: 16px; height: 16px; }

/* Успех восстановления (#2): фиол. круг с галочкой + текст */
.rd-login__success { display: flex; align-items: center; gap: 22px; max-width: 560px; margin: 0 auto; }
.rd-login__success-ico {
	flex: 0 0 auto;
	width: 56px; height: 56px;
	border-radius: 50%;
	border: 2px solid var(--rd-accent);
	display: flex; align-items: center; justify-content: center;
}
.rd-login__success-ico svg { width: 26px; height: 26px; }
.rd-login__success-text {
	margin: 0;
	color: var(--rd-white);
	font-family: var(--rd-font-text);
	font-weight: 500;
	font-size: 18px;
	line-height: 1.35;
}

/* Регистрация — форма в том же тёмном стиле */
.rd-reg__form { display: flex; flex-direction: column; gap: 16px; max-width: 640px; margin: 0 auto; }
.rd-reg__check { display: flex; align-items: flex-start; gap: 12px; font-family: var(--rd-font-text); font-size: 14px; color: var(--acc-ph); line-height: 1.4; cursor: pointer; }
.rd-reg__check input { margin-top: 2px; width: 18px; height: 18px; accent-color: var(--rd-accent); flex: 0 0 auto; }
.rd-reg__check a { color: var(--rd-accent); }
.rd-reg__submit { width: 100%; margin-top: 4px; }

/* ============================ КАБИНЕТ ============================ */
.rd-account { padding-bottom: 120px; }

.rd-account__card {
	display: grid;
	grid-template-columns: 360px 1fr;
	gap: 24px;
	background: var(--acc-card);
	border-radius: 32px;
	padding: 24px;
	box-sizing: border-box;
}

/* --- Сайдбар --- */
.rd-account__side { display: flex; flex-direction: column; padding: 24px 8px 8px; min-height: 560px; }
.rd-account__menu { display: flex; flex-direction: column; gap: 6px; }
.rd-account__link {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 18px 22px;
	border-radius: 16px;
	color: var(--rd-white);
	font-family: var(--rd-font-text);
	font-size: 17px;
	text-decoration: none;
	transition: background .2s;
}
.rd-account__link:hover { background: rgba(255,255,255,.05); }
.rd-account__link.is-active { background: var(--acc-tile); }
.rd-account__link-ico { flex: 0 0 auto; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; }
.rd-account__link-ico svg { width: 24px; height: 24px; display: block; }
.rd-account__link-txt { flex: 1 1 auto; }

/* Пользователь (аватар + имя) — на десктопе внизу сайдбара */
.rd-account__user {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-top: auto;
	padding: 22px 14px 8px;
	border-top: 1px solid rgba(255,255,255,.08);
}
.rd-account__ava {
	flex: 0 0 auto;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--rd-accent);
	display: flex; align-items: center; justify-content: center;
	color: var(--rd-white);
	font-family: var(--rd-font-text);
	font-weight: 600; font-size: 17px;
	overflow: hidden;
}
.rd-account__ava img { width: 100%; height: 100%; object-fit: cover; }
.rd-account__name { color: var(--rd-white); font-family: var(--rd-font-text); font-weight: 600; font-size: 17px; }

/* --- Панель контента --- */
.rd-account__panel {
	background: var(--acc-panel);
	border-radius: 24px;
	padding: 48px 56px 56px;
	box-sizing: border-box;
	min-width: 0;
}
.rd-account__h2 {
	font-family: var(--rd-font-head);
	font-weight: 900;
	text-transform: uppercase;
	color: var(--rd-white);
	letter-spacing: -0.01em;
	line-height: 1.05;
	font-size: clamp(32px, 3vw, 48px);
	margin: 0 0 36px;
}

/* Форма данных (колоночный порядок → 2 колонки на десктопе) */
.rd-dataform__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: repeat(4, auto);
	grid-auto-flow: column;
	gap: 16px 24px;
	margin-bottom: 28px;
}
.rd-dataform__grid--1 { display: flex; flex-direction: column; max-width: 620px; }
.rd-account__save { min-width: 200px; }

/* Избранное — сетка карточек .rd-pcard */
.rd-account__favgrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.rd-account__empty { color: var(--acc-ph); font-family: var(--rd-font-text); font-size: 18px; padding: 20px 0; }

/* На странице «Избранное» сердце-кнопка карточки = УДАЛИТЬ. Делаем это очевидным:
   по наведению кнопка слегка гаснет и в углу появляется красный крестик + подсказка. */
.rd-account__favgrid .rd-pcard__btn.favor { position: relative; }
.rd-account__favgrid .rd-pcard__btn.favor::after {
	content: "\00d7";                       /* × */
	position: absolute; top: -2px; right: -2px;
	width: 18px; height: 18px; border-radius: 50%;
	background: #E14B4B; color: #fff;
	font-size: 13px; line-height: 18px; text-align: center; font-family: var(--rd-font-text);
	opacity: 0; transform: scale(.5); transition: opacity .15s ease, transform .15s ease;
	pointer-events: none;
}
.rd-account__favgrid .rd-pcard__btn.favor:hover { opacity: 1; transform: none; }
.rd-account__favgrid .rd-pcard__btn.favor:hover img { opacity: .55; }
.rd-account__favgrid .rd-pcard__btn.favor:hover::after { opacity: 1; transform: scale(1); }

/* ---- Совместимость со СТАРОЙ обёрткой /favorites/ (шаблон favorites_list мог
   не переопределиться: на боевом остаётся section.account.favorites >
   .account__container > .tabss.favvorit > .tabss__title + .rd-account__favgrid).
   Приводим её к тому же виду: контейнер 1600px по центру + большой заголовок. ---- */
.account.favorites { padding-bottom: 120px; }
.account.favorites .account__container {
	width: 100%;
	max-width: calc(var(--rd-container) + var(--rd-gutter) * 2);
	margin: 0 auto;
	padding: 0 var(--rd-gutter);
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	box-sizing: border-box;
}
.account.favorites .tabss.favvorit { width: 100%; }
.account.favorites .tabss__title {
	font-family: var(--rd-font-head) !important;
	font-weight: 900 !important;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	font-size: clamp(38px, 5vw, 64px) !important;
	line-height: 1 !important;
	color: var(--rd-white) !important;
	margin: 28px 0 40px !important;
}
@media (max-width: 900px) {
	.account.favorites .tabss__title { font-size: 36px !important; margin: 18px 0 26px !important; }
}
.rd-account__note { margin-top: 28px; color: var(--acc-ph); font-family: var(--rd-font-text); font-size: 13px; line-height: 1.5; max-width: 760px; }

/* Пейджер «Показать ещё» избранного */
.rd-account__panel .modern-page-navigation,
.rd-account__panel .bx-pagination { text-align: center; margin-top: 32px; }
.rd-account__panel .more_products,
.rd-account__panel a.bx-pag-more { display: inline-flex; align-items: center; justify-content: center; height: 56px; padding: 0 40px; border-radius: var(--acc-radius); border: 1px solid rgba(255,255,255,.35); color: var(--rd-white); font-family: var(--rd-font-text); text-decoration: none; }
.rd-account__panel .more_products:hover,
.rd-account__panel a.bx-pag-more:hover { border-color: var(--rd-white); }

/* ================= АДАПТИВ ================= */
@media (max-width: 1149px) {
	.rd-account__card { grid-template-columns: 300px 1fr; }
	.rd-account__panel { padding: 40px 36px 44px; }
	.rd-account__favgrid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
	/* Общий каркас на мобильном */
	.rd-login, .rd-account { padding-bottom: 72px; }
	.rd-login__title, .rd-account__title { font-size: 36px; margin: 18px 0 26px; }
	.rd-field, .rd-btn-purple, .rd-btn-ghost { height: 56px; }

	/* Карта распадается: одна колонка */
	.rd-account__card { display: block; background: none; border-radius: 0; padding: 0; }
	.rd-account__side { min-height: 0; padding: 0; }
	.rd-account__panel { background: none; border-radius: 0; padding: 0; }

	/* --- Под-страницы (Мои данные / Смена пароля / Избранное): сайдбар скрыт,
	   большой заголовок = название раздела (H2 вырастает до размера H1),
	   «Мой профиль» (H1) прячем --- */
	.rd-account--sub .rd-account__side { display: none; }
	.rd-account--sub .rd-account__title { display: none; }
	.rd-account--sub .rd-account__h2 {
		display: block;
		font-size: 36px;
		letter-spacing: -0.02em;
		margin: 0 0 24px;
	}
	/* На корневой (плитки) панель скрыта — её H2 не нужен */
	.rd-account--root .rd-account__h2 { display: none; }

	/* --- Корневая (Мой профиль): плитки вместо сайдбара, панель скрыта --- */
	.rd-account--root .rd-account__panel { display: none; }
	.rd-account--root .rd-account__side { display: flex; flex-direction: column; }
	.rd-account--root .rd-account__user { order: -1; margin-top: 0; padding: 0 0 4px; border-top: none; margin-bottom: 22px; }
	.rd-account--root .rd-account__ava { width: 56px; height: 56px; font-size: 20px; }
	.rd-account--root .rd-account__name { font-size: 20px; }
	.rd-account--root .rd-account__menu {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 12px;
	}
	.rd-account--root .rd-account__link {
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-between;
		gap: 0;
		min-height: 150px;
		padding: 18px;
		background: var(--acc-tile);
		border-radius: 20px;
	}
	.rd-account--root .rd-account__link.is-active { background: var(--acc-tile); }
	.rd-account--root .rd-account__link-ico { margin-bottom: 40px; }
	.rd-account--root .rd-account__link-txt { font-size: 17px; }

	.rd-dataform__grid { display: flex; flex-direction: column; }
	.rd-account__save, .rd-login__submit, .rd-reg__submit { width: 100%; }
	.rd-account__favgrid { grid-template-columns: 1fr; }

	.rd-login__box, .rd-login__success, .rd-reg__form { max-width: none; }
}
