/* Wygląd na stronach satelitarnych (np. macierze-netapp.pl): korzysta ze zmiennych CSS motywu, więc działa w trybie jasnym i ciemnym.
   Zmienne motywu: --secondary-color (tło), --decoration-color (tekst), --kolor-4 (linie), --kolor-6/--kolor-7 (powierzchnie). */
.sz {
	--sz-accent: #0067c5;
	--sz-accent-text: #0067c5;
	--sz-text: var(--decoration-color, #1c1c1e);
	--sz-page: var(--secondary-color, #fff);
	--sz-surface: var(--kolor-7, #fff);
	--sz-bg: var(--kolor-6, #f4f7fb);
	--sz-line: var(--kolor-4, #dee2e6);
	--sz-muted: #8b8fa3;
	--sz-tint: var(--kolor-6, #eef5ff);
	--sz-tint-line: var(--kolor-4, #cfe2fd);
	font-family: var(--main-font, 'Inter', sans-serif);
}
@supports (color: color-mix(in srgb, red 50%, blue)) {
	.sz {
		--sz-muted: color-mix(in srgb, var(--decoration-color, #000) 62%, transparent);
		--sz-tint: color-mix(in srgb, var(--sz-accent) 14%, var(--kolor-7, #fff));
		--sz-tint-line: color-mix(in srgb, var(--sz-accent) 35%, var(--kolor-7, #fff));
	}
}
/* Tryb ciemny: jaśniejszy akcent dla tekstu i odnośników (kontrast) */
body.dark-mode .sz { --sz-accent-text: #5aaeff; }

/* Układ w motywie */
.sz-container { padding-top: 8px; }
.sz-breadcrumbs { display: none; } /* dopisujemy je do ścieżki motywu skryptem (front.js); bez JS pokazuje je <noscript> */
.sz h1 { font-weight: 700; }
.sz h2 { font-weight: 600; }
.sz-btn { border-radius: 8px; }
.sz-btn--ghost { border-color: var(--sz-line); }
.sz-btn:hover { filter: brightness(1.1); }
.sz-card, .sz-panel, .sz-alt, .sz-filters, .sz-modal { border-radius: 14px; }
.sz-card { border-color: transparent; background: var(--sz-surface); }
.sz-panel { position: static; box-shadow: none; }
@media (min-width: 901px) { .sz-layout__side { top: calc(var(--header-height, 59px) + 24px); } }
.sz-filters { background: var(--sz-bg); }
.sz-filter select { border-color: var(--sz-line); }
.sz-toast { background: #0067c5; }
.sz-reg, .sz-note { background: var(--sz-bg); }
.sz-cover img { border-radius: 14px; }
.sz-content, .sz-content p, .sz-content li, .sz-faq p { color: var(--sz-text); }
.sz-content a { color: var(--sz-accent-text); }
.sz-alert--ok { background: rgba(25, 135, 84, .15); border-color: rgba(25, 135, 84, .4); color: #57d19a; }
.sz-alert--err { background: rgba(220, 53, 69, .15); border-color: rgba(220, 53, 69, .4); color: #ff8b97; }
body:not(.dark-mode) .sz-alert--ok { color: #146c43; }
body:not(.dark-mode) .sz-alert--err { color: #a02334; }
.sz-alert--past { background: rgba(255, 193, 7, .14); border-color: rgba(255, 193, 7, .45); color: inherit; }

/* Cena: informacja o VAT w nowej linii */
.sz .sz-price { display: block; }
.sz .sz-price .sz-vat { display: block; margin: 2px 0 0; }
.sz-card__foot { align-items: flex-end; }

/* Etykiety (tagi): bez wypełnienia, obwódka i tekst w kolorze tekstu motywu (czarny w trybie jasnym), zaokrąglenie jak przy przyciskach */
.sz-badge, .sz-badge--type, .sz-badge--level, .sz-badge--past {
	background: transparent;
	border: 1px solid var(--decoration-color, #000);
	color: var(--decoration-color, #000);
	border-radius: 8px;
	padding: 3px 12px;
	font-weight: 500;
}
/* Etykiety będące odnośnikami (np. tematyka) – też w kolorze tekstu, nie w kolorze odnośników */
.sz a.sz-badge, .sz a.sz-badge:visited { color: var(--decoration-color, #000); text-decoration: none; }
.sz a.sz-badge:hover { background: var(--decoration-color, #000); color: var(--secondary-color, #fff); }

/* Przyciski dodatkowe (Pobierz PDF, Dodaj do kalendarza, Szczegóły, Pokaż więcej/mniej): czarny tekst i obwódka */
.sz-btn--ghost, .sz-collapsible__btn, .sz-cal summary {
	background: transparent;
	color: var(--decoration-color, #000) !important;
	border: 1px solid var(--decoration-color, #000);
	border-radius: 8px;
}
.sz-btn--ghost:hover, .sz-collapsible__btn:hover, .sz-cal[open] summary {
	background: var(--decoration-color, #000);
	color: var(--secondary-color, #fff) !important;
	filter: none;
}
.sz-collapsible__btn { padding: 9px 20px; font-weight: 600; }

/* Główny przycisk „Zapisz się” – zielony */
[data-sz-cta], .sz-form button[type="submit"], .sz-success .sz-btn {
	background: #169f43;
	border-color: #169f43;
	color: #fff !important;
}
[data-sz-cta]:hover, .sz-form button[type="submit"]:hover, .sz-success .sz-btn:hover { background: #12833a; border-color: #12833a; filter: none; }
[data-sz-cta][disabled] { background: #169f43; opacity: .5; }

/* Ścieżka nawigacji dopisana do motywu */
.breadcrumbs-left .breadcrumb-item.sz-crumb a { text-decoration: none; }
