/* ============================================================
   Мобильная адаптация шаблона Ghost
   Подключается в head.tpl после main.css
   ============================================================ */

/* ---------- < 1200px: убираем фиксированную ширину, колонки в столбик ---------- */
@media (max-width: 1199px) {
	html,
	body {
		min-width: 0;
	}

	.wapper {
		width: 100%;
	}

	body > .wapper {
		margin: 0 auto 20px auto;
		border-radius: 0;
	}

	.wapper > .content {
		padding: 8px;
		min-height: 0;
	}

	.top_line {
		width: 100%;
	}

	/* Три колонки -> одна */
	.left1_block,
	.left_block,
	.right_block {
		width: 100%;
		float: none;
		margin-left: 0;
		margin-right: 0;
		overflow: visible;
	}
}

/* ---------- Смартфоны ---------- */
@media (max-width: 767px) {
	html,
	body {
		min-width: 0;
		max-width: 100%;
		overflow-x: hidden;
		overflow-x: clip;
		overscroll-behavior-x: none;
		-webkit-text-size-adjust: 100%;
		text-size-adjust: 100%;
	}

	/* Новогодняя мишура: holiday.css задаёт min-width 1200px и грузится позже —
	   на телефонах убираем, иначе страницу можно свайпнуть вправо в пустой фон */
	body .b-page_newyear .b-page__content,
	body .b-page_newyear .b-head-decor {
		min-width: 0;
		max-width: 100%;
	}

	/* Bootstrap-строки без контейнера: боковые -15px распирают страницу */
	.r_block_c > .row,
	.l_block_c > .row {
		margin-left: 0;
		margin-right: 0;
	}

	/* ---------- Шапка ---------- */
	#header {
		height: auto;
	}
	.top_line {
		min-height: 0;
		max-height: none;
		padding: 6px 8px 0 8px;
	}
	.top_line .logo {
		height: 44px;
		margin: 0;
	}
	.logo img {
		height: 44px;
		width: auto;
	}
	.headmenu {
		float: none;
		clear: both;
		line-height: 1;
		margin-left: 0;
	}
	.headmenu ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}
	.headmenu ul li {
		float: none;
		margin: 2px;
	}
	.headmenu ul li a {
		height: 30px;
		line-height: 28px;
		margin: 0;
		padding: 0 10px;
		font-size: 12px;
	}

	/* ---------- Контейнер ---------- */
	body > .wapper {
		margin-bottom: 10px;
	}
	.wapper > .content {
		padding: 4px;
	}

	/* Ссылки переносятся, а не выпирают за экран */
	.content a,
	.r_block a,
	.l_block a,
	.with_code a,
	.table a {
		white-space: normal;
	}

	/* Картинки не ломают ширину */
	.content img,
	.r_block_c img,
	.l_block_c img,
	.with_code img {
		max-width: 100%;
		height: auto;
	}
	.news_img1 .imgm1 {
		height: auto;
	}

	/* ---------- Таблицы: горизонтальная прокрутка ---------- */
	.table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
	.r_block_c > .table,
	.l_block_c > .table,
	.with_code > table,
	.modal-body > .table {
		display: block;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* ---------- Левая колонка / навигация ---------- */
	.ledt_avatar1 {
		text-align: center;
	}
	.ledt_avatar1 img {
		width: 120px;
		height: 120px;
	}
	/* Xenny-бейдж левой колонки: обёртка ужимается под аватар, бейдж в углу */
	.ledt_avatar1 .xenny-avatar-with-badge {
		display: inline-block;
		line-height: 0;
	}
	.left-menu li a {
		padding: 12px 10px;
	}

	/* ---------- Новости ---------- */
	.news_img {
		width: 100% !important;
		height: auto;
		float: none;
	}
	.news_other {
		width: 100%;
		float: none;
		margin-left: 0;
	}

	/* ---------- Чат ---------- */
	#chat_messages {
		height: 320px;
	}

	/* ---------- Разные фиксированные ширины ---------- */
	.glslider {
		width: 100%;
		max-width: 740px;
		margin: 0 auto;
		aspect-ratio: 740 / 250;
		background-size: 100% 100%;
	}
	.set_butt1 {
		width: 100%;
	}
	.answer tr:nth-child(2) .col-xs-2,
	.answer tr:nth-child(3) .col-xs-2,
	.answer tr:nth-child(3) .col-xs-10 {
		width: auto;
		float: none;
	}

	/* ---------- Форум: сообщения (тема) ---------- */
	.answer,
	.answer tbody,
	.answer tr,
	.answer td {
		display: block;
		width: 100% !important;
		float: none;
		box-sizing: border-box;
	}
	.answer td.col-xs-2,
	.answer td.col-xs-10,
	.answer td.col-xs-12 {
		width: 100% !important;
		display: block !important;
		border-right: none !important;
	}
	.answer tr {
		border-top: 1px solid #4d2f6e;
		padding: 6px 8px;
	}
	.answer tr:first-child {
		border-top: none;
	}
	.answer .line {
		padding: 6px 4px;
	}
	.answer .msg_date {
		margin-left: 0;
	}
	.answer .line .f-r {
		float: right;
		margin-left: 8px;
	}
	/* Аватар автора сообщения в 2 раза меньше */
	.answer .user img {
		width: 50% !important;
		max-width: 220px;
	}
	/* Текст сообщения переносится по ширине экрана */
	.answer .with_code {
		overflow-wrap: anywhere;
		word-break: break-word;
	}
	.answer .with_code pre {
		white-space: pre-wrap;
		word-break: break-word;
		overflow-wrap: break-word;
	}
	.answer .with_code iframe,
	.answer .with_code video {
		max-width: 100% !important;
	}
	/* Вложенные таблицы в тексте сообщений не ломаем */
	.answer .with_code table {
		display: table !important;
		max-width: 100%;
	}
	.answer .with_code tbody {
		display: table-row-group !important;
	}
	.answer .with_code tr {
		display: table-row !important;
	}
	.answer .with_code td {
		display: table-cell !important;
		width: auto !important;
		padding: 5px;
	}
	.dows_csm1 .dows_imges .img {
		width: 100%;
		float: none;
		margin-left: 0;
	}
	.indexautf {
		width: 48%;
		margin-right: 2%;
	}
	.indexautf:last-child {
		margin-right: 0;
	}

	/* ---------- Пользователи: 2 в ряд ---------- */
	#users .mini_user {
		width: 50%;
		margin-right: 0;
		box-sizing: border-box;
		padding: 0 4px;
	}
	#users .mini_user:nth-child(odd) {
		clear: left;
	}
	#users .mini_user .btn2 {
		font-size: 12px;
		padding-left: 6px;
		padding-right: 6px;
	}
	#users .mini_user .btn2 i {
		font-size: 12px;
	}

	/* ---------- Форум: разделы (список форумов) ---------- */
	#forum .block > table,
	#forum table.table {
		display: block;
		width: 100%;
	}
	#forum .block tbody {
		display: block;
		width: 100%;
	}
	#forum .block tr.forum {
		display: block;
		position: relative;
		min-height: 64px;
		padding: 8px 8px 8px 70px;
		background: #32244d;
		border-bottom: 1px solid #4d2f6e;
		border-left: none !important;
		border-right: none !important;
	}
	#forum .block tr.forum:nth-child(odd) {
		background: #2d2044;
	}
	#forum .block tr.forum:last-child {
		border-bottom: none;
	}
	#forum .block tr.forum td {
		display: block;
		width: auto;
		padding: 0;
		border: none !important;
		background: transparent !important;
	}
	#forum .forum_img {
		position: absolute;
		left: 8px;
		top: 50%;
		width: 54px;
		transform: translateY(-50%);
	}
	#forum .forum_img img {
		width: 54px;
		height: 54px;
	}
	#forum .block tr.forum h4 {
		font-size: 15px;
		margin: 0 0 2px 0;
	}
	#forum .block tr.forum small {
		font-size: 12px;
		color: #b7bacd;
	}
	#forum .block tr.forum .forum_info {
		margin-top: 6px;
		font-size: 12px;
		line-height: 1.5;
		color: #b7bacd;
	}
	#forum .block tr.forum .forum_info p {
		margin: 0;
	}
	#forum .block tr.forum .forum_info a {
		color: #ff6bcb;
	}

	/* ---------- Форум: список тем ---------- */
	#forum_topics tr td:nth-child(5) {
		display: none !important;
	}
	#forum_topics thead td:nth-child(5) {
		display: none !important;
	}
	#forum_topics td {
		padding: 5px 4px !important;
	}
	#forum_topics tr td:nth-child(1) {
		width: 40px;
	}
	#forum_topics tr td:nth-child(1) img {
		width: 40px;
		height: 40px;
	}
	#forum_topics tr td:nth-child(2) {
		max-width: none;
	}
	#forum_topics td:last-child {
		white-space: normal;
	}
	#forum_topics .fixed_last {
		gap: 10px;
		white-space: nowrap;
	}
	#forum_topics .fixed_move a {
		padding: 2px;
	}
	#add_img_form #ban_img,
	#add_img_form .btn {
		width: 100%;
	}

	/* ---------- Модальные окна ---------- */
	.modal-dialog {
		width: auto;
		margin: 10px;
	}

	/* ---------- Формы и кнопки ---------- */
	.input-group .form-control {
		min-width: 0;
	}
	.btn2,
	.btn-default,
	.btn-cancel {
		white-space: normal;
		word-wrap: break-word;
	}

	/* ---------- Футер ---------- */
	.bottom {
		max-height: none;
		height: auto;
		line-height: 1.6;
		padding: 10px 0;
		text-align: center;
	}
	.bottom .col-xs-4 {
		width: 100%;
		float: none;
		padding: 2px 0;
	}
	#cote {
		display: none;
	}
}

/* ---------- Профиль: мобильная оптимизация ---------- */
@media (max-width: 767px) {
	/* Исключаем таблицу профиля из общего горизонтального скролла */
	.r_block_c > .table.user_profile_info {
		display: block;
		overflow: visible;
	}

	/* Шапка профиля: логин + статус не наезжают друг на друга */
	.profile-block .profile-head {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 2px 10px;
	}
	.profile-head .profile-status {
		float: none !important;
		margin-left: auto;
		font-size: 12px;
		font-weight: normal;
		white-space: normal !important;
		text-align: right;
		max-width: 100%;
	}

	.profile-main {
		display: flex;
		flex-direction: column;
	}

	/* Аватар по центру, не растягивается на всю ширину */
	.profile_user {
		float: none !important;
		width: 100% !important;
		max-width: 100%;
		text-align: center;
		margin-bottom: 12px;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.profile_user #mini_profile_avatar {
		width: 220px !important;
		max-width: 65vw;
		height: auto !important;
		aspect-ratio: 1 / 1;
		object-fit: cover;
		border-radius: 8px;
		margin: 0 auto 10px auto;
	}

	/* Xenny-бейдж: обёртка ужимается под аватар, бейдж — в угол аватара как на ПК */
	.profile_user .xenny-avatar-with-badge {
		width: auto !important;
		max-width: 100%;
		display: inline-block !important;
		line-height: 0;
		margin: 0 auto 10px auto;
	}
	.profile_user .xenny-avatar-with-badge #mini_profile_avatar {
		margin: 0 !important;
	}
	.profile_user .xenny-avatar-badge {
		width: 52px !important;
		height: 52px !important;
		bottom: 8px !important;
		right: 8px !important;
	}

	/* Кнопки действий: удобные тач-зоны 44px, текст переносится */
	.profile-actions {
		width: 100%;
		display: grid;
		gap: 6px;
		margin-bottom: 4px;
	}
	.profile-actions li {
		height: auto !important;
		min-height: 44px;
		line-height: 1.35 !important;
		padding: 10px 12px !important;
		white-space: normal !important;
		text-overflow: clip;
		overflow: visible;
		display: flex;
		align-items: center;
		font-size: 14px;
	}
	.profile-actions li a {
		white-space: normal !important;
		word-break: break-word;
		display: block;
		width: 100%;
	}

	/* Инфо-таблица -> карточки: подпись + значение в один ряд */
	.user_profile_info,
	.user_profile_info tbody {
		display: block;
		width: 100% !important;
		margin-left: 0 !important;
		clear: both;
	}
	.user_profile_info tr {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		gap: 2px 10px;
		border-bottom: 1px solid #4d2f6e;
		padding: 8px 0;
	}
	.user_profile_info td {
		border: none !important;
		padding: 2px 0 !important;
		min-width: 0;
	}
	.user_profile_info td.w30 {
		flex: 0 0 132px;
		width: auto !important;
		color: #8f94ad;
		font-size: 13px;
	}
	.user_profile_info td.w30 img.icon {
		width: 18px !important;
		height: 18px !important;
		vertical-align: -4px;
		margin-right: 4px;
	}
	.user_profile_info td.w70 {
		flex: 1 1 170px;
		width: auto !important;
		font-size: 14px;
		overflow-wrap: anywhere;
		word-break: break-word;
	}
	.user_profile_info tr:has(td.razdel) {
		display: block;
		padding: 0;
		border-bottom: none;
	}
	.user_profile_info .razdel {
		display: block;
		width: 100% !important;
		text-align: center;
		background: rgba(45,32,68,0.5);
		border-radius: 3px;
		padding: 7px 8px !important;
		margin: 8px 0 2px 0;
	}

	/* Длинные ссылки (Steam/VK/Telegram) не режутся и не выпирают */
	.user_profile_info a {
		display: inline;
		max-width: none !important;
		white-space: normal !important;
		overflow: visible;
		text-overflow: clip;
		overflow-wrap: anywhere;
		word-break: break-all;
	}
	#vk_user,
	#steam_user,
	#fb_user {
		display: flex !important;
		align-items: center;
		gap: 8px;
	}
	#vk_user img,
	#steam_user img,
	#fb_user img {
		width: 40px !important;
		height: 40px !important;
		border-radius: 50%;
		flex: 0 0 auto;
	}

	/* Друзья в профиле: сетка крупных аватаров вместо мелких 42px */
	#companions {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		max-height: none;
		overflow: visible;
		padding-right: 0;
	}
	#companions .mini_friend {
		width: calc(25% - 6px);
		padding: 0;
	}
	#companions .mini_friend a {
		display: block;
	}
	#companions .mini_friend img {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 1 / 1;
		object-fit: cover;
	}
	#companions .empty-element {
		width: 100%;
		text-align: center;
		padding: 8px 0;
	}

	/* Привилегии: скролл вместо сплющивания, компактный шрифт */
	.profile-privs .table-responsive {
		margin: 0 -10px;
		padding: 0 10px;
	}
	.profile-privs table.admins {
		min-width: 520px;
		font-size: 12px;
	}
	.profile-privs table.admins td {
		padding: 6px !important;
		white-space: nowrap;
	}
	.profile-privs table.admins td:last-child {
		white-space: normal;
		min-width: 140px;
	}

	/* Стена: кнопка на всю ширину, редактор не выпирает */
	.profile-wall-body #add_new_comments textarea {
		min-height: 90px;
		font-size: 14px;
	}
	.profile-wall-body .smile_input_forum {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	.profile-wall-body #send_btn {
		width: 100%;
		min-height: 44px;
		margin-top: 0 !important;
		font-size: 15px;
	}
	.profile-wall-body #comments img {
		max-width: 100%;
		height: auto;
	}

	/* Карточка user_full.tpl (поиск/админка): колонки в столбик */
	.l_block_c > .col-md-3,
	.l_block_c > .col-md-9 {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}
	.l_block_c > .col-md-3 {
		max-width: 200px;
		margin: 0 auto 10px auto;
		text-align: center;
	}
	.l_block_c > .col-md-3 .navigation2 li {
		min-height: 44px;
		height: auto;
		line-height: 1.35;
		padding: 10px 12px;
		white-space: normal;
	}

	/* Список пользователей: аккуратная сетка 2 в ряд */
	#users {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	#users .mini_user {
		width: calc(50% - 4px);
		margin-right: 0 !important;
		margin-bottom: 0;
		box-sizing: border-box;
		padding: 8px;
		float: none;
	}
	#users .mini_user:nth-child(odd) {
		clear: none;
	}
	#users .mini_user > a:first-child {
		height: auto;
		min-height: 30px;
		white-space: normal;
	}
	#users .mini_user > a:first-child i {
		white-space: normal;
		word-break: break-word;
		display: block;
	}
	#users .mini_user img.img-thumbnail {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 1 / 1;
		object-fit: cover;
	}
	#users .mini_user .btn2 {
		font-size: 13px;
		padding: 10px 6px;
		min-height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		white-space: normal;
	}
	#users .mini_user .btn2 i {
		font-size: 12px;
	}

	.xenny-profile-skin-block {
		padding: 12px !important;
	}
	.xenny-skin-selector-head {
		flex-direction: column;
		align-items: flex-start !important;
		gap: 4px;
	}
	.xenny-skin-selector-head small {
		white-space: normal;
	}
	#xenny-float-widget {
		bottom: 12px !important;
		right: 12px !important;
	}
	#xenny-float-widget .xenny-avatar-icon {
		width: 88px !important;
		height: 88px !important;
	}
}

@media (max-width: 480px) {
	.profile_user #mini_profile_avatar {
		width: 180px !important;
	}
	/* Подпись над значением на самых узких экранах */
	.user_profile_info tr {
		flex-direction: column;
		gap: 0;
	}
	.user_profile_info td.w30 {
		flex: 1 1 auto;
		width: 100% !important;
		font-size: 12px;
	}
	.user_profile_info td.w70 {
		flex: 1 1 auto;
		width: 100% !important;
	}
	#companions .mini_friend {
		width: calc(33.333% - 6px);
	}
	/* Список пользователей: по одному в ряд */
	#users .mini_user {
		width: 100%;
	}
	.l_block_c > .col-md-3 {
		max-width: 170px;
	}
	.xenny-skin-grid, .xenny-badge-grid {
		grid-template-columns: 1fr !important;
		gap: 10px !important;
	}
	.xenny-skin-preview, .xenny-badge-preview,
	.xenny-skin-preview-wrap, .xenny-badge-preview-wrap,
	.xenny-badge-none-preview {
		width: 140px !important;
		height: 140px !important;
	}
	.xenny-skin-card, .xenny-badge-card {
		padding: 10px !important;
		min-height: auto !important;
	}
}

/* ---------- Подпись в профиле: редактор не влазит в экран на телефоне ---------- */
@media (max-width: 767px) {
	/* Редактор и кнопка в столбик, а не в один ряд input-group */
	.signature-input-group {
		display: block !important;
	}
	.signature-input-group .tox.tox-tinymce {
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box;
	}
	.signature-input-group #send_btn {
		width: 100% !important;
		margin-top: 8px !important;
		margin-left: 0 !important;
		min-height: 44px;
	}
	/* Тулбар TinyMCE: свайп-прокрутка по горизонтали вместо вылезания за экран */
	.signature-block .tox .tox-toolbar-overlord {
		overflow-x: auto !important;
		overflow-y: hidden !important;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-x pan-y;
		scrollbar-width: thin;
	}
	.signature-block .tox .tox-toolbar__primary {
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		overflow-y: hidden !important;
		max-width: 100% !important;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-x pan-y;
	}
	.signature-block .tox .tox-toolbar__group {
		flex: 0 0 auto !important;
		flex-wrap: nowrap !important;
	}
	.signature-block .tox .tox-tbtn {
		flex: 0 0 auto;
	}
}