/* ============================================================
   asound notices v1 (as-notice) — 2026-08-11
   Jeden system komunikatow frontu. Enqueue: mu-plugins/asound-notices.php.

   Zastepuje wizualnie 4 rownolegle systemy. CELOWO nie edytujemy
   app.css (bundle Vite) ani account-v2/cart-v2/checkout-v2.css —
   stare reguly przegrywaja specyficznoscia z tym arkuszem:
   - app.css .woocommerce-message (0,1,0 — czerwona ramka na sukcesie)
   - account-v2 body.woocommerce-account .woocommerce-message (0,2,1)
   - cart-v2 .ck .woocommerce-info / checkout-v2 .asck-notices * (0,2,0)
   Neutralizacja ponizej ma 0,3,0 (+body = 0,3,1 tam gdzie trzeba).
   ============================================================ */

/* ---- wrapper: wszystkie notices jednej strony w pionowym stacku ---- */
.as-notices {
	display: grid;
	gap: 10px;
}
/* sekcje-nosniki notices sasiadujace ze soba nie dubluja odstepow */
.as-notices-section + .as-notices-section { margin-top: 0; }

/* ---- box ---- */
.as-notice {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	border: 1px solid #e7e7e7;
	border-left: 4px solid var(--asn-accent, #000);
	background: var(--asn-bg, #f6f6f6);
	padding: 14px 18px 14px 16px;
	font-family: "Noto Serif", serif;
	font-size: 14px;
	line-height: 1.55;
	font-weight: 500;
	color: #000;
}
.as-notice--error   { --asn-accent: #da0e16; --asn-bg: #fff1f2; }
.as-notice--success { --asn-accent: #1f7a32; --asn-bg: #eff8f1; }
.as-notice--info    { --asn-accent: #006acb; --asn-bg: #eff6fd; }
.as-notice--warning { --asn-accent: #8a5c00; --asn-bg: #fbf4e1; }

/* ---- ikona: wymuszenie stroke na poziomie klasy ----
   Atrybuty prezentacyjne SVG (stroke="currentColor") sa nadpisywane przez
   dowolny CSS (zweryfikowane: computed stroke:none na produkcji, ikona
   byla niewidoczna). Regula klasowa bije atrybuty i tamten reset. */
.as-notice .as-notice__icon,
.as-notice > svg {
	flex: none;
	width: 20px;
	height: 20px;
	margin-top: 1px;
	stroke: var(--asn-accent, currentColor);
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	color: var(--asn-accent, currentColor);
}

/* ---- neutralizacja starych stylow na elementach wewnetrznych ----
   .woocommerce-message/-error/-info zostaja w DOM (kompatybilnosc z JS
   Woo i pluginow), ale wewnatrz .as-notice sa czystym tekstem. */
.as-notices .as-notice .woocommerce-message,
.as-notices .as-notice .woocommerce-error,
.as-notices .as-notice .woocommerce-info,
body .as-notices .as-notice .woocommerce-message,
body .as-notices .as-notice .woocommerce-error,
body .as-notices .as-notice .woocommerce-info {
	flex: 1;
	min-width: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	padding: 0;
	margin: 0;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
	list-style: none;
	box-shadow: none;
	max-width: 75ch; /* tekst nie rozlewa sie na pelne 1400px siatki */
}

/* lista bledow w jednym boksie */
.as-notice ul.woocommerce-error { display: grid; gap: 5px; }
.as-notice ul.woocommerce-error li { margin: 0; padding: 0; }

/* ---- linki i akcje w tresci ---- */
.as-notice a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
	font-weight: 600;
}
/* "Zobacz koszyk" (a.button.wc-forward) jako brandowa pigulka */
.as-notice a.button {
	display: inline-flex;
	align-items: center;
	border: 1px solid #000;
	border-radius: 9999px;
	background: #fff;
	padding: 4px 16px;
	margin: -2px 10px 0 0; /* wc-forward stoi PRZED tekstem komunikatu */
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
	color: #000;
}
.as-notice a.button:hover { background: #000; color: #fff; }

/* ---- przycisk zamkniecia (dodawany przez notices.js) ---- */
.as-notice__close {
	flex: none;
	background: none;
	border: 0;
	cursor: pointer;
	padding: 2px;
	margin: 1px 0 0;
	color: #6d6d6d;
	line-height: 0;
}
.as-notice__close:hover,
.as-notice__close:focus-visible { color: #000; }
.as-notice__close:focus-visible { outline: 2px solid #000; outline-offset: 2px; }
.as-notice__close svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
}
.as-notice.is-dismissing {
	opacity: 0;
	transform: translateY(-4px);
	transition: opacity 0.2s ease, transform 0.2s ease;
}
@media (prefers-reduced-motion: reduce) {
	.as-notice.is-dismissing { transition: none; }
}

/* ---- checkout v2: checkout-v2.js chowa natywne notices klasa
   .asck-js-replaced (dodawana na ul.woocommerce-error LUB na wrapper
   .woocommerce-NoticeGroup-checkout) i buduje wlasny errsum.
   Gdy ukryte jest WNETRZE naszego boksa, chowamy caly .as-notice —
   inaczej zostalaby pusta czerwona ramka z ikona (bloker B1 z review).
   Sekcje-nosnik chowamy, gdy nie ma w niej juz zadnego widocznego notice. */
.as-notice:has(> .asck-js-replaced) {
	display: none;
}
/* Ukrycie CALEJ sekcji-nosnika, gdy wszystkie jej notices sa zreplacowane,
   wymaga zagniezdzonego :has() (invalid CSS, parser odrzuca cala regule) —
   robi to notices.js (hideReplacedSections) na eventach checkoutu. */

/* ============================================================
   FALLBACK: surowe klasy Woo POZA .as-notice (wstrzykniete AJAX-em,
   stare fragmenty, flexible-shipping). Specyficznosc 0,1,2
   (body + element + klasa; :not(:where()) = 0):
   - bije bezwarstwowa regule app.css .woocommerce-message (0,1,0),
     ktora inaczej robilaby hybryde zielone-tlo + czerwona ramka,
   - przegrywa z KAZDA regula scoped (0,2,0+), np. .asck-coupon-msg
     .woocommerce-error (minimalny tekst przy kuponie) — celowo.
   ============================================================ */
body ul.woocommerce-error:not(:where(.as-notice, .as-notice *)),
body div.woocommerce-error:not(:where(.as-notice, .as-notice *)) {
	border: 1px solid #e7e7e7;
	border-left: 4px solid #da0e16;
	background: #fff1f2;
	padding: 14px 18px;
	margin: 16px 0;
	font-size: 14px;
	font-weight: 500;
	color: #000;
	list-style: none;
}
body div.woocommerce-message:not(:where(.as-notice, .as-notice *)) {
	border: 1px solid #e7e7e7;
	border-left: 4px solid #1f7a32;
	background: #eff8f1;
	padding: 14px 18px;
	margin: 16px 0;
	font-size: 14px;
	font-weight: 500;
	color: #000;
}
body div.woocommerce-info:not(:where(.as-notice, .as-notice *)) {
	border: 1px solid #e7e7e7;
	border-left: 4px solid #006acb;
	background: #eff6fd;
	padding: 14px 18px;
	margin: 16px 0;
	font-size: 14px;
	font-weight: 500;
	color: #000;
	list-style: none;
}

/* ---- strona "Dziekujemy": platnosc odrzucona (thankyou.blade) —
   klasy .woocommerce-notice* nie mialy ZADNEGO css ---- */
.woocommerce-notice--error.woocommerce-thankyou-order-failed {
	border: 1px solid #e7e7e7;
	border-left: 4px solid #da0e16;
	background: #fff1f2;
	padding: 14px 18px;
	margin: 16px 0;
	font-size: 14px;
	font-weight: 500;
	color: #000;
}

/* ============================================================
   Contact Form 7 — te same warianty zamiast kolorow WP-admina
   (#00a0d2/#dc3232/#ffb900). Prefiks body = wygrana ze stockowym
   styles.css niezaleznie od kolejnosci ladowania.
   ============================================================ */
body .wpcf7 form .wpcf7-response-output {
	border: 1px solid #e7e7e7;
	border-left: 4px solid #006acb;
	background: #eff6fd;
	margin: 18px 0 0;
	padding: 14px 18px;
	font-size: 14px;
	font-weight: 500;
	color: #000;
}
body .wpcf7 form.sent .wpcf7-response-output {
	border-color: #e7e7e7;
	border-left-color: #1f7a32;
	background: #eff8f1;
}
body .wpcf7 form.failed .wpcf7-response-output,
body .wpcf7 form.aborted .wpcf7-response-output {
	border-color: #e7e7e7;
	border-left-color: #da0e16;
	background: #fff1f2;
}
body .wpcf7 form.spam .wpcf7-response-output,
body .wpcf7 form.invalid .wpcf7-response-output,
body .wpcf7 form.unaccepted .wpcf7-response-output,
body .wpcf7 form.payment-required .wpcf7-response-output {
	border-color: #e7e7e7;
	border-left-color: #8a5c00;
	background: #fbf4e1;
}
body .wpcf7 .wpcf7-not-valid-tip {
	color: #da0e16;
	font-size: 13px;
	font-weight: 500;
	margin-top: 6px;
}
body .wpcf7 input.wpcf7-not-valid,
body .wpcf7 textarea.wpcf7-not-valid {
	border-color: #da0e16;
}

/* ---- mobile ---- */
@media (max-width: 640px) {
	.as-notice { padding: 12px 14px 12px 12px; font-size: 13.5px; }
	.as-notice a.button { margin: 6px 10px 2px 0; } /* pigulka schodzi pod tekst przy zawijaniu */
}
