/* ==========================================================================
   Empere — common product description style
   Applies to the Description tab of every product (wrapper .emp-desc, added by
   woocommerce/single-product/tabs/description.php in the child theme).
   Loaded on single product pages only. Every rule is scoped to .emp-desc.

   !important is used on text elements (headings, paragraphs, lists, links,
   tables) so that inconsistent inline styles typed or pasted into individual
   descriptions (font, size, colour, line height, fixed table widths) are
   replaced by this one design. Layout boxes such as spec "cards" or badges
   (divs/spans) keep their own background, border and grid.
   ========================================================================== */

.emp-desc {
	--ed-ink: #0f172a;
	--ed-text: #1e293b;
	--ed-soft: #334155;
	--ed-muted: #64748b;
	--ed-line: #e2e8f0;
	--ed-zebra: #f8fafc;
	--ed-head: #f1f5f9;
	--ed-link: #1B75BC;
	--ed-link-hover: #12558A;

	max-width: 100%;
	font-family: var(--bs-font-sans-serif, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
	font-size: 16px;
	line-height: 1.65;
	color: var(--ed-text);
	overflow-wrap: break-word;
	word-wrap: break-word;
}
.emp-desc,
.emp-desc * { font-family: inherit !important; box-sizing: border-box; }
.emp-desc > :first-child,
.emp-desc > :first-child > :first-child { margin-top: 0 !important; }
.emp-desc > :last-child { margin-bottom: 0 !important; }

/* ---------- Headings ---------- */
.emp-desc h1,
.emp-desc h2,
.emp-desc h3,
.emp-desc h4,
.emp-desc h5,
.emp-desc h6 {
	margin: 28px 0 12px !important;
	padding: 0 !important;
	border: 0 !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	letter-spacing: -0.01em !important;
	text-transform: none !important;
	text-align: left !important;
	color: var(--ed-ink) !important;
}
.emp-desc h1 { font-size: 26px !important; margin-bottom: 8px !important; }
.emp-desc h2 { font-size: 22px !important; }
.emp-desc h3 { font-size: 19px !important; }
.emp-desc h4 { font-size: 17px !important; }
.emp-desc h5,
.emp-desc h6 { font-size: 15px !important; letter-spacing: 0 !important; }

/* ---------- Text ---------- */
.emp-desc p {
	margin: 0 0 14px !important;
	font-size: 16px !important;
	line-height: 1.65 !important;
	font-weight: 400;
	color: var(--ed-text) !important;
	text-align: left !important;
}
.emp-desc strong,
.emp-desc b { font-weight: 700 !important; color: inherit; }
.emp-desc em,
.emp-desc i { font-style: italic; }
.emp-desc small { font-size: 0.875em !important; }
.emp-desc sup,
.emp-desc sub { font-size: 0.75em !important; line-height: 0 !important; }

/* ---------- Lists ---------- */
.emp-desc ul,
.emp-desc ol {
	margin: 0 0 16px !important;
	padding: 0 0 0 22px !important;
	text-align: left !important;
}
.emp-desc ul { list-style: disc outside !important; }
.emp-desc ol { list-style: decimal outside !important; }
.emp-desc ul ul { list-style-type: circle !important; }
.emp-desc li {
	display: list-item !important;
	margin: 0 0 6px !important;
	padding: 0 0 0 2px !important;
	font-size: 16px !important;
	line-height: 1.6 !important;
	color: var(--ed-text) !important;
}
.emp-desc li::marker { color: var(--ed-link); }
.emp-desc li > ul,
.emp-desc li > ol { margin: 6px 0 0 !important; }
.emp-desc li > p { margin: 0 !important; }
/* list items saved without their <ul> (missing tag in the editor) */
.emp-desc > li,
.emp-desc :not(ul):not(ol) > li { margin-left: 22px !important; list-style: disc outside; }
/* editor "indent" wrappers (<li style="list-style-type: none"><ul>…) — no extra stacked indent */
.emp-desc li[style*="list-style-type: none"] > ul,
.emp-desc li[style*="list-style-type: none"] > ol { margin: 0 !important; padding-left: 0 !important; }
.emp-desc li[style*="list-style-type: none"] > ul { list-style-type: disc !important; }
/* sub-points typed with "━" / "▬" (flagged by the template): indented, short grey dash instead of the typed character */
.emp-desc li[data-emp-sub] { list-style: none !important; position: relative; margin-left: 20px !important; }
.emp-desc li[data-emp-sub]::before {
	content: "";
	position: absolute;
	left: -14px;
	top: 0.78em;
	width: 7px;
	height: 2px;
	background: #94a3b8;
}
.emp-desc .emp-mark { display: none !important; }
.emp-desc li[data-emp-parent] { font-weight: 600 !important; color: var(--ed-ink) !important; }

/* ---------- Links ---------- */
.emp-desc a {
	color: var(--ed-link) !important;
	font-weight: 600;
	text-decoration: underline !important;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
	overflow-wrap: anywhere;
}
.emp-desc a:hover,
.emp-desc a:focus { color: var(--ed-link-hover) !important; }

/* ---------- Media ---------- */
.emp-desc img {
	max-width: 100% !important;
	height: auto !important;
	border-radius: 8px;
}
.emp-desc figure { margin: 0 0 16px !important; max-width: 100% !important; }
.emp-desc figcaption { font-size: 13px !important; color: var(--ed-muted) !important; margin-top: 6px; }
.emp-desc iframe,
.emp-desc video { max-width: 100% !important; }
.emp-desc hr { border: 0 !important; border-top: 1px solid var(--ed-line) !important; margin: 24px 0 !important; height: 0 !important; }
.emp-desc blockquote {
	margin: 0 0 16px !important;
	padding: 12px 16px !important;
	border-left: 4px solid var(--ed-link) !important;
	background: var(--ed-zebra) !important;
	border-radius: 0 8px 8px 0;
}
.emp-desc pre,
.emp-desc code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important; font-size: 14px !important; }
.emp-desc pre { white-space: pre-wrap; background: var(--ed-zebra); padding: 12px; border-radius: 8px; overflow-x: auto; }

/* ---------- Spec tables (every table in a description) ---------- */
.emp-desc .emp-desc-table {
	width: 100%;
	margin: 8px 0 22px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--ed-line);
	border-radius: 10px;
	background: #fff;
}
.emp-desc table {
	width: 100% !important;
	max-width: none !important;
	height: auto !important;
	margin: 0 !important;
	border: 0 !important;
	border-collapse: collapse !important;
	border-spacing: 0 !important;
	table-layout: auto !important;
	background: #fff !important;
}
.emp-desc th,
.emp-desc td {
	width: auto !important;
	height: auto !important;
	padding: 9px 14px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ed-line) !important;
	font-size: 14.5px !important;
	line-height: 1.55 !important;
	font-weight: 400 !important;
	color: var(--ed-soft) !important;
	text-align: left !important;
	vertical-align: top !important;
	background: transparent !important;
	overflow-wrap: break-word;
}
.emp-desc tbody tr:nth-child(odd) > td,
.emp-desc tbody tr:nth-child(odd) > th { background: var(--ed-zebra) !important; }
.emp-desc tr:last-child > td,
.emp-desc tr:last-child > th { border-bottom: 0 !important; }
.emp-desc th,
.emp-desc thead td { background: var(--ed-head) !important; font-weight: 700 !important; color: var(--ed-ink) !important; }
/* first column = label */
.emp-desc tbody td:first-child { font-weight: 600 !important; color: var(--ed-text) !important; min-width: 140px; }
.emp-desc td p,
.emp-desc th p { margin: 0 !important; font-size: inherit !important; line-height: inherit !important; color: inherit !important; }
.emp-desc td ul,
.emp-desc td ol { margin: 0 !important; }
.emp-desc td li { font-size: inherit !important; }

/* ==========================================================================
   Short description (key-spec block beside the product image)
   Wrapper .custom-short-description comes from the child content-single-product.php.
   Same size, colour and spacing whether it was typed as lines, bold lines,
   a table or a list. Links (Datasheet button) are not touched.
   ========================================================================== */
.custom-short-description .woocommerce-product-details__short-description {
	font-size: 14.5px;
	line-height: 1.65;
	color: #334155;
}
.custom-short-description .woocommerce-product-details__short-description p,
.custom-short-description .woocommerce-product-details__short-description td,
.custom-short-description .woocommerce-product-details__short-description th,
.custom-short-description .woocommerce-product-details__short-description li,
.custom-short-description .woocommerce-product-details__short-description div {
	font-size: 14.5px !important;
	line-height: 1.65 !important;
	color: #334155 !important;
}
.custom-short-description .woocommerce-product-details__short-description p { margin: 0 0 4px !important; }
.custom-short-description .woocommerce-product-details__short-description table {
	width: auto !important;
	margin: 0 0 6px !important;
	border: 0 !important;
	background: none !important;
}
.custom-short-description .woocommerce-product-details__short-description td,
.custom-short-description .woocommerce-product-details__short-description th {
	width: auto !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	text-align: left !important;
}
.custom-short-description .woocommerce-product-details__short-description ul,
.custom-short-description .woocommerce-product-details__short-description ol { margin: 0 0 6px !important; padding-left: 20px !important; }
.custom-short-description .woocommerce-product-details__short-description li { margin: 0 0 2px !important; }
.custom-short-description .woocommerce-product-details__short-description strong,
.custom-short-description .woocommerce-product-details__short-description b { font-weight: 600 !important; color: #0f172a; }
.custom-short-description .woocommerce-product-details__short-description sup,
.custom-short-description .woocommerce-product-details__short-description sub { font-size: 0.75em !important; }

/* ---------- Responsive ---------- */
@media (max-width: 767px) {
	.emp-desc { font-size: 15px; }
	.emp-desc h1 { font-size: 22px !important; }
	.emp-desc h2 { font-size: 20px !important; }
	.emp-desc h3 { font-size: 18px !important; }
	.emp-desc h4 { font-size: 16px !important; }
	.emp-desc p,
	.emp-desc li { font-size: 15px !important; }
	.emp-desc th,
	.emp-desc td { padding: 8px 10px !important; font-size: 14px !important; }
	.emp-desc tbody td:first-child { min-width: 120px; }
}