/*
 * Warstwa responsywna. Ładowana jako ostatnia i NIE zmienia żadnych kolorów -
 * wyłącznie rozmiary, odstępy i sposób zawijania elementów. Na szerokich ekranach wygląd jest taki sam jak dotąd.
 */

/* --- reguły ogólne (każda szerokość) --- */
html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
img {
	max-width: 100%;
	height: auto;
}
.comments, .threads, #mainBlock .content {
	overflow-wrap: anywhere;
	word-wrap: break-word;
}
.cmt_cmt pre, .comments pre {
	white-space: pre-wrap;
	max-width: 100%;
	overflow-x: auto;
}
.cmt_cmt table, .comments table:not(.cmts_quick_head_info) {
	display: block;
	max-width: 100%;
	overflow-x: auto;
}
.login_input, .cmt_input {
	max-width: 100%;
}
textarea.cmt_input {
	height: auto;
}

/* --- tablet i mniejsze --- */
@media (max-width: 900px) {
	#headerBlock { padding: 0.8em 1em; margin: 6px 6px 0 6px; }
	#mainBlock { padding: 1.2em 1em 0.8em 1em; margin: 0 6px 6px 6px; }
	#bottomBlock { margin: 0 6px 6px 6px; }
	h1#topTitle { font-size: 1.8em; margin: 0.4em 0; }
	h2#pageTitle { font-size: 1.2em; }
	h3#pageSubtitle { font-size: 1em; }
	.refs { margin: 0.4em 0; }

	/* panel ignorowanych przestaje opływać treść */
	div#xinfo_rpanel {
		float: none;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		gap: 2px;
	}
	div#xinfo_rpanel div { flex: 1 1 30%; min-width: 150px; }
	div#xinfo_rpanel div h4 { text-align: left; }

	input, textarea, select, button { box-sizing: border-box; }
	.login_input, .cmt_input { width: 100%; max-width: 400px; }
}

/* --- telefony --- */
@media (max-width: 640px) {
	body { font-size: 15px; }
	#headerBlock { padding: 0.6em 0.7em; margin: 4px 4px 0 4px; }
	#mainBlock { padding: 0.8em 0.6em 0.6em 0.6em; margin: 0 4px 4px 4px; }
	#bottomBlock { margin: 0 4px 4px 4px; }
	p#topDate { float: none; display: block; text-align: right; font-size: 0.75em; margin: 0 0 0.3em 0; }
	h1#topTitle { font-size: 1.5em; }
	h2#pageTitle { font-size: 1.05em; }

	/* paski odnośników: czytelniejsze, łatwiejsze do trafienia palcem */
	.refs { font-size: 75%; padding: 4px 8px; line-height: 1.9; }
	.dynlinks a { display: inline-block; padding: 2px 5px; }
	.toplinks a { padding: 6px 0; }

	/* formularze: pola jedno pod drugim, na pełną szerokość */
	.inputform table, .inputform tbody, .inputform tr, .inputform th, .inputform td,
	#mainBlock .content form table, #mainBlock .content form tbody, #mainBlock .content form tr,
	#mainBlock .content form th, #mainBlock .content form td {
		display: block;
		width: 100%;
	}
	.inputform th, #mainBlock .content form th { text-align: left; padding-top: 0.5em; }
	.login_input, .cmt_input { width: 100%; max-width: none; }
	.cmt_input_twothirds { width: 64%; max-width: none; }
	.cmt_input_onethird { width: 34%; max-width: none; }
	input[type="text"], input[type="password"], textarea, select { font-size: 16px; } /* brak automatycznego powiększania w iOS */
	.cmt_submit, .login_submit { width: 100%; padding: 0.6em; }
	.cmt_thread_selector { max-width: 100%; font-size: 80%; }

	/* wpisy */
	.cmt_date { float: none; display: block; text-align: right; margin-top: 2px; }
	.cmt_id_line { overflow: hidden; }
	#cmt_management_buttons { position: static; margin-top: 4px; display: inline-block; }
	p.cmt_cmt, th.cmt_cmt { font-size: 90%; }
	.cmts_quick_head_info, .cmts_quick_head_info tbody, .cmts_quick_head_info tr, .cmts_quick_head_info td { display: block; width: 100%; }
	.cmt_last_seen_info { text-align: left; }

	/* tabela wątków: ukryte kolumny pomocnicze (data utworzenia i liczba wizyt) */
	.threads { font-size: 80%; }
	.threads tr:not(.footer) > :nth-child(1),
	.threads tr:not(.footer) > :nth-child(6) { display: none; }
	.threads td.date { white-space: nowrap; }
	th.author { width: auto; }
	th.last { width: auto; }

	/* stopka */
	#bottomBlock table, #bottomBlock tbody, #bottomBlock tr, #bottomBlock td { display: block; width: 100%; text-align: center; }
	#bottomBlock td { padding: 2px 0; }
	#bottomBlock td.rightaligned { text-align: center; }

	/* panel cookies na całą szerokość */
	#cookieInfoPanel { left: 0; right: 0; }
	#cookieInfoPanel div { height: auto; }

	/* tabele w treści stron (komisja dyscyplinarna) */
	.urestrictions_table { display: block; overflow-x: auto; }
}

/* --- bardzo wąskie ekrany --- */
@media (max-width: 380px) {
	h1#topTitle { font-size: 1.3em; }
	.cmt_input_twothirds, .cmt_input_onethird { width: 100%; margin-bottom: 4px; }
}