/**
 * ARAM — Panel klienta B2B (aram-account)
 * Style zakładek panelu: dane firmy, faktury, cennik, szybkie zamówienie.
 * Spójne z systemem (Figtree, cream #F6F2EA, accent #FE840C, ink #15140F).
 * Używa zmiennych :root z ds.css motywu, z literalnymi fallbackami.
 */

/* =====================================================================
   WYCENTROWANIE KONTA — naprawa (PRIORYTET)
   ---------------------------------------------------------------------
   PRZYCZYNA: WooCommerce core (woocommerce-blocktheme.css) na stronach
   konta nakłada na wrapper `.woocommerce` regułę:
       .woocommerce-account main .woocommerce { max-width: 1000px; }
   z margin:0 → kontener jest WĄSKI (1000px) i DOSUNIĘTY DO LEWEJ.
   Szablon my-account.php używa techniki full-bleed (.aram-bleed) z
   `margin-left: calc(50% - 50vw)`, gdzie 50% liczy się od RODZICA. Gdy
   rodzic ma 1000px i jest przy lewej, 50% = 500px (zamiast 50vw), więc
   bleed startuje ~220px za daleko w lewo → cała treść konta przesunięta
   w lewo i UCINANA (sidebar wchodzi w ujemne X).

   NAPRAWA: zdejmujemy narzucony cap, aby rodzic `.woocommerce` był pełnej
   szerokości — wtedy `calc(50% - 50vw)` = 0 i bleed pokrywa pełny ekran,
   a `.aram-bleed__inner` centruje treść do --maxw (1340px). Plik ładuje
   się PO woocommerce-blocktheme.css, więc równa specyficzność wygrywa;
   dla pewności dorzucamy `!important` na własności krytyczne.
   ===================================================================== */
.woocommerce-account main .woocommerce,
.woocommerce-account .woocommerce,
body.woocommerce-account .entry-content .woocommerce {
	max-width: none !important;
	width: auto !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Twardy fallback centrowania — niezależny od techniki bleed.
   Gdyby z jakiegoś powodu rodzic NIE był pełnej szerokości, ten blok i
   tak wyśrodkuje wewnętrzny kontener konta do 1340px i nie pozwoli ucinać
   treści (margin-inline:auto + bezpieczny padding). */
.aram-account.aram-bleed {
	width: 100%;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.aram-account .aram-account__inner,
.aram-account.aram-bleed > .aram-bleed__inner {
	max-width: var(--maxw, 1340px);
	margin-inline: auto !important;
	padding-inline: var(--pad-x, 48px);
	box-sizing: border-box;
}

/* Siatka sidebar + treść NIE może wypychać treści poza ekran:
   prawa kolumna `minmax(0, 1fr)` (a nie `1fr`) gwarantuje, że długie
   tabele/teksty zawijają się zamiast rozpychać layout. */
.aram-account .aram-account__layout {
	grid-template-columns: 260px minmax(0, 1fr);
}
.aram-account .aram-account__content { min-width: 0; max-width: 100%; }

/* KRYTYCZNE: WooCommerce core ustawia klasyczny layout floatów:
       .woocommerce-MyAccount-navigation { float: left; width: 35%; }
       .woocommerce-MyAccount-content    { float: right; width: 65%; }
   Float wyrywa sidebar z siatki CSS Grid i ZWĘŻA kartę nawigacji do
   szerokości treści (~78px) — etykiety się łamią, a kafle zachodzą.
   Zerujemy float/width, aby oba bloki były normalnymi komórkami gridu. */
.aram-account .aram-account__layout > .woocommerce-MyAccount-navigation,
.aram-account .aram-anav {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}
.aram-account .aram-account__layout > .woocommerce-MyAccount-content,
.aram-account .aram-account__content {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
}

/* Telefon: mniejszy padding boczny, jedna kolumna (sidebar nad treścią). */
@media (max-width: 980px) {
	.aram-account .aram-account__layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
	.aram-account .aram-account__inner,
	.aram-account.aram-bleed > .aram-bleed__inner {
		padding-inline: 16px;
	}
}

.aram-acc {
	--acc-cream: var(--cream-bg, #F6F2EA);
	--acc-card: var(--cream-card, #FAF8F4);
	--acc-ink: var(--ink, #15140F);
	--acc-ink-text: var(--ink-text, #1A1A17);
	--acc-accent: var(--accent, #FE840C);
	--acc-accent-ink: var(--accent-ink, #7A3D04);
	--acc-field: var(--field-1, #E2DCD0);
	--acc-line: var(--line-1, rgba(0,0,0,.07));
	--acc-muted: var(--text-muted, #524E46);

	font-family: 'Figtree', system-ui, -apple-system, sans-serif;
	color: var(--acc-ink-text);
}
.aram-acc * { box-sizing: border-box; }

/* =====================================================================
   NAWIGACJA KONTA — ikony + wyróżniony „Wyloguj się"
   Sidebar to biała karta (tło/obramowanie/sticky w shop.css). Tu: układ
   pozycji z ikoną, oddzielona stopka z przyciskiem wylogowania.
   ===================================================================== */
.aram-anav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.aram-anav__list li { margin: 0; border: 0; padding: 0; }

/* Link pozycji: ikona + etykieta w jednej linii (override block z shop.css). */
.aram-anav .aram-anav__list li a {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 11px 14px;
	border-radius: 9px;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.25;
	color: var(--text-muted-2, #4a4740);
	text-decoration: none;
	transition: background .2s ease, color .2s ease;
}
.aram-anav .aram-anav__list li a:hover {
	background: var(--cream-2, #EFE9DD);
	color: var(--ink-text, #1A1A17);
}
.aram-anav__ic { flex: 0 0 18px; opacity: .85; }
.aram-anav__label { flex: 1 1 auto; min-width: 0; }

/* Aktywna zakładka — ciemne tło, jasny tekst (spójne z systemem). */
.aram-anav .aram-anav__list li.is-active > a,
.aram-anav .aram-anav__list li a[aria-current="page"] {
	background: var(--ink, #15140F);
	color: var(--cream-bg, #F6F2EA);
}
.aram-anav .aram-anav__list li.is-active > a .aram-anav__ic,
.aram-anav .aram-anav__list li a[aria-current="page"] .aram-anav__ic { opacity: 1; color: var(--accent, #FE840C); }

/* Stopka nawigacji: separator + przycisk „Wyloguj się" (zawsze widoczny). */
.aram-anav__foot {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid var(--line-1, rgba(0,0,0,.07));
}
.aram-anav__logout {
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 11px 14px;
	border-radius: 9px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--accent-ink, #7A3D04);
	background: rgba(254,132,12,.08);
	border: 1px solid rgba(254,132,12,.22);
	text-decoration: none;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.aram-anav__logout:hover {
	background: var(--accent, #FE840C);
	border-color: var(--accent, #FE840C);
	/* ink zamiast #fff: tekst biały na akcencie = 2.46:1 (FAIL), ink = 7.08:1 (AAA). */
	color: var(--ink, #15140F);
}
.aram-anav__logout .aram-anav__ic { opacity: 1; }

/* ---- Nagłówek sekcji ---- */
.aram-acc__head { margin: 0 0 26px; }
.aram-acc__head--split {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
}
.aram-acc__title {
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 300;
	letter-spacing: -0.02em;
	margin: 0 0 8px;
	color: var(--acc-ink);
}
.aram-acc__lead {
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--acc-muted);
	max-width: 62ch;
	margin: 0;
}

/* ---- Panele / karty ---- */
.aram-acc-panel,
.aram-acc__panel {
	background: #fff;
	border: 1px solid var(--acc-line);
	border-radius: 14px;
	padding: 22px 24px;
}

/* ---- Podsumowanie firmy (chipy) ---- */
.aram-acc-summary {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 20px;
	margin-bottom: 24px;
}
.aram-acc-summary__item { display: flex; flex-direction: column; gap: 5px; }
.aram-acc-summary__label {
	font-size: 11.5px;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-weight: 600;
	color: var(--acc-muted);
}
.aram-acc-summary__value { font-size: 16px; font-weight: 600; color: var(--acc-ink); }

.aram-acc-tag {
	display: inline-block;
	margin-left: 6px;
	padding: 2px 9px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 600;
	vertical-align: middle;
}
.aram-acc-tag--ok { background: rgba(117,135,69,.14); color: #4a5a24; }
/* Adres z NIP-em o błędnej sumie kontrolnej (naprawa 07.2026) — paleta spójna
   z .aram-acc-status--refunded / .aram-acc-paid--overdue. */
.aram-acc-tag--warn { background: rgba(170,40,40,.14); color: #922; cursor: help; }

/* ---- Formularze ---- */
.aram-acc-form { margin: 0; }
.aram-acc-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px 22px;
}
.aram-acc-field { display: flex; flex-direction: column; gap: 7px; margin: 0; }
.aram-acc-field--wide { grid-column: 1 / -1; }
.aram-acc-field label {
	font-size: 13px;
	font-weight: 600;
	color: var(--acc-ink-text);
}
.aram-acc-field .required { color: var(--acc-accent); }
.aram-acc .aram-input {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--acc-field);
	border-radius: 10px;
	background: #fff;
	font: inherit;
	font-size: 15px;
	color: var(--acc-ink-text);
	transition: border-color .2s ease, box-shadow .2s ease;
}
.aram-acc .aram-input:focus {
	outline: none;
	border-color: var(--acc-accent);
	box-shadow: 0 0 0 3px rgba(254,132,12,.14);
}
.aram-acc .aram-input[readonly] { background: var(--acc-cream); color: var(--acc-muted); cursor: not-allowed; }
.aram-acc-hint { font-size: 12.5px; color: var(--acc-muted); line-height: 1.5; margin: 2px 0 0; }
.aram-acc-actions { margin-top: 22px; display: flex; gap: 12px; flex-wrap: wrap; }

/* ---- Dane firmy: NIP + przycisk „Pobierz z GUS" w jednym wierszu ---- */
.aram-acc-gus-row { display: flex; gap: 8px; align-items: stretch; }
.aram-acc-gus-row .aram-input { flex: 1 1 auto; min-width: 0; }
.aram-acc-gus-row .aram-acc-btn { flex: 0 0 auto; white-space: nowrap; }

/* ---- Przyciski (pill) ---- */
.aram-acc-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	border-radius: 999px;
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1;
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease, background .2s ease, color .2s ease;
}
/* ink zamiast #fff: biały na akcencie = 2.46:1 (FAIL 4.5:1), ink = 7.08:1 (AAA). */
.aram-acc-btn--primary { background: var(--acc-accent); color: var(--acc-ink, #15140F); }
.aram-acc-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -12px rgba(254,132,12,.6); color: var(--acc-ink, #15140F); }
.aram-acc-btn--ghost { background: transparent; border-color: var(--acc-field); color: var(--acc-ink-text); }
.aram-acc-btn--ghost:hover { border-color: var(--acc-accent); color: var(--acc-accent-ink); }
.aram-acc-btn--sm { padding: 8px 16px; font-size: 13px; }

/* ---- Tabele ---- */
.aram-acc-tablewrap { overflow-x: auto; border-radius: 14px; border: 1px solid var(--acc-line); background: #fff; }
.aram-acc-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
.aram-acc-table th {
	background: var(--acc-ink);
	color: var(--acc-cream);
	font-weight: 600;
	font-size: 11.5px;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 13px 16px;
	text-align: left;
	white-space: nowrap;
}
.aram-acc-table td {
	padding: 13px 16px;
	border-top: 1px solid var(--acc-line);
	color: var(--acc-ink-text);
	vertical-align: middle;
}
.aram-acc-table tbody tr:hover td { background: var(--cream-3, #FBF8F2); }
.aram-acc-num { text-align: right; white-space: nowrap; }
.aram-acc-price strong { color: var(--acc-accent-ink); font-size: 15px; }
.aram-acc-table del { color: var(--acc-muted); font-size: 13px; }
.aram-acc-sku { font-variant-numeric: tabular-nums; font-size: 13px; color: var(--acc-muted); }
.aram-acc-link { color: var(--acc-ink-text); font-weight: 500; text-decoration: none; border-bottom: 1px solid transparent; }
.aram-acc-link:hover { color: var(--acc-accent-ink); border-bottom-color: currentColor; }
.aram-acc-muted { color: var(--acc-muted); font-size: 13px; }
.aram-acc-actions-col { text-align: right; }
.aram-acc-actions-col--stack {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 6px;
}
.aram-acc-actions-col--stack .aram-acc-btn { width: max-content; }
.aram-acc-ksef-pending { display: block; max-width: 210px; line-height: 1.45; text-align: right; }

/* ---- Statusy zamówień / faktur ---- */
.aram-acc-status {
	display: inline-block;
	padding: 4px 11px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
	background: var(--acc-cream);
	color: var(--acc-ink-text);
}
.aram-acc-status--completed { background: rgba(117,135,69,.16); color: #4a5a24; }
.aram-acc-status--processing { background: rgba(254,132,12,.16); color: var(--acc-accent-ink); }
.aram-acc-status--on-hold,
.aram-acc-status--pending { background: rgba(0,0,0,.06); color: #555; }
.aram-acc-status--cancelled,
.aram-acc-status--failed,
.aram-acc-status--refunded { background: rgba(170,40,40,.12); color: #922; }

/* ---- ZADANIE KFS — korekta faktury (zakładka „Faktury”, wiersz obok faktur) ----
   #922/rgba(170,40,40,…) reużyte z istniejącej palety „ostrzegawczej” tego
   pliku (.aram-acc-status--cancelled, .aram-acc-paid--overdue wyżej/niżej) —
   ta sama semantyka „wymaga uwagi”, ten sam już sprawdzony kontrast na tle
   --acc-cream/białym. Kolor jest tu WYŁĄCZNIE wzmocnieniem: sam tekst
   „Korekta faktury” (inny wyraz niż „Faktura”) i minus w kwocie netto już
   niosą tę informację jako tekst, nie tylko jako barwa (WCAG 1.4.1). */
.aram-acc-korekta-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	padding: 3px 9px;
	border-radius: 20px;
	background: rgba(170,40,40,.12);
	color: #922;
	margin-bottom: 3px;
}
.aram-acc-korekta-ref { display: block; font-size: 12.5px; color: var(--acc-muted); margin-top: 2px; }
.aram-acc-amount--negative { color: #922; font-weight: 700; }
.aram-acc-row--korekta td { background: rgba(170,40,40,.04); }
/* Specyficzność musi przebić .aram-acc-table tbody tr:hover td (bez !important). */
.aram-acc-table tbody tr.aram-acc-row--korekta:hover td { background: rgba(170,40,40,.08); }

/* ---- Stan pusty ---- */
.aram-acc-empty {
	background: #fff;
	border: 1px dashed var(--acc-field);
	border-radius: 14px;
	padding: 40px 28px;
	text-align: center;
}
.aram-acc-empty p { color: var(--acc-muted); font-size: 15px; margin: 0 0 18px; }
.aram-acc-empty--sm { padding: 20px; margin-bottom: 24px; }
.aram-acc-empty--sm p { margin: 0; font-size: 14px; }

/* ---- Adresy: książka adresów dostawy i rozliczeniowych (karty + formularz dodaj/edytuj) ---- */
.aram-acc-addr-group { margin-bottom: 26px; }
.aram-acc-addr-group .aram-acc-sl-grid { margin-top: 12px; }
.aram-acc-addr-card__body { font-size: 13.5px; line-height: 1.6; color: var(--acc-ink-text); }
#aram-acc-address-form { margin-top: 6px; }

/* ---- Ulubione: siatka kafelków (reużywa .pcard/.aram-grid z motywu) ---- */
.aram-acc-favorites-grid {
	grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 780px) {
	.aram-acc-favorites-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.aram-acc-favorites-grid { grid-template-columns: 1fr; }
}

/* ---- Cennik: pasek stopnia ---- */
.aram-acc-tier {
	display: flex;
	align-items: center;
	gap: 32px;
	flex-wrap: wrap;
	background: var(--acc-ink);
	color: var(--acc-cream);
	border-radius: 16px;
	padding: 22px 26px;
	margin-bottom: 28px;
}
.aram-acc-tier__main { display: flex; flex-direction: column; gap: 9px; }
.aram-acc-tier__label { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; opacity: .72; }
.aram-acc-badge {
	display: inline-block;
	padding: 5px 14px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .02em;
}
.aram-acc-tier__metric { display: flex; flex-direction: column; gap: 2px; }
.aram-acc-tier__num { font-size: 38px; font-weight: 300; line-height: 1; color: var(--acc-accent); }
.aram-acc-tier__num span { font-size: 20px; margin-left: 2px; }
.aram-acc-tier__metric-lbl { font-size: 12.5px; opacity: .75; }
.aram-acc-tier__next { font-size: 13px; line-height: 1.5; opacity: .85; margin-left: auto; max-width: 240px; }
.aram-acc-tier__next strong { color: var(--acc-accent); font-weight: 600; }

/* ---- Cennik: „Twoje warunki handlowe" (stopień lojalnościowy + itemizacja) ---- */
.aram-acc-terms { margin-bottom: 28px; }
.aram-acc-terms__title { font-size: 18px; font-weight: 600; color: var(--acc-ink); margin: 0 0 14px; }
.aram-acc-terms__table { margin-top: 14px; }
.aram-acc-terms__total td { background: var(--acc-cream); }

/* ---- Cennik: kolumna „Zamów więcej, taniej" + przelicznik ilości ---- */
.aram-acc-priceplan-col { min-width: 220px; white-space: normal; }
.aram-acc-priceplan { display: flex; flex-direction: column; gap: 8px; }
.aram-acc-priceplan__msg { margin: 0; font-size: 13px; line-height: 1.45; color: var(--acc-ink-text); }
.aram-acc-calc__lbl { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--acc-muted); margin-bottom: 4px; }
.aram-acc-calc__row { display: flex; align-items: center; gap: 8px; }
.aram-acc-calc__qty { width: 72px; padding: 7px 8px; text-align: center; }
.aram-acc-calc__out { font-size: 13.5px; font-weight: 600; color: var(--acc-accent-ink); white-space: nowrap; }
@media (max-width: 640px) {
	.aram-acc-table--pricelist td.aram-acc-priceplan-col {
		display: block !important;
		text-align: left !important;
	}
	.aram-acc-table--pricelist td.aram-acc-priceplan-col::before { display: block; margin-bottom: 6px; }
	.aram-acc-priceplan { align-items: flex-start; }
}

/* ---- Cennik: grupy kategorii ---- */
.aram-acc-catgroup { margin-bottom: 28px; }
.aram-acc-catgroup__title {
	font-size: 17px;
	font-weight: 600;
	color: var(--acc-ink);
	margin: 0 0 12px;
	padding-left: 12px;
	border-left: 3px solid var(--acc-accent);
}
.aram-acc-foot-note { font-size: 12.5px; color: var(--acc-muted); font-style: italic; }

/* ---- Cennik: nawigacja kategorii (paginacja serwerowa — jedna kategoria =
   jedna strona, parametr URL `cennik_kat`; patrz Aram\Account\Pricelist). ---- */
.aram-acc-catnav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 24px;
}
.aram-acc-catnav__label {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--acc-muted);
	margin-right: 2px;
}
.aram-acc-catnav__pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 16px;
	border-radius: 999px;
	border: 1px solid var(--acc-field);
	background: #fff;
	color: var(--acc-ink-text);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.aram-acc-catnav__pill i { font-style: normal; color: var(--acc-muted); font-weight: 600; }
.aram-acc-catnav__pill:hover { border-color: var(--acc-accent); color: var(--acc-accent-ink); }
.aram-acc-catnav__pill.is-active { background: var(--acc-ink); border-color: var(--acc-ink); color: var(--acc-cream); }
.aram-acc-catnav__pill.is-active i { color: inherit; opacity: .7; }

.aram-acc-catpager {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-top: 22px;
}
@media (max-width: 480px) {
	.aram-acc-catpager { flex-direction: column; align-items: stretch; }
	.aram-acc-catpager .aram-acc-btn { justify-content: center; }
}

/* ---- Cennik: nazwa produktu — długie nazwy nie rozjeżdżają kolumny (2 linie
   + wielokropek; nazwa zostaje pełna w treści linku/title, więc jest dostępna
   dla czytników i po najechaniu). ---- */
.aram-acc-prodname {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	max-width: 280px;
	word-break: normal;
	overflow-wrap: anywhere;
}

/* ---- Szybkie zamówienie ---- */
.aram-acc-quick-grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 24px;
	align-items: start;
}
.aram-acc-file {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	text-align: center;
	padding: 34px 24px;
	border: 2px dashed var(--acc-field);
	border-radius: 14px;
	background: var(--acc-cream);
	color: var(--acc-accent-ink);
	cursor: pointer;
	transition: border-color .2s ease, background .2s ease;
}
.aram-acc-file:hover { border-color: var(--acc-accent); background: #fff; }
.aram-acc-file__main { font-size: 15px; font-weight: 600; color: var(--acc-ink-text); }
.aram-acc-file__name { font-size: 13px; color: var(--acc-muted); }
.aram-acc-file input[type="file"] { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

.aram-acc-quick__help-title { font-size: 16px; font-weight: 600; margin: 0 0 14px; color: var(--acc-ink); }
.aram-acc-steps { margin: 0 0 16px; padding-left: 20px; }
.aram-acc-steps li { font-size: 14px; line-height: 1.7; color: var(--acc-ink-text); }
.aram-acc-steps code,
.aram-acc-csv-example code {
	background: var(--acc-cream);
	border: 1px solid var(--acc-line);
	border-radius: 5px;
	padding: 1px 6px;
	font-size: 12.5px;
}
.aram-acc-csv-example {
	margin-top: 16px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
}
.aram-acc-csv-example code { background: var(--acc-ink); color: var(--acc-cream); border: none; padding: 4px 10px; border-radius: 6px; }

/* ---- Responsywność ---- */
@media (max-width: 860px) {
	.aram-acc-grid { grid-template-columns: 1fr; }
	.aram-acc-quick-grid { grid-template-columns: 1fr; }
	.aram-acc-tier { gap: 20px; }
	.aram-acc-tier__next { margin-left: 0; }
}

/* Telefon (≤560px): panele i karty z mniejszym paddingiem, podsumowanie 1 kol
   na bardzo wąsko, pasek stopnia w pionie z mniejszą liczbą. */
@media (max-width: 560px) {
	.aram-acc-panel,
	.aram-acc__panel { padding: 18px 16px; }
	.aram-acc-summary { grid-template-columns: 1fr 1fr; gap: 14px; }
	.aram-acc-tier { padding: 20px; gap: 16px; }
	.aram-acc-tier__num { font-size: 32px; }
	.aram-acc-tier__num span { font-size: 17px; }
	/* Akcje formularza pełnej szerokości — łatwiejszy tap. */
	.aram-acc-actions { flex-direction: column; align-items: stretch; }
	.aram-acc-actions .aram-acc-btn { justify-content: center; }
	/* Przykład CSV (monospace) nie rozpycha — pozwól zawijać. */
	.aram-acc-csv-example { overflow-x: auto; }
	.aram-acc-csv-example code { white-space: nowrap; }
}

@media (max-width: 400px) {
	.aram-acc-summary { grid-template-columns: 1fr; }
}

/* Tabele → karty na wąskich ekranach (pricelist/faktury) */
@media (max-width: 640px) {
	.aram-acc-table--invoices,
	.aram-acc-table--pricelist,
	.aram-acc-table--invoices thead,
	.aram-acc-table--pricelist thead,
	.aram-acc-table--invoices tbody,
	.aram-acc-table--pricelist tbody,
	.aram-acc-table--invoices tr,
	.aram-acc-table--pricelist tr,
	.aram-acc-table--invoices td,
	.aram-acc-table--pricelist td { display: block; width: 100%; }
	.aram-acc-table--invoices thead,
	.aram-acc-table--pricelist thead { display: none; }
	.aram-acc-table--invoices tr,
	.aram-acc-table--pricelist tr {
		border-top: 1px solid var(--acc-line);
		padding: 8px 4px;
	}
	.aram-acc-table--invoices td,
	.aram-acc-table--pricelist td {
		border: none;
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 16px;
		padding: 7px 12px;
		text-align: right;
	}
	.aram-acc-table--invoices td::before,
	.aram-acc-table--pricelist td::before {
		content: attr(data-label);
		font-size: 11.5px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .04em;
		color: var(--acc-muted);
		text-align: left;
	}
}

/* ---- Pulpit (dashboard) — sekcja B2B ---- */
.aram-dash-b2b { margin-top: 30px; }
.aram-dash-tier-card {
	display: flex;
	align-items: center;
	gap: 28px;
	flex-wrap: wrap;
	background: var(--ink, #15140F);
	color: var(--cream-bg, #F6F2EA);
	border-radius: 16px;
	padding: 24px 28px;
	margin-bottom: 22px;
}
.aram-dash-tier-card__head { display: flex; flex-direction: column; gap: 9px; }
.aram-dash-tier-card__eyebrow { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; opacity: .72; }
.aram-dash-tier-card__progress { flex: 1; min-width: 200px; }
.aram-dash-tier-card__bar {
	height: 8px;
	border-radius: 99px;
	background: rgba(255,255,255,.16);
	overflow: hidden;
	margin-bottom: 8px;
}
.aram-dash-tier-card__bar > span { display: block; height: 100%; background: var(--accent, #FE840C); border-radius: 99px; }
.aram-dash-tier-card__progress small { font-size: 12.5px; opacity: .82; }
.aram-dash-credit {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 16px;
	margin-bottom: 8px;
}
.aram-dash-credit__item {
	background: #fff;
	border: 1px solid var(--line-1, rgba(0,0,0,.07));
	border-radius: 12px;
	padding: 16px 18px;
}
.aram-dash-credit__num { font-size: 22px; font-weight: 600; color: var(--ink, #15140F); display: block; }
.aram-dash-credit__lbl { font-size: 12.5px; color: var(--text-muted, #524E46); }
.aram-dash-credit__bar { height: 7px; border-radius: 99px; background: var(--cream-2, #EFE9DD); overflow: hidden; margin-top: 12px; }
.aram-dash-credit__bar > span { display: block; height: 100%; background: var(--accent, #FE840C); }

/* ---- Baner nieopłaconych faktur (pulpit „Moje konto") ----
   Reużywa struktury `.aram-dash__banner` z motywu (ikona + strong + span),
   dodaje własne warianty koloru (ostrzegawczy / przeterminowany) — motywu
   nie modyfikujemy, warianty żyją tylko w assetach tej wtyczki. */
.aram-dash__banner--unpaid { background: rgba(254,132,12,.1); color: var(--acc-accent-ink, #7A3D04); }
.aram-dash__banner--unpaid strong { color: var(--acc-accent-ink, #7A3D04); }
.aram-dash__banner--overdue { background: rgba(170,40,40,.1); color: #922; }
.aram-dash__banner--overdue strong { color: #922; }
.aram-dash__banner-link {
	display: inline-block;
	margin-top: 8px;
	font-weight: 600;
	text-decoration: underline;
	color: inherit;
}
.aram-dash__banner-link:hover { opacity: .8; }

/* ---- Status płatności faktury (badge w tabeli Faktury) ---- */
.aram-acc-paid {
	display: inline-block;
	margin-left: 6px;
	padding: 3px 9px;
	border-radius: 20px;
	font-size: 11px;
	font-weight: 600;
	vertical-align: middle;
}
.aram-acc-paid--yes { background: rgba(117,135,69,.16); color: #4a5a24; }
.aram-acc-paid--no { background: rgba(0,0,0,.06); color: #555; }
.aram-acc-paid--overdue { background: rgba(170,40,40,.14); color: #922; }

/* PAKIET TERMINY PŁATNOŚCI (08.2026) — „Po terminie o N dni" pod badge'em
   płatności (kolumna „Płatność" tabeli Faktury i baner nieopłaconych na
   pulpicie „Moje konto") — wyraźny czerwony akcent, spójny z .aram-acc-paid--overdue. */
.aram-acc-overdue-days { color: #922; font-weight: 600; font-size: 12.5px; margin-top: 2px; }

/* =====================================================================
   LISTY ZAKUPOWE — widok główny (karty), widok szczegółów (tabela),
   modal (nowa lista / zmień nazwę), popover (karta produktu) i toast.
   ===================================================================== */

.aram-acc-sl-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 18px;
}

.aram-acc-sl-card {
	background: #fff;
	border: 1px solid var(--acc-line, rgba(0,0,0,.08));
	border-radius: 16px;
	padding: 20px 22px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.aram-acc-sl-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.aram-acc-sl-card__name { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.35; }
.aram-acc-sl-card__meta { font-size: 13px; color: var(--acc-muted); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.aram-acc-sl-card__dot { opacity: .5; }
.aram-acc-sl-card__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: auto; padding-top: 4px; }
.aram-acc-sl-card__actions .aram-acc-btn { flex: 0 0 auto; }

.aram-acc-sl-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 1px solid var(--acc-line, rgba(0,0,0,.08));
	background: #fff;
	color: var(--acc-ink-text, #4a463f);
	cursor: pointer;
	transition: border-color .15s ease, color .15s ease, background .15s ease;
	flex-shrink: 0;
	margin-left: auto;
}
.aram-acc-sl-icon-btn:hover { border-color: var(--acc-accent, #FE840C); color: var(--acc-accent-ink, #7A3D04); }
.aram-acc-sl-icon-btn--danger:hover { border-color: #b3382c; color: #b3382c; background: rgba(170,40,40,.06); }

/* Widok szczegółów listy */
.aram-acc-back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--acc-ink-text, #4a463f);
	text-decoration: none;
	margin-bottom: 18px;
}
.aram-acc-back:hover { color: var(--acc-accent-ink, #7A3D04); }

.aram-acc-sld-cell-thumb { width: 56px; }
.aram-acc-sld-cell-thumb img { width: 48px; height: 48px; object-fit: cover; border-radius: 10px; display: block; }
.aram-acc-sld-stepper { display: inline-flex; }
.aram-acc-sld-total-lbl { font-weight: 600; text-align: right; color: var(--acc-ink, #15140F); }

/* Modal (nowa lista / zmień nazwę / zapisz koszyk) */
.aram-acc-sl-overlay,
.aram-sl-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(21,20,15,.45);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	z-index: 9000;
}
.aram-acc-sl-modal {
	background: #fff;
	border-radius: 16px;
	padding: 26px 28px;
	max-width: 420px;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 14px;
	box-shadow: 0 30px 60px -20px rgba(0,0,0,.35);
}
.aram-acc-sl-modal__title { margin: 0; font-size: 18px; font-weight: 600; color: var(--acc-ink, #15140F); }
.aram-acc-sl-modal__err { margin: 0; font-size: 13px; color: #b3382c; }
.aram-acc-sl-modal__actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 4px; }

/* Popover „Dodaj do listy" (karta produktu, buy-box) — karta ds: białe tło,
   radius 14, cień, strzałka/anchor przy przycisku (desktop); mobile = bottom
   sheet fixed, spójny z popupem ilości (.aram-qpop w shop.css). */
.aram-sl-pop__overlay {
	position: fixed;
	inset: 0;
	background: transparent;
	z-index: 7999;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .2s ease, visibility .2s ease;
}
.aram-sl-pop__overlay.is-open { pointer-events: auto; }
.aram-sl-pop {
	position: fixed;
	z-index: 8000;
	min-width: 240px;
	max-width: 300px;
	background: #fff;
	border: 1px solid var(--acc-line, rgba(0,0,0,.08));
	border-radius: 14px;
	box-shadow: 0 24px 48px -18px rgba(0,0,0,.28);
	padding: 10px;
	opacity: 0;
	transform: translateY(-6px) scale(.98);
	transform-origin: top right;
	transition: opacity .18s ease, transform .18s ease;
	pointer-events: none;
}
.aram-sl-pop.is-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
/* Strzałka wskazująca trigger (desktop) — pozycja pozioma z --aram-sl-pop-arrow (JS). */
.aram-sl-pop::before {
	content: '';
	position: absolute;
	top: -6px;
	right: var(--aram-sl-pop-arrow, 16px);
	width: 12px; height: 12px;
	background: #fff;
	border-left: 1px solid var(--acc-line, rgba(0,0,0,.08));
	border-top: 1px solid var(--acc-line, rgba(0,0,0,.08));
	transform: translateX(50%) rotate(45deg);
}
.aram-sl-pop--above { transform-origin: bottom right; }
.aram-sl-pop--above::before {
	top: auto;
	bottom: -6px;
	border-left: none;
	border-top: none;
	border-right: 1px solid var(--acc-line, rgba(0,0,0,.08));
	border-bottom: 1px solid var(--acc-line, rgba(0,0,0,.08));
}
.aram-sl-pop__head { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--acc-muted, #524E46); padding: 6px 10px; }
.aram-sl-pop__list { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow-y: auto; }
.aram-sl-pop__empty { font-size: 13px; color: var(--acc-muted, #524E46); padding: 4px 10px 10px; margin: 0; }
.aram-sl-pop__item,
.aram-sl-pop__new {
	display: block;
	width: 100%;
	text-align: left;
	background: none;
	border: none;
	padding: 10px;
	font-size: 14px;
	font-family: inherit;
	color: var(--acc-ink-text, #4a463f);
	border-radius: 8px;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.aram-sl-pop__item:hover,
.aram-sl-pop__new:hover { background: var(--acc-cream, #F6F2EA); color: var(--acc-accent-ink, #7A3D04); }
/* Fokus klawiaturą: sama zmiana tła/koloru (jak hover) była zbyt subtelna
   jako JEDYNY wskaźnik fokusu (2.4.7) — dokładamy widoczny pierścień
   zamiast czystego outline:none. */
.aram-sl-pop__item:focus-visible,
.aram-sl-pop__new:focus-visible {
	background: var(--acc-cream, #F6F2EA);
	color: var(--acc-accent-ink, #7A3D04);
	outline: 2px solid var(--acc-accent-ink, #7A3D04);
	outline-offset: -2px;
}
.aram-sl-pop__new-row { border-top: 1px solid var(--acc-line, rgba(0,0,0,.08)); margin-top: 4px; padding-top: 8px; }
.aram-sl-pop__new { font-weight: 600; padding: 9px 10px; }
.aram-sl-pop__new-input {
	width: 100%;
	padding: 10px 12px !important;
	border: 1.5px solid var(--acc-line, rgba(0,0,0,.14)) !important;
	border-radius: 10px !important;
	font-size: 13.5px;
	font-family: inherit;
	background: #fff !important;
}
.aram-sl-pop__new-input:focus { outline: none; border-color: var(--acc-accent, #FE840C) !important; box-shadow: 0 0 0 3px rgba(254,132,12,.15); }

@media (max-width: 640px) {
	.aram-sl-pop__overlay.is-open { background: rgba(21,20,15,.4); opacity: 1; visibility: visible; }
	.aram-sl-pop {
		position: fixed !important;
		left: 12px !important;
		right: 12px !important;
		bottom: 12px !important;
		top: auto !important;
		width: auto;
		max-width: none;
		min-width: 0;
		border-radius: 18px;
		padding: 14px;
		transform: translateY(100%);
		transform-origin: center;
	}
	.aram-sl-pop.is-open { transform: translateY(0); }
	.aram-sl-pop::before { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.aram-sl-pop, .aram-sl-pop__overlay { transition: none !important; }
}

/* Toast (confirmation „Dodano do listy…") */
.aram-sl-toast {
	position: fixed;
	left: 50%;
	bottom: 28px;
	transform: translate(-50%, 12px);
	background: var(--acc-ink, #15140F);
	color: #fff;
	padding: 12px 22px;
	border-radius: 999px;
	font-size: 13.5px;
	font-weight: 500;
	opacity: 0;
	transition: opacity .25s ease, transform .25s ease;
	z-index: 9500;
	box-shadow: 0 20px 40px -14px rgba(0,0,0,.4);
}
.aram-sl-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 640px) {
	.aram-acc-sl-grid { grid-template-columns: 1fr; }
	.aram-acc-sl-card__actions { flex-direction: column; align-items: stretch; }
	.aram-acc-sl-card__actions .aram-acc-sl-icon-btn { align-self: flex-end; margin-left: 0; }
}