/*
 * odswiez.css - odswiezenie wygladu eps24.eu (2026)
 * Nakladka ladowana PO styl.css i form.css. Nie zmienia ukladu strony (grafiki, naglowek,
 * logo, kolorystyka pomaranczowa zostaja), poprawia czytelnosc: czcionke, kontrast, odstepy,
 * formularze, przyciski, tabele wynikow. Zadnych zewnetrznych czcionek ani skryptow.
 */

:root {
	--eps-orange: #F66013;
	--eps-orange-dark: #D9500A;
	--eps-orange-soft: #FFF3EA;
	--eps-text: #2F3237;
	--eps-muted: #5F6670;
	--eps-line: #D9DEE3;
	--eps-bg-soft: #F6F7F8;
	--eps-radius: 6px;
	--eps-font: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}

::selection { background: #FFD9C2; color: #1d1d1d; }

body {
	font-family: var(--eps-font);
	color: var(--eps-text);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* ---------- tresc podstron ---------- */
.zawartosc #tdsrodek,
.zawartosc #tdsrodekHome {
	font-family: var(--eps-font);
	font-size: 15px;
	line-height: 1.6;
	color: var(--eps-text);
}
.zawartosc #tdsrodek table { width: 100%; }
.zawartosc #tdsrodek table td#srodek,
.zawartosc #tdsrodekHome table td#srodek { padding: 1.2em 1.5em 2em; }

.zawartosc h1, .zawartosc h2, .zawartosc h3 { font-family: var(--eps-font); line-height: 1.25; color: #E5560A; }
.zawartosc h1 { font-size: 26px; font-weight: 700; margin: 0 0 0.35em; letter-spacing: -0.01em; }
.zawartosc h2 { font-size: 19px; font-weight: 600; margin: 0 0 0.5em; }
.zawartosc h3 { font-size: 16px; font-weight: 600; margin: 0 0 0.4em; }

.zawartosc p { margin: 0 0 1em; }
.zawartosc a { color: var(--eps-orange-dark); }
.zawartosc a { transition: color .15s ease, text-decoration-color .15s ease; }
.zawartosc a:hover { color: var(--eps-orange-dark); text-decoration: underline; text-underline-offset: 2px; }
.zawartosc a:visited { color: var(--eps-orange-dark); }

.zawartosc ul, .zawartosc ol { padding-left: 1.3em; }
.zawartosc li { margin: 0 0 0.35em; }

/* ---------- menu boczne (podmenu) ---------- */
div#tdpodmenu { font-family: var(--eps-font); font-size: 13.5px; }
ul#cz-podmenu a { color: #6B7078; transition: color .15s ease; }
ul#cz-podmenu a:hover,
ul#cz-podmenu li#currentpm a { color: var(--eps-orange); }
ul#cz-podmenu a span { padding: 0.18em 5px; }

/* ---------- menu glowne: tylko kolor przejscia (uklad bez zmian) ---------- */
#cz_menu ul a { transition: color .15s ease; }
#cz_menu ul#menu a:hover { color: #FFF; }

/* ---------- sciezka (okruszki) ---------- */
#cz_banerowa_podstrona div#sciezka_lokalizacja { font-size: 12px; font-family: var(--eps-font); }
#cz_banerowa_podstrona div#sciezka_lokalizacja a { color: #6F767F; }
#cz_banerowa_podstrona div#sciezka_lokalizacja a:hover { color: var(--eps-orange); text-decoration: underline; }

/* ---------- flagi jezykow ---------- */
#flagi { font-family: var(--eps-font); font-size: 12px; }
#flagi a { border-radius: 3px; }

/* ---------- formularze ---------- */
form fieldset,
#form_home form fieldset { font-family: var(--eps-font); }
form fieldset { font-size: 14px; }
#form_home form fieldset { font-size: 12.5px; }

form fieldset div { color: var(--eps-text); }

form fieldset input,
form fieldset select,
form fieldset textarea {
	font-family: var(--eps-font);
	font-size: 14px;
	color: var(--eps-text);
	background: #FFF;
	border: 1px solid #C6CCD3;
	border-radius: var(--eps-radius);
	box-sizing: border-box;
	padding: 5px 8px;
	line-height: 1.3;
	transition: border-color .15s ease, box-shadow .15s ease;
}
form fieldset select { padding: 5px 6px; height: 32px; }
form fieldset input { height: 32px; }
form fieldset textarea { height: auto; min-height: 80px; }

form fieldset div#format input { width: 58px; font-size: 14px; text-align: right; }
form fieldset div#cWaga input { width: 66px; font-size: 14px; text-align: right; }

#form_home form fieldset input,
#form_home form fieldset select { font-size: 12.5px; height: 28px; padding: 3px 6px; }
#form_home form fieldset div#format input { width: 52px; font-size: 12.5px; }
#form_home form fieldset div#cWaga input { width: 58px; font-size: 12.5px; }

form fieldset input:hover, form fieldset select:hover, form fieldset textarea:hover { border-color: #9AA3AD; }
form fieldset input:focus, form fieldset select:focus, form fieldset textarea:focus {
	outline: none;
	border-color: var(--eps-orange);
	box-shadow: 0 0 0 3px rgba(246, 96, 19, .22);
}

form div.butony { border-top: 1px solid var(--eps-line); }

/* ---------- przyciski ---------- */
form .btn,
form .btn1,
form fieldset .btn,
#form_podstrona form .btn1,
input.btn, input.btn1 {
	font-family: var(--eps-font);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: #FFF;
	background: var(--eps-orange);
	border: 0;
	border-radius: var(--eps-radius);
	padding: 8px 22px;
	height: auto;
	width: auto;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .18);
	transition: background-color .15s ease, box-shadow .15s ease, transform .05s ease;
}
#form_home form .btn { padding: 5px 16px; font-size: 12px; }
form .btn:hover, form .btn1:hover, input.btn:hover, input.btn1:hover {
	background: var(--eps-orange-dark);
	box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
}
form .btn:active, form .btn1:active, input.btn:active, input.btn1:active { transform: translateY(1px); box-shadow: none; }
form .btn:focus-visible, form .btn1:focus-visible { outline: 3px solid rgba(246, 96, 19, .4); outline-offset: 2px; }

/* ---------- wyniki kalkulatora ---------- */
table.wynikKalk { width: 100%; margin: 1.2em 0; border-collapse: separate; border-spacing: 0; font-size: 15px; }
table.wynikKalk td { padding: 10px 14px; border-bottom: 1px solid var(--eps-line); }
table.wynikKalk tr:first-child td { border-bottom: 2px solid var(--eps-orange); }
table.wynikKalk tr:nth-child(even) td { background: #FAFAFB; }
table.wynikKalk td b { font-weight: 700; }
table.wynikKalk h2 { margin: 0; font-size: 16px; }

.uwaga {
	width: auto;
	box-sizing: border-box;
	font-size: 13.5px;
	line-height: 1.55;
	padding: 12px 16px;
	margin: 1.2em 0;
	background: var(--eps-orange-soft);
	border: 0;
	border-left: 4px solid var(--eps-orange);
	border-radius: 0 var(--eps-radius) var(--eps-radius) 0;
	color: #4A4F57;
}

table.tabOpakowan { border-collapse: collapse; }
table.tabOpakowan td { padding: 6px 10px; }

/* ---------- stopka ---------- */
#stopka { font-family: var(--eps-font); font-size: 12px; line-height: 1.5; color: var(--eps-muted); padding-top: 10px; padding-bottom: 10px; }
#stopka a { color: var(--eps-muted); }
#stopka a:hover { color: var(--eps-orange); text-decoration: underline; }

/* ---------- dostepnosc ---------- */
a:focus-visible { outline: 3px solid rgba(246, 96, 19, .45); outline-offset: 2px; border-radius: 2px; }

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; }
}