/* Treść stron i wpisów, opis produktu oraz domyślne widoki WooCommerce
 * (konto klienta, strona podziękowania). */

/* :where() zeruje specyficzność tych domyślnych reguł, więc dowolna
   klasa komponentu (np. .desc-tile__title) nadpisze je bez potrzeby
   dorzucania .entry-content z przodu, żeby "wygrać" specyficznością. */

:where(.entry-content h2) {
	margin-top: 48px;
	font-size: 28px;
}

@media (max-width: 1023px) {
	:where(.entry-content h2) {
		margin-top: 36px;
		font-size: 22px;
	}
}

:where(.entry-content h3) {
	margin-top: 32px;
	font-size: 20px;
}

:where(.entry-content h4) {
	margin-top: 24px;
	font-size: 17px;
}

:where(.entry-content > :first-child) {
	margin-top: 0;
}

.entry-content a {
	font-weight: 500;
	text-underline-offset: 3px;
}

.entry-content img {
	border-radius: var(--radius-large);
}

.entry-content .toc {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.entry-content .definitions {
	display: grid;
	gap: 12px;
}

.entry-content p + p,
.entry-content p + ul,
.entry-content p + ol,
.entry-content p + div,
.entry-content p + figure,
.entry-content ul + p,
.entry-content ul + div,
.entry-content ol + p,
.entry-content ol + div {
	margin-top: 16px;
}

.entry-content li + li {
	margin-top: 8px;
}

.entry-content li > ul,
.entry-content li > ol {
	margin-top: 8px;
}

.entry-content blockquote {
	padding: 20px 24px;
	border-radius: var(--radius-large);
	background: var(--color-surface);
}

.entry-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.entry-content th,
.entry-content td {
	padding: 12px 10px;
	border-bottom: 1px solid var(--color-border);
	text-align: left;
	line-height: 1.4;
	vertical-align: top;
}

.entry-content th {
	font-weight: 700;
}

.entry-content details {
	border-bottom: 1px solid var(--color-border);
	background-color: #FFF;
}

.entry-content details:first-of-type {
	border-top: 1px solid var(--color-border);
}

.entry-content summary {
	font-weight: 700;
	cursor: pointer;
}

.entry-content details > :not(summary) {
	color: var(--color-muted);
}

.entry-image {
	margin-bottom: 32px;
	overflow: hidden;
	border-radius: var(--radius-large);
}

/* Lista wpisów */

.post-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px 24px;
}

@media (max-width: 1023px) {
	.post-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}
}

.post-card__link {
	display: grid;
	gap: 14px;
	text-decoration: none;
}

.post-card__image {
	width: 100%;
	border-radius: var(--radius-large);
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.post-card__title {
	font-size: 19px;
}

.post-card__link:hover .post-card__title {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* WooCommerce: tabele */

.woocommerce table.shop_table {
	width: 100%;
	margin-bottom: 32px;
	border-collapse: collapse;
	font-size: 15px;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	padding: 12px 0;
	border-bottom: 1px solid var(--color-border);
	text-align: left;
	vertical-align: top;
}

.woocommerce table.shop_table td:last-child,
.woocommerce table.shop_table th:last-child {
	text-align: right;
}

.woocommerce table.shop_table tfoot th {
	font-weight: 500;
}

h2,
h3 {
	margin: 28px 0 16px;
	font-size: 22px;
}

/* WooCommerce: strona podziękowania — minimalistycznie, bez ramek;
   tłem wyróżnione są tylko dwa najważniejsze elementy: potwierdzenie
   i podsumowanie zamówienia (numer, razem, płatność). Reszta (szczegóły
   zamówienia, adresy) to czysty tekst z odstępami, bez boksów. */

.woocommerce-thankyou-order-received {
	margin: 0 0 28px;
	padding: 18px 20px;
	border-radius: var(--radius);
	background: var(--color-success-soft);
	color: var(--color-success);
	font-weight: 700;
}

.woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 40px;
	padding: 20px 22px;
	border-radius: var(--radius);
	background: var(--color-surface);
	list-style: none;
}

@media (max-width: 1023px) {
	.woocommerce-order-overview {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.woocommerce-order-overview li {
	display: grid;
	gap: 4px;
	color: var(--color-muted);
	font-size: 13px;
}

.woocommerce-order-overview strong {
	color: var(--color-text);
	font-size: 15px;
}

.woocommerce-order-overview__total strong {
	color: var(--color-primary);
	font-size: 17px;
}

.woocommerce-order-details__title,
.woocommerce-column__title {
	margin: 0 0 16px;
	font-size: 18px;
}

.woocommerce-order-details table.shop_table {
	margin-bottom: 0;
}

.woocommerce-customer-details {
	margin-top: 40px;
}

.woocommerce-columns {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 1023px) {
	.woocommerce-columns {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}
}

.woocommerce-customer-details address {
	color: var(--color-muted);
	font-style: normal;
	line-height: 1.6;
}

/* WooCommerce: konto klienta */

.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 56px;
}

@media (max-width: 1023px) {
	.woocommerce-account .woocommerce {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}
}

.woocommerce-account:not(.logged-in) .woocommerce {
	grid-template-columns: minmax(0, 440px);
	justify-content: center;
}

.woocommerce-MyAccount-navigation ul {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 10px 14px;
	border-radius: var(--radius);
	text-decoration: none;
}

.woocommerce-MyAccount-navigation .is-active a,
.woocommerce-MyAccount-navigation a:hover {
	background: var(--color-surface);
}

.woocommerce form .form-row {
	display: grid;
	gap: 6px;
	margin: 0 0 16px;
}

.woocommerce form .form-row label {
	font-size: 14px;
	font-weight: 700;
}

.woocommerce form .required {
	color: var(--color-error);
	text-decoration: none;
}