/*
 * AI Energy Advisor — warstwa prezentacji.
 *
 * Zachowuje język wizualny starej wtyczki: ciemny kontener, niebieski akcent
 * #046bd2, karty o promieniu 16px, przyciski w formie pigułek, asymetryczne
 * dymki i te same animacje wejścia.
 *
 * Różnice wobec starego arkusza:
 *  - jeden zestaw tokenów zamiast dwóch nakładających się systemów (stare
 *    reguły definiowały .eba-offer-card, .eba-offer-btn i @media 768px po
 *    dwa–trzy razy, wzajemnie się znosząc);
 *  - motyw ciemny jest tu decyzją zapisaną wprost. W starym arkuszu wynikał
 *    z pomyłki — zgubionego @media (prefers-color-scheme: dark) — przez co
 *    ciemny kontener sąsiadował z białymi kartami i regułą
 *    `.eba-offer-detail div { color: white !important }`, czyli ceny były
 *    białe na białym tle;
 *  - font ładujemy z zasobów systemowych, bez zapytania do Google Fonts —
 *    stary arkusz deklarował 'Inter' i nigdy go nie wczytywał, a wczytywanie
 *    go z CDN wiąże się z przekazaniem adresu IP odwiedzającego;
 *  - KAŻDY selektor komponentu jest zapisany jako `.aiea .aiea-xxx`
 *    (podwójna klasa), nie sama `.aiea-xxx`. Kontener ma dwa warianty
 *    znacznika (`#aiea-app` dla porównywarki, sam `.aiea.aiea-supplier`
 *    dla rejestracji dostawcy) — jedyna wspólna kotwica to klasa `.aiea`.
 *    Motywy WordPressa (np. Astra) potrafią narzucić własny kolor
 *    nagłówków/akapitów selektorem o wyższej specyficzności niż pojedyncza
 *    klasa — wtedy ciemny tekst motywu ląduje na ciemnym tle widgetu
 *    i znika. Podwójna klasa podnosi specyficzność ponad typowe reguły
 *    motywu bez użycia !important. Zobacz sekcję „Odporność na style
 *    motywu" niżej.
 */

.aiea {
	--aiea-primary: #046bd2;
	--aiea-primary-hover: #0356a8;
	--aiea-primary-soft: rgba( 4, 107, 210, 0.16 );

	--aiea-bg: #1a202c;
	--aiea-surface: #2d3748;
	--aiea-surface-2: #364154;
	--aiea-border: #4a5568;

	--aiea-text: #f7fafc;
	--aiea-text-muted: #a0aec0;

	/*
	 * Odnośniki mają własny token, jaśniejszy od --aiea-primary. Sam #046bd2
	 * na tle #1a202c daje kontrast 3,1:1, czyli poniżej progu WCAG AA (4,5:1)
	 * dla zwykłego tekstu. Ten odcień daje 7,1:1 na tle kontenera i 5,2:1
	 * na tle powierzchni — próg AA jest spełniony w obu miejscach.
	 */
	--aiea-link: #63b3ed;
	--aiea-link-hover: #90cdf4;

	--aiea-success: #22c55e;
	--aiea-success-soft: rgba( 34, 197, 94, 0.14 );
	--aiea-warning: #f6ad55;
	--aiea-danger: #fc8181;

	--aiea-radius-card: 16px;
	--aiea-radius-panel: 12px;
	--aiea-radius-input: 8px;
	--aiea-radius-pill: 999px;

	--aiea-shadow: 0 4px 20px rgba( 0, 0, 0, 0.28 );
	--aiea-shadow-lg: 0 8px 40px rgba( 0, 0, 0, 0.36 );

	--aiea-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
		'Helvetica Neue', Arial, sans-serif;

	box-sizing: border-box;
	width: min( 100% - 32px, 1200px );
	margin: 0 auto;
	padding: 28px;
	background: var( --aiea-bg );
	color: var( --aiea-text );
	border-radius: var( --aiea-radius-panel );
	box-shadow: var( --aiea-shadow );
	font-family: var( --aiea-font );
	font-size: 16px;
	line-height: 1.55;
}

.aiea *,
.aiea *::before,
.aiea *::after {
	box-sizing: inherit;
}

/* --- Nagłówek ---------------------------------------------------------- */

.aiea .aiea-head {
	margin-bottom: 22px;
}

.aiea .aiea-title {
	margin: 0 0 12px;
	font-size: 1.6rem;
	line-height: 1.25;
	color: var( --aiea-text );
}

.aiea .aiea-ai-badge {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	padding: 10px 14px;
	background: var( --aiea-primary-soft );
	border: 1px solid var( --aiea-primary );
	border-radius: var( --aiea-radius-input );
	font-size: 0.85rem;
	color: var( --aiea-text );
}

.aiea .aiea-ai-dot {
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	margin-top: 7px;
	border-radius: 50%;
	background: var( --aiea-primary );
}

/* --- Panele ------------------------------------------------------------ */

.aiea .aiea-panel {
	animation: aiea-slide-up 0.35s ease both;
}

.aiea .aiea-panel[hidden] {
	display: none;
}

.aiea .aiea-lead {
	margin: 0 0 20px;
	color: var( --aiea-text-muted );
}

.aiea .aiea-privacy {
	margin: 18px 0 0;
	padding: 10px 14px;
	background: var( --aiea-surface );
	border-left: 3px solid var( --aiea-success );
	border-radius: var( --aiea-radius-input );
	font-size: 0.82rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-back {
	margin-bottom: 16px;
	padding: 0;
	background: none;
	border: 0;
	color: var( --aiea-text-muted );
	font-family: inherit;
	font-size: 0.88rem;
	cursor: pointer;
}

.aiea .aiea-back:hover {
	color: var( --aiea-text );
}

/* --- Wybór ścieżki ----------------------------------------------------- */

.aiea .aiea-choices {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 240px, 1fr ) );
	gap: 16px;
}

.aiea .aiea-choice {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 28px 20px;
	background: var( --aiea-surface );
	border: 2px solid var( --aiea-border );
	border-radius: var( --aiea-radius-card );
	color: var( --aiea-text );
	font-family: inherit;
	cursor: pointer;
	transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.aiea .aiea-choice:hover,
.aiea .aiea-choice:focus-visible {
	transform: translateY( -2px );
	border-color: var( --aiea-primary );
	box-shadow: var( --aiea-shadow-lg );
}

.aiea .aiea-choice-icon {
	font-size: 2rem;
}

.aiea .aiea-choice-label {
	font-weight: 600;
	font-size: 1.02rem;
}

.aiea .aiea-choice-note {
	font-size: 0.8rem;
	color: var( --aiea-text-muted );
}

/* --- Upload ------------------------------------------------------------ */

.aiea .aiea-drop {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 44px 20px;
	background: var( --aiea-surface );
	border: 2px dashed var( --aiea-border );
	border-radius: var( --aiea-radius-card );
	text-align: center;
	cursor: pointer;
	transition: border-color 0.18s ease, background 0.18s ease;
}

.aiea .aiea-drop:hover,
.aiea .aiea-drop:focus-visible,
.aiea .aiea-drop.is-dragover {
	border-color: var( --aiea-primary );
	background: var( --aiea-surface-2 );
}

.aiea .aiea-file {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.aiea .aiea-drop-icon {
	font-size: 2.2rem;
}

.aiea .aiea-drop-hint {
	font-size: 0.84rem;
	color: var( --aiea-success );
}

.aiea .aiea-progress {
	margin-top: 16px;
}

.aiea .aiea-progress-bar {
	height: 8px;
	background: var( --aiea-surface-2 );
	border-radius: var( --aiea-radius-pill );
	overflow: hidden;
}

.aiea .aiea-progress-bar span {
	display: block;
	width: 0;
	height: 100%;
	background: var( --aiea-primary );
	border-radius: inherit;
	transition: width 0.2s ease;
}

.aiea .aiea-progress-label {
	margin: 8px 0 0;
	font-size: 0.84rem;
	color: var( --aiea-text-muted );
}

/* --- Formularz --------------------------------------------------------- */

.aiea .aiea-grid {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 260px, 1fr ) );
	gap: 18px;
}

/* Pozwala kontenerowi wstrzykiwanych pól nie łamać siatki. */
.aiea .aiea-contents {
	display: contents;
}

.aiea .aiea-field label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.86rem;
	font-weight: 600;
	color: var( --aiea-text );
}

.aiea .aiea-req {
	color: var( --aiea-danger );
}

.aiea .aiea-field input[type="text"],
.aiea .aiea-field input[type="number"],
.aiea .aiea-field select {
	width: 100%;
	padding: 10px 12px;
	background: var( --aiea-surface );
	border: 1px solid var( --aiea-border );
	border-radius: var( --aiea-radius-input );
	color: var( --aiea-text );
	font-family: inherit;
	font-size: 0.95rem;
}

.aiea .aiea-field input:focus,
.aiea .aiea-field select:focus {
	outline: 2px solid var( --aiea-primary );
	outline-offset: 1px;
	border-color: var( --aiea-primary );
}

.aiea .aiea-field.has-error input,
.aiea .aiea-field.has-error select {
	border-color: var( --aiea-danger );
}

.aiea .aiea-field-error {
	margin: 6px 0 0;
	font-size: 0.8rem;
	color: var( --aiea-danger );
}

.aiea .aiea-input-unit {
	display: flex;
	align-items: center;
	gap: 8px;
}

.aiea .aiea-input-unit span {
	flex: 0 0 auto;
	font-size: 0.86rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-hint {
	margin: 6px 0 0;
	font-size: 0.78rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-checks {
	margin: 22px 0 0;
	padding: 14px 16px;
	border: 1px solid var( --aiea-border );
	border-radius: var( --aiea-radius-input );
}

.aiea .aiea-checks label {
	display: block;
	margin-bottom: 8px;
	font-size: 0.9rem;
}

.aiea .aiea-checks label:last-child {
	margin-bottom: 0;
}

.aiea .aiea-checks .aiea-hint {
	display: inline;
	margin-left: 6px;
}

/* --- Przyciski --------------------------------------------------------- */

.aiea .aiea-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 22px;
}

.aiea .aiea-btn {
	padding: 12px 26px;
	border: 1px solid transparent;
	border-radius: var( --aiea-radius-pill );
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	transition: transform 0.18s ease, background 0.18s ease;
}

.aiea .aiea-btn:hover:not( :disabled ) {
	transform: translateY( -2px );
}

.aiea .aiea-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.aiea .aiea-btn-primary {
	background: var( --aiea-primary );
	color: #fff;
}

.aiea .aiea-btn-primary:hover:not( :disabled ) {
	background: var( --aiea-primary-hover );
}

.aiea .aiea-btn-ghost {
	background: transparent;
	border-color: var( --aiea-border );
	color: var( --aiea-text );
}

.aiea .aiea-btn-ghost:hover:not( :disabled ) {
	border-color: var( --aiea-primary );
}

.aiea .aiea-btn.is-busy {
	position: relative;
	color: transparent;
}

.aiea .aiea-btn.is-busy::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 16px;
	height: 16px;
	margin: -8px 0 0 -8px;
	border: 2px solid rgba( 255, 255, 255, 0.4 );
	border-top-color: #fff;
	border-radius: 50%;
	animation: aiea-spin 0.8s linear infinite;
}

/* --- Komunikaty -------------------------------------------------------- */

.aiea .aiea-live {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

.aiea .aiea-error {
	margin: 14px 0 0;
	padding: 10px 14px;
	background: rgba( 252, 129, 129, 0.12 );
	border-left: 3px solid var( --aiea-danger );
	border-radius: var( --aiea-radius-input );
	font-size: 0.88rem;
	color: var( --aiea-text );
}

.aiea .aiea-notice {
	margin: 0 0 12px;
	padding: 10px 14px;
	background: rgba( 246, 173, 85, 0.12 );
	border-left: 3px solid var( --aiea-warning );
	border-radius: var( --aiea-radius-input );
	font-size: 0.86rem;
	color: var( --aiea-text );
}

/* --- Wyniki ------------------------------------------------------------ */

.aiea .aiea-results-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
}

.aiea .aiea-sort {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.86rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-sort select {
	padding: 7px 10px;
	background: var( --aiea-surface );
	border: 1px solid var( --aiea-border );
	border-radius: var( --aiea-radius-input );
	color: var( --aiea-text );
	font-family: inherit;
}

.aiea .aiea-summary {
	margin: 0 0 6px;
	color: var( --aiea-text-muted );
}

.aiea .aiea-fallback-note {
	margin: 0 0 16px;
	font-size: 0.82rem;
	color: var( --aiea-warning );
}

.aiea .aiea-offers {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 340px, 1fr ) );
	gap: 20px;
}

.aiea .aiea-card {
	display: flex;
	flex-direction: column;
	background: var( --aiea-surface );
	border: 1px solid var( --aiea-border );
	border-radius: var( --aiea-radius-card );
	overflow: hidden;
	animation: aiea-card-in 0.45s ease both;
}

.aiea .aiea-card.is-top {
	border-color: var( --aiea-primary );
}

.aiea .aiea-card-head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 18px 18px 12px;
}

.aiea .aiea-card-logo {
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	object-fit: contain;
	background: #fff;
	border-radius: 8px;
	padding: 4px;
}

.aiea .aiea-card-titles {
	flex: 1 1 auto;
	min-width: 0;
}

.aiea .aiea-card-name {
	margin: 0;
	font-size: 1.03rem;
	font-weight: 700;
	color: var( --aiea-text );
}

.aiea .aiea-card-supplier {
	margin: 2px 0 0;
	font-size: 0.84rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-rank {
	flex: 0 0 auto;
	padding: 4px 10px;
	background: var( --aiea-primary-soft );
	border-radius: var( --aiea-radius-pill );
	font-size: 0.76rem;
	font-weight: 700;
	color: var( --aiea-text );
}

.aiea .aiea-savings {
	margin: 0 18px 12px;
	padding: 10px 14px;
	background: var( --aiea-success-soft );
	border-radius: var( --aiea-radius-input );
	color: var( --aiea-success );
	font-weight: 700;
}

.aiea .aiea-savings small {
	display: block;
	font-weight: 400;
	font-size: 0.76rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-figures {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1px;
	margin: 0 18px 14px;
	background: var( --aiea-border );
	border-radius: var( --aiea-radius-input );
	overflow: hidden;
}

.aiea .aiea-figure {
	padding: 10px 12px;
	background: var( --aiea-surface-2 );
}

.aiea .aiea-figure dt {
	margin: 0 0 2px;
	font-size: 0.74rem;
	color: var( --aiea-text-muted );
}

/* Jawny kolor tekstu na jawnym tle — miejsce, w którym stary arkusz
   ustawiał biały tekst na białym tle. */
.aiea .aiea-figure dd {
	margin: 0;
	font-size: 1rem;
	font-weight: 700;
	color: var( --aiea-text );
}

.aiea .aiea-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 18px 14px;
}

.aiea .aiea-tag {
	padding: 3px 10px;
	background: var( --aiea-surface-2 );
	border: 1px solid var( --aiea-border );
	border-radius: var( --aiea-radius-pill );
	font-size: 0.74rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-reasons {
	margin: 0 18px 12px;
	padding: 0;
	list-style: none;
	font-size: 0.85rem;
	color: var( --aiea-text );
}

.aiea .aiea-reasons li {
	position: relative;
	margin-bottom: 5px;
	padding-left: 18px;
}

.aiea .aiea-reasons li::before {
	position: absolute;
	left: 0;
	content: "✓";
	color: var( --aiea-success );
}

.aiea .aiea-concerns li::before {
	content: "!";
	color: var( --aiea-warning );
	font-weight: 700;
}

.aiea .aiea-breakdown {
	margin: 0 18px 14px;
	font-size: 0.82rem;
	color: var( --aiea-text );
}

.aiea .aiea-breakdown summary {
	cursor: pointer;
	color: var( --aiea-text-muted );
}

.aiea .aiea-breakdown table {
	width: 100%;
	margin-top: 8px;
	border-collapse: collapse;
}

.aiea .aiea-breakdown td {
	padding: 4px 0;
	border-bottom: 1px solid var( --aiea-border );
}

.aiea .aiea-breakdown td:last-child {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.aiea .aiea-breakdown tr:last-child td {
	border-bottom: 0;
	font-weight: 700;
}

.aiea .aiea-card-foot {
	margin-top: auto;
	padding: 14px 18px 18px;
}

.aiea .aiea-card-foot .aiea-btn {
	width: 100%;
}

.aiea .aiea-expired {
	margin: 0 18px 12px;
	font-size: 0.78rem;
	color: var( --aiea-warning );
}

.aiea .aiea-empty {
	padding: 34px;
	border: 1px dashed var( --aiea-border );
	border-radius: var( --aiea-radius-card );
	text-align: center;
	color: var( --aiea-text-muted );
}

/* --- Stopka ------------------------------------------------------------ */

.aiea .aiea-foot {
	margin-top: 28px;
	padding-top: 18px;
	border-top: 1px solid var( --aiea-border );
	font-size: 0.84rem;
	color: var( --aiea-text-muted );
}

.aiea .aiea-foot summary {
	cursor: pointer;
	font-weight: 600;
	color: var( --aiea-text );
}

.aiea .aiea-criteria {
	margin: 8px 0;
	padding: 0;
	list-style: none;
	columns: 2;
	column-gap: 24px;
}

.aiea .aiea-criteria li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	break-inside: avoid;
	padding: 3px 0;
}

.aiea .aiea-meta {
	margin: 6px 0 0;
	font-size: 0.78rem;
}

/* --- Rejestracja dostawcy ---------------------------------------------- */

.aiea .aiea-section-title {
	margin: 26px 0 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid var( --aiea-border );
	font-size: 1rem;
	font-weight: 700;
	color: var( --aiea-text );
}

.aiea.aiea-supplier .aiea-panel + .aiea-panel {
	margin-top: 28px;
	padding-top: 22px;
	border-top: 1px solid var( --aiea-border );
}

/*
 * Pułapka na boty. Ukrycie przez position, nie display:none — część
 * automatów pomija pola całkowicie usunięte z układu, ale wypełnia te,
 * które wciąż są w drzewie.
 */
.aiea .aiea-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Natywny formularz logowania WordPressa doprowadzony do reszty widgetu. */
.aiea .aiea-login .login-username,
.aiea .aiea-login .login-password {
	margin-bottom: 14px;
}

.aiea .aiea-login label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.86rem;
	font-weight: 600;
	color: var( --aiea-text );
}

.aiea .aiea-login input[type="text"],
.aiea .aiea-login input[type="password"] {
	width: 100%;
	padding: 10px 12px;
	background: var( --aiea-surface );
	border: 1px solid var( --aiea-border );
	border-radius: var( --aiea-radius-input );
	color: var( --aiea-text );
	font-family: inherit;
	font-size: 0.95rem;
}

.aiea .aiea-login input:focus {
	outline: 2px solid var( --aiea-primary );
	outline-offset: 1px;
}

.aiea .aiea-login .login-remember label {
	display: inline;
	font-weight: 400;
}

.aiea .aiea-login .login-submit input[type="submit"] {
	padding: 12px 26px;
	background: var( --aiea-primary );
	border: 0;
	border-radius: var( --aiea-radius-pill );
	color: #fff;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
}

.aiea .aiea-login .login-submit input[type="submit"]:hover {
	background: var( --aiea-primary-hover );
}

/* --- Odporność na style motywu ------------------------------------------
 *
 * Widget jest wstrzykiwany przez shortcode w nieznane miejsce strony —
 * najczęściej wewnątrz .entry-content motywu. Wiele motywów (np. Astra)
 * generuje własne reguły typografii dla nagłówków/akapitów w treści wpisu
 * z selektorem o wyższej specyficzności niż pojedyncza klasa, np.
 * `.ast-single-post .entry-content h1, h2, h3 { color: ... }`. Taka reguła
 * bije zwykłe `.aiea-title { color: ... }`, przez co ciemny kolor tekstu
 * motywu (pomyślany pod jasne tło) ląduje na ciemnym tle widgetu i znika.
 *
 * Rozwiązanie: każdy selektor komponentu w tym pliku ma postać
 * `.aiea .aiea-xxx` (podwójna klasa zamiast pojedynczej), co podnosi
 * specyficzność ponad typową regułę motywu bez `!important`. Nie da się
 * tu użyć jednego ID — porównywarka ma kontener `#aiea-app`, ale formularz
 * rejestracji dostawcy renderuje się jako osobny `.aiea.aiea-supplier` bez
 * ID, więc jedyną wspólną kotwicą obu szablonów jest klasa `.aiea`.
 *
 * Ten blok domyka podstawowe własności układu (padding, tło, kolor
 * tekstu) z `!important` jako ostatnią linią obrony — na wypadek motywu,
 * który sam używa `!important` albo resetuje generyczne elementy
 * (`div`, `h1`–`h6`, `p`) selektorem opartym o ID strony.
 * --------------------------------------------------------------------- */

.aiea {
	padding: 28px !important;
	background: var( --aiea-bg ) !important;
	color: var( --aiea-text ) !important;
}

.aiea .aiea-title,
.aiea .aiea-section-title,
.aiea .aiea-card-name,
.aiea .aiea-field label,
.aiea .aiea-checks label,
.aiea .aiea-login label {
	color: var( --aiea-text ) !important;
}

.aiea .aiea-lead,
.aiea .aiea-summary,
.aiea .aiea-hint,
.aiea .aiea-choice-note,
.aiea .aiea-card-supplier,
.aiea .aiea-figure dt,
.aiea .aiea-tag,
.aiea .aiea-sort,
.aiea .aiea-foot,
.aiea .aiea-back {
	color: var( --aiea-text-muted ) !important;
}

/*
 * Odnośniki. Arkusz nie miał dla nich ŻADNEJ reguły, więc dziedziczyły kolor
 * linków z motywu — dobrany pod jasne tło, na ciemnym kontenerze widgetu
 * praktycznie niewidoczny. Dotyczyło to m.in. odnośnika „regulamin" przy
 * zgodzie w formularzu sprzedawcy i „Nie pamiętam hasła" pod logowaniem.
 *
 * `!important`, bo typowa reguła motywu (`.entry-content a`) ma tę samą
 * specyficzność co `.aiea a` — o zwycięzcy decydowałaby wtedy kolejność
 * wczytania arkuszy, a motyw zwykle ładuje się po wtyczce.
 */
.aiea a {
	color: var( --aiea-link ) !important;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.aiea a:hover,
.aiea a:focus {
	color: var( --aiea-link-hover ) !important;
}

/* Przyciski są linkami tylko z wyglądu — nie podkreślamy ich. */
.aiea a.aiea-btn {
	text-decoration: none;
}

/*
 * Widoczny fokus klawiaturowy. Wymóg dostępności z art. 31g, a motyw potrafi
 * zdjąć domyślny outline przeglądarki (`outline: none`) bez dania niczego
 * w zamian.
 */
.aiea a:focus-visible,
.aiea button:focus-visible,
.aiea input:focus-visible,
.aiea select:focus-visible,
.aiea textarea:focus-visible {
	outline: 2px solid var( --aiea-link ) !important;
	outline-offset: 2px;
}

/*
 * Natywne pola wyboru renderują się w kolorystyce systemu, co na ciemnym tle
 * daje szary kwadrat ledwie odróżnialny od obramowania. `accent-color`
 * dociąga je do palety widgetu bez podmiany znacznika.
 */
.aiea input[type="checkbox"],
.aiea input[type="radio"] {
	accent-color: var( --aiea-primary );
	width: 15px;
	height: 15px;
	vertical-align: -2px;
}

/*
 * Przycisk wysyłki formularza sprzedawcy i natywny przycisk logowania
 * WordPressa. Motywy stylują `button` i `input[type="submit"]` agresywnie,
 * nierzadko z `!important` — bez tego bloku „Wyślij zgłoszenie" potrafi
 * dostać tło motywu i zniknąć na tle panelu.
 */
.aiea .aiea-btn-primary,
.aiea .aiea-login .login-submit input[type="submit"] {
	background: var( --aiea-primary ) !important;
	color: #fff !important;
	border-color: transparent !important;
}

.aiea .aiea-btn-primary:hover:not( :disabled ),
.aiea .aiea-login .login-submit input[type="submit"]:hover {
	background: var( --aiea-primary-hover ) !important;
}

/* --- Animacje ---------------------------------------------------------- */

@keyframes aiea-slide-up {
	from { opacity: 0; transform: translateY( 14px ); }
	to   { opacity: 1; transform: translateY( 0 ); }
}

@keyframes aiea-card-in {
	from { opacity: 0; transform: translateY( 18px ); }
	to   { opacity: 1; transform: translateY( 0 ); }
}

@keyframes aiea-spin {
	to { transform: rotate( 360deg ); }
}

@media ( prefers-reduced-motion: reduce ) {
	.aiea *,
	.aiea *::before,
	.aiea *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* --- Responsywność ----------------------------------------------------- */

@media ( max-width: 768px ) {
	.aiea {
		width: 100%;
		margin: 0;
		padding: 18px !important;
		border-radius: 0;
	}

	.aiea .aiea-title {
		font-size: 1.32rem;
	}

	.aiea .aiea-offers {
		grid-template-columns: 1fr;
	}

	.aiea .aiea-criteria {
		columns: 1;
	}

	.aiea .aiea-results-head {
		flex-direction: column;
		align-items: stretch;
	}
}

@media ( max-width: 480px ) {
	.aiea {
		padding: 14px !important;
		font-size: 15px;
	}

	.aiea .aiea-figures {
		grid-template-columns: 1fr;
	}

	.aiea .aiea-actions .aiea-btn {
		width: 100%;
	}
}