/* MightyLoc Technical Data Sheet - standalone document, rendered 1-to-1 from the
   source PDF content. Designed for screen AND clean A4 print / Save-as-PDF.
   Self-contained brand values; fonts from fonts.css. */

:root {
	--tds-ink:    #0a0a0a;
	--tds-muted:  #4f4f57;
	--tds-faint:  #6b6b72;
	--tds-red:    #d02629;
	--tds-navy:   #191640;
	--tds-line:   #d9d9e0;
	--tds-line2:  #eeeef2;
	--tds-zebra:  #f7f7f9;
	--tds-bg:     #ececed;
	--tds-paper:  #ffffff;
	--tds-spine:  #191640; /* per-chemistry inline on .tds */
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

body.ml-tds {
	background: var(--tds-bg);
	color: var(--tds-ink);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 14px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	padding: 78px 16px 80px;
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
}

.tds {
	max-width: 860px;
	margin: 0 auto;
	background: var(--tds-paper);
	border: 1px solid var(--tds-line);
	box-shadow: 0 24px 60px -28px rgba(25, 22, 64, 0.30);
}

/* ---- Header ---- */
.tds__head {
	border-top: 4px solid var(--tds-red);
	border-left: 3px solid var(--tds-spine);
	padding: 38px 48px 26px;
}
.tds__brand {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 26px;
}
.tds__logo {
	width: 56px; height: 56px;
	object-fit: contain;
	display: block; flex: 0 0 auto;
	filter: drop-shadow(0 1px 1px rgba(10,10,10,0.14)) drop-shadow(0 6px 14px rgba(25,22,64,0.14));
}
.tds__doc-label {
	font-family: 'JetBrains Mono', monospace;
	font-size: 9.5px; font-weight: 600;
	letter-spacing: 0.24em; text-transform: uppercase;
	color: var(--tds-faint); text-align: right;
}
.tds__eyebrow {
	font-family: 'JetBrains Mono', monospace;
	font-size: 10.5px; font-weight: 600;
	letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--tds-red); margin: 0 0 10px;
}
.tds__title {
	font-family: 'Inter Tight', sans-serif;
	font-weight: 800; font-size: 36px; line-height: 1.04;
	letter-spacing: -0.035em; color: var(--tds-ink);
	margin: 0; overflow-wrap: anywhere;
}
.tds__subtitle {
	font-size: 16px; color: var(--tds-muted);
	margin: 8px 0 0; font-weight: 500; letter-spacing: -0.005em;
}

/* ---- Document-details strip (real ref / date / reviewed only) ---- */
.tds__control {
	display: flex; flex-wrap: wrap; gap: 0;
	margin: 22px 0 0;
	border: 1px solid var(--tds-line);
	border-left: 3px solid var(--tds-spine);
	border-radius: 0 4px 4px 0;
	background: rgba(25, 22, 64, 0.025);
	font-family: 'JetBrains Mono', monospace;
}
.tds__control > div { display: flex; align-items: baseline; gap: 8px; padding: 8px 14px; border-right: 1px solid var(--tds-line2); }
.tds__control-page { margin-left: auto; border-right: 0; }
.tds__control dt { font-size: 8.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--tds-faint); }
.tds__control dd { margin: 0; font-size: 11px; font-weight: 500; color: var(--tds-navy); font-variant-numeric: tabular-nums; }

/* ---- Body ---- */
.tds__body { padding: 30px 48px 12px; }
.tds__section { margin: 0 0 26px; }
.tds__h {
	font-family: 'JetBrains Mono', monospace;
	font-size: 11px; font-weight: 600;
	letter-spacing: 0.13em; text-transform: uppercase;
	color: var(--tds-navy);
	margin: 0 0 14px; padding: 0 0 10px 14px;
	position: relative;
}
.tds__h::before { content: ''; position: absolute; left: 0; top: 1px; width: 6px; height: 12px; background: var(--tds-red); }
.tds__h::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
	background:
		linear-gradient(var(--tds-navy), var(--tds-navy)) left bottom / 100% 1px no-repeat,
		linear-gradient(var(--tds-red), var(--tds-red))   left top    / 30px 1px no-repeat;
}

.tds__prose { font-size: 14px; line-height: 1.62; color: var(--tds-ink); margin: 0; max-width: 76ch; }
.tds__ul { margin: 0; padding-left: 20px; max-width: 76ch; }
.tds__ul li { margin: 0 0 7px; line-height: 1.55; padding-left: 4px; }
.tds__ul li::marker { color: var(--tds-red); }

/* ---- Spec tables (the heart of the datasheet) ---- */
.tds__table {
	width: auto; max-width: 100%;   /* size to content, so borders wrap only real data (no empty balloon cells) */
	border-collapse: collapse; margin: 0;
	font-size: 12.5px;
	border: 1px solid var(--tds-line);
}
/* value cells: snug to content but never absurdly narrow, and wrap long prose values neatly */
.tds__table tbody td { min-width: 4.5em; }
.tds__table thead th {
	background: var(--tds-navy); color: #fff;
	font-family: 'JetBrains Mono', monospace;
	font-size: 9.5px; font-weight: 600;
	letter-spacing: 0.08em; text-transform: uppercase;
	text-align: left; padding: 8px 12px;
	border-right: 1px solid rgba(255,255,255,0.14);
}
.tds__table thead th:last-child { border-right: 0; }
.tds__table tbody th, .tds__table tbody td {
	padding: 7px 12px; border-top: 1px solid var(--tds-line2); vertical-align: top; text-align: left;
}
.tds__table-rowhead {
	font-family: 'Inter', sans-serif;
	font-weight: 600; color: var(--tds-navy);
	background: var(--tds-zebra);
	border-right: 1px solid var(--tds-line);
	white-space: normal;
}
.tds__table thead th.tds__table-rowhead { background: var(--tds-navy); color: #fff; }
.tds__table tbody td {
	font-family: 'JetBrains Mono', monospace;
	font-variant-numeric: tabular-nums;
	color: var(--tds-ink);
	border-right: 1px solid var(--tds-line2);
}
.tds__table tbody td:last-child { border-right: 0; }
/* an empty top-left header cell should not read as a filled navy box */
.tds__table thead th.tds__table-rowhead:empty { background: var(--tds-zebra); border-right: 1px solid var(--tds-line); }
/* a row whose values are all empty (a measurement note / sub-header) spans full width */
.tds__table-sub {
	font-family: 'Inter', sans-serif; font-weight: 600; font-size: 0.92em;
	color: var(--tds-navy); background: var(--tds-zebra);
}

/* ---- Footer ---- */
.tds__foot { padding: 24px 48px 36px; border-top: 2px solid var(--tds-navy); }
.tds__foot p { font-size: 11.5px; color: var(--tds-faint); margin: 0 0 8px; line-height: 1.6; }
.tds__company { color: var(--tds-navy) !important; font-weight: 600; font-size: 12.5px; letter-spacing: 0.01em; }
.tds__foot time { font-weight: 600; color: var(--tds-muted); }
.tds__disclaimer { font-size: 10px; line-height: 1.55; color: var(--tds-faint); margin-top: 12px; }

/* ---- Float actions (screen only) ---- */
.tds__floatbar { position: fixed; top: 20px; right: 24px; display: flex; gap: 10px; z-index: 10; }
.tds__btn {
	font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600;
	padding: 10px 18px; border-radius: 9px;
	border: 1px solid var(--tds-navy); background: var(--tds-navy); color: #fff;
	cursor: pointer; text-decoration: none;
	transition: transform 140ms cubic-bezier(.2,.7,.2,1), box-shadow 140ms ease;
	box-shadow: 0 8px 20px -10px rgba(25,22,64,0.5);
}
.tds__btn:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -10px rgba(25,22,64,0.55); }
.tds__btn:active { transform: translateY(0); box-shadow: 0 4px 12px -8px rgba(25,22,64,0.5); }
.tds__btn:focus-visible { outline: 2px solid var(--tds-red); outline-offset: 2px; box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--tds-red); }
.tds__btn--ghost { background: var(--tds-paper); color: var(--tds-navy); }
@media (prefers-reduced-motion: reduce) { .tds__btn { transition: none; } .tds__btn:hover, .tds__btn:active { transform: none; } }

/* ---- PRINT: clean, robust A4. No fixed/absolute decoration, no clipping. ---- */
@media print {
	@page { size: A4; margin: 15mm; }
	body.ml-tds { background: #fff; padding: 0; font-size: 10pt; }
	.tds { max-width: none; border: 0; box-shadow: none; }
	.no-print, .tds__floatbar { display: none !important; }

	.tds__head { padding: 0 0 12pt; border-top: 3pt solid var(--tds-red); border-left: 3pt solid var(--tds-spine); padding-left: 8pt; padding-top: 8pt; break-inside: avoid; }
	.tds__body { padding: 12pt 0 0; }
	.tds__foot { padding: 10pt 0 0; }
	.tds__logo { width: 14mm; height: 14mm; filter: none; }
	.tds__title { font-size: 22pt; }
	.tds__subtitle { font-size: 11pt; }
	.tds__prose { font-size: 9.5pt; max-width: none; }
	.tds__ul { font-size: 9.5pt; max-width: none; }
	.tds__h { font-size: 8.5pt; }
	.tds__table { font-size: 8.5pt; }
	.tds__table thead th { font-size: 7.5pt; }
	.tds__control { background: #fff; }
	.tds__disclaimer { font-size: 7.5pt; }

	/* break control: a whole TABLE and a whole SECTION stay on one page (a table is the
	   highest priority to keep together). They break onto a second page ONLY when the
	   content is too tall to fit a single page, in which case rows/items still stay whole. */
	.tds__table { break-inside: avoid; }
	.tds__section { break-inside: avoid; }
	.tds__h, .tds__props-h { break-after: avoid; }
	.tds__table tr, .tds__ul li { break-inside: avoid; }
	.tds__prose { orphans: 3; widows: 3; }
	.tds__control, .tds__brand { break-inside: avoid; }
	a { color: inherit; text-decoration: none; }
}

/* ---- Mobile ---- */
@media (max-width: 680px) {
	body.ml-tds { padding: 16px 10px 64px; }
	.tds__head { padding: 28px 20px 22px; }
	.tds__body { padding: 24px 20px 6px; }
	.tds__foot { padding: 22px 20px 30px; }
	.tds__title { font-size: 27px; }
	.tds__control { flex-wrap: wrap; }
	.tds__control-page { margin-left: 0; }
	.tds__floatbar { position: static; justify-content: flex-end; flex-wrap: wrap; padding: 0 10px 12px; }
	.tds__table { font-size: 11.5px; display: block; overflow-x: auto; }
}
