/**
 * Article/post content: list spacing + responsive "stacked table" styling.
 * Scoped to .entry-content so it only affects post/page body content.
 * Theme palette used (wp-content/themes/idealauto/style.css):
 *   --main:    #ed1c24 (brand accent)
 *   --heading: #131313 (dark text)
 *   --body:    #6f6f6f (body text)
 *   --custom2: #dfdfdf (border/divider)
 */

/* ---- Remove justified text alignment from article content (overrides the
   align="justify" HTML attribute present in the stored content). ---- */
.entry-content [align="justify"],
.martruck-term-desc-inner [align="justify"] {
	text-align: left !important;
}

/* ---- Main content section: more top space before the article text starts.
   Global: targets the reusable "o-firmie-galeria" section marker (used as
   the article/content wrapper on this template across pages), not just
   this one page's element id, and overrides that section's own per-page
   padding-top:0. ---- */
.o-firmie-galeria {
	padding-top: 60px !important;
}
@media (max-width: 767px) {
	.o-firmie-galeria {
		padding-top: 36px !important;
	}
}

/* ---- Main content container width: same "o-firmie-galeria" article
   section, unified globally instead of per-page (was previously only set
   on one page's own Elementor content_width setting - inconsistent with
   every other page using this same section). ---- */
.o-firmie-galeria > .elementor-container {
	max-width: 980px !important;
}

/* ---- Hero "Skontaktuj się" button: uppercase label ---- */
.elementor-element-13cd1f3 .elementor-button-text {
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* ---- Headings: more breathing room from the text above them ---- */
.entry-content h2,
.entry-content h3,
.martruck-term-desc-inner h2,
.martruck-term-desc-inner h3 {
	margin-top: 2em;
}
.entry-content h2:first-child,
.entry-content h3:first-child,
.martruck-term-desc-inner h2:first-child,
.martruck-term-desc-inner h3:first-child {
	margin-top: 0;
}

/* ---- Lists: restore breathing room the theme's global reset removes ---- */
.entry-content ul,
.entry-content ol,
.martruck-term-desc-inner ul,
.martruck-term-desc-inner ol {
	margin: 1.25em 0;
}
.entry-content li > ul,
.entry-content li > ol,
.martruck-term-desc-inner li > ul,
.martruck-term-desc-inner li > ol {
	margin: 0.5em 0;
}

/* ---- Tables: desktop ----
   Hardcoded hex (not var(--heading) etc.) + !important: this table sits
   inside Elementor-rendered markup where per-widget generated CSS can
   otherwise win the cascade even against class selectors, which is what
   made the header/body render with no visible background before. */
.entry-content table,
.martruck-term-desc-inner table {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 2em 0 !important;
	font-size: 0.95rem !important;
	color: #6f6f6f !important;
	background: #ffffff !important;
}
.entry-content table th,
.entry-content table td,
.martruck-term-desc-inner table th,
.martruck-term-desc-inner table td {
	border: 1px solid #dfdfdf !important;
	padding: 12px 16px !important;
	text-align: left !important;
	vertical-align: top !important;
	word-break: break-word !important;
	background-color: #ffffff !important;
	background: #ffffff !important;
	color: #6f6f6f !important;
}
.entry-content table th *,
.entry-content table td *,
.martruck-term-desc-inner table th *,
.martruck-term-desc-inner table td * {
	color: inherit !important;
}
.entry-content table thead th,
.entry-content table thead td,
.martruck-term-desc-inner table thead th,
.martruck-term-desc-inner table thead td {
	background-color: #131313 !important;
	background: #131313 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	font-size: 0.8rem !important;
	letter-spacing: 0.03em !important;
	border-color: #ffffff !important;
}
.entry-content table tbody tr:nth-child(even) td,
.martruck-term-desc-inner table tbody tr:nth-child(even) td {
	background: #f7f7f7 !important;
}

/* ---- Tables: stacked cards on mobile ---- */
@media (max-width: 767px) {
	.entry-content table,
	.entry-content table thead,
	.entry-content table tbody,
	.entry-content table tr,
	.entry-content table td,
	.martruck-term-desc-inner table,
	.martruck-term-desc-inner table thead,
	.martruck-term-desc-inner table tbody,
	.martruck-term-desc-inner table tr,
	.martruck-term-desc-inner table td {
		display: block;
		width: 100%;
	}
	.entry-content table thead,
	.martruck-term-desc-inner table thead {
		display: none !important;
	}
	.entry-content table,
	.martruck-term-desc-inner table {
		border: none;
		margin: 1.5em 0;
	}
	.entry-content table tr,
	.martruck-term-desc-inner table tr {
		display: block;
		border: 1px solid #dfdfdf;
		border-radius: 10px;
		margin-bottom: 1em;
		overflow: hidden;
		background: #ffffff !important;
	}
	.entry-content table tbody tr:nth-child(even) td,
	.martruck-term-desc-inner table tbody tr:nth-child(even) td {
		background: #ffffff !important;
	}
	.entry-content table td,
	.martruck-term-desc-inner table td {
		display: flex;
		flex-direction: column;
		border: none !important;
		border-bottom: 1px solid #dfdfdf !important;
		padding: 10px 14px !important;
		color: #6f6f6f !important;
	}
	.entry-content table td:last-child,
	.martruck-term-desc-inner table td:last-child {
		border-bottom: none !important;
	}
	.entry-content table td::before,
	.martruck-term-desc-inner table td::before {
		content: attr(data-label);
		display: block;
		background: #ed1c24 !important;
		color: #ffffff !important;
		font-weight: 700;
		text-transform: uppercase;
		font-size: 0.7rem;
		letter-spacing: 0.05em;
		padding: 5px 14px;
		margin: -10px -14px 8px -14px;
		width: calc(100% + 28px);
	}
	.entry-content table tr td:first-child::before,
	.martruck-term-desc-inner table tr td:first-child::before {
		border-top-left-radius: 9px;
		border-top-right-radius: 9px;
	}
}

/* ---- FAQ block: dark navy card, same look everywhere the FAQ appears
   (article pages via .entry-content, car_cat archive description box via
   .martruck-term-desc-inner - the latter already sits on its own dark
   #262626 background, so this renders as a nested card there, same as the
   CTA banner already does in that same box). ---- */
.entry-content .mr-faq,
.martruck-term-desc-inner .mr-faq {
	background: #1a2c4e;
	border-radius: 12px;
	padding: 2rem 2.5rem;
	margin: 0 0 2rem;
}
.entry-content .mr-faq__title,
.martruck-term-desc-inner .mr-faq__title {
	color: #ffffff !important;
}
.entry-content .mr-faq__item,
.martruck-term-desc-inner .mr-faq__item {
	border-bottom-color: rgba(255, 255, 255, 0.15) !important;
}
.entry-content .mr-faq__item:first-of-type,
.martruck-term-desc-inner .mr-faq__item:first-of-type {
	border-top-color: rgba(255, 255, 255, 0.15) !important;
}
.entry-content .mr-faq__trigger h3,
.martruck-term-desc-inner .mr-faq__trigger h3 {
	color: #ffffff !important;
}
.entry-content .mr-faq__trigger svg,
.martruck-term-desc-inner .mr-faq__trigger svg {
	fill: #ffffff !important;
}
.entry-content .mr-faq__body p,
.martruck-term-desc-inner .mr-faq__body p {
	color: rgba(255, 255, 255, 0.85) !important;
}
@media (max-width: 767px) {
	.entry-content .mr-faq,
	.martruck-term-desc-inner .mr-faq {
		padding: 1.5rem;
	}
}