/* ==========================================================================
   Architect Area Calculator - Print stylesheet
   Applies only to @media print (A4 plain paper vs Letterhead layouts).
   ========================================================================== */

@page {
	size: A4;
	margin: 15mm 14mm;
}

@media print {
	html, body {
		background: #fff !important;
		margin: 0;
		padding: 0;
	}

	/* Isolate the sheet from the surrounding theme (site header, nav,
	   sidebar, footer, etc.) - printing a shortcode embedded on a normal
	   page must never print the whole webpage around it. This hides
	   everything, then re-reveals only our own shell and repositions it
	   to the top of the page, regardless of the theme's markup. */
	body * {
		visibility: hidden !important;
	}

	.aac-shell,
	.aac-shell * {
		visibility: visible !important;
	}

	.aac-shell {
		position: absolute !important;
		left: 0 !important;
		top: 0 !important;
		width: 100% !important;
		margin: 0 !important;
	}

	.aac-no-print,
	.aac-no-print * {
		display: none !important;
	}

	.aac-card {
		box-shadow: none !important;
		border: none !important;
		background: #fff !important;
		backdrop-filter: none !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		transform: none !important;
	}

	.aac-card,
	.aac-card * {
		color: #000 !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	/* Restore a few deliberate accent backgrounds for readability. */
	.aac-net-total-row td {
		background: #eee !important;
		border: 1px solid #000 !important;
		font-weight: 600 !important;
	}

	.aac-net-total-label {
		font-weight: 600 !important;
	}

	/* Area/Less VALUES are sized and weighted for the larger on-screen
	   editing grid (15px/700) - only a shade above the printed table's own
	   11.5px body text, and normal weight, reads as part of the same table
	   instead of visually shouting over every other column. Scoped to "td"
	   only - the header cells share this same class for column alignment,
	   and must stay bold like every other column heading (AREA/LESS were
	   printing visibly lighter than # / DESCRIPTION / NOS / LENGTH / WIDTH
	   before this was scoped). */
	.aac-rows-table td.aac-col-figure {
		font-size: 12.5px !important;
		font-weight: 400 !important;
	}

	/* Professional, dense table style: thin rules, a crisper header, and a
	   tighter line height than the on-screen card (which is spaced for
	   touch/mouse editing, not for a printed page). */
	/* The on-screen wrapper allows horizontal scrolling for a table too wide
	   for a phone; at print width, if the table's own column math (several
	   "width: 1%" shrink-to-fit columns alongside the fluid Description
	   column) ever rounds a hair wider than 100%, "auto" would silently
	   clip that sliver off the right edge instead of letting it print -
	   taking a column's border with it. Print always has the full page
	   width available, so there's never a reason to clip here. */
	.aac-table-scroll {
		overflow-x: visible !important;
	}

	.aac-rows-table,
	.aac-summary-table {
		width: 100%;
		table-layout: auto;
		border-collapse: collapse;
		font-size: 11.5px;
		line-height: 1.3;
		page-break-inside: auto;
	}

	.aac-rows-table th,
	.aac-rows-table td,
	.aac-summary-table th,
	.aac-summary-table td {
		border: 1px solid #333 !important;
		padding: 5px 8px !important;
	}

	.aac-rows-table thead th,
	.aac-summary-table thead th {
		background: #eceff1 !important;
		border-bottom: 1.5px solid #000 !important;
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: 0.02em;
	}

	/* Numeric columns right-align their values (so digits line up), but a
	   short header word right-shoved against the edge of a wide column
	   (Area, Less) reads as off-center compared to a narrow column (Nos,
	   Length, Width) where there's barely any room for it to look
	   shifted either way. Centering every numeric column's heading -
	   independently of how its values are aligned - makes all of them
	   consistent regardless of column width. */
	.aac-rows-table thead th.aac-col-num,
	.aac-summary-table thead th.aac-col-num {
		text-align: center !important;
	}

	/* Every numeric/fixed-format column (Nos, Length, Width, Area, Less,
	   Rate, Amount) shrinks to fit its own content - "width: 1%" is a
	   standard table trick that, combined with nowrap, makes the column no
	   wider than its longest value plus this padding, instead of the fixed
	   pixel widths used for on-screen editing (which leave a lot of blank
	   space once borders shrink and inputs lose their padding on print).
	   The Description column carries no such rule, so it freely absorbs
	   whatever width is left over. */
	.aac-rows-table td.aac-col-num,
	.aac-rows-table th.aac-col-num,
	.aac-summary-table td.aac-col-num,
	.aac-summary-table th.aac-col-num {
		width: 1% !important;
		white-space: nowrap !important;
		padding-left: 2ch !important;
		padding-right: 2ch !important;
	}

	.aac-rows-table .aac-desc-cell,
	.aac-rows-table th:not(.aac-col-sn):not(.aac-col-num):not(.aac-col-category) {
		width: auto !important;
	}

	.aac-rows-table tr,
	.aac-summary-table tr {
		page-break-inside: avoid;
	}

	/* Client Name / Site-Location / Prepared By / Footer Notes: a simple,
	   plain rectangle - not the rounded, shadowed input box every theme
	   draws on screen (box-shadow and border-radius survive the on-screen
	   styling otherwise, which is what still looked "graphical" here). */
	.aac-field input:not([type="date"]),
	.aac-footer-notes textarea {
		border: 1px solid #000 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		background: transparent !important;
		padding: 4px 6px !important;
		outline: none !important;
		-webkit-appearance: none;
		appearance: none;
	}

	/* Inside the rows/summary tables, inputs should instead blend into the
	   cell they already sit in (which has its own border) rather than draw
	   a second box around themselves. */
	.aac-rows-table input,
	.aac-rows-table select,
	.aac-summary-table input {
		border: none !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		outline: none !important;
		background: transparent !important;
		padding: 0 !important;
		line-height: inherit !important;
		-webkit-appearance: none;
		appearance: none;
	}

	/* Number inputs (Nos, Less, and the Rate Summary's Rate) keep their
	   up/down spin buttons even with appearance:none on the input itself in
	   some browsers - these are an editing affordance, not something that
	   belongs on a printed page. */
	.aac-rows-table input[type="number"]::-webkit-inner-spin-button,
	.aac-rows-table input[type="number"]::-webkit-outer-spin-button,
	.aac-summary-table input[type="number"]::-webkit-inner-spin-button,
	.aac-summary-table input[type="number"]::-webkit-outer-spin-button {
		-webkit-appearance: none !important;
		margin: 0 !important;
	}

	.aac-rows-table input[type="number"],
	.aac-summary-table input[type="number"] {
		-moz-appearance: textfield;
	}

	/* Chrome/Edge still draw a boxed calendar-icon control on a native
	   date input even with the reset above - hide that control outright so
	   the Date field prints as plain text like every other field. */
	.aac-field input[type="date"]::-webkit-calendar-picker-indicator {
		display: none !important;
	}

	/* A native date input keeps its own browser-drawn control chrome
	   (rounded box, internal padding) no matter what is reset above - that
	   is what was still printing like a webpage form field instead of
	   plain text. frontend.js swaps it for a plain-text span
	   (.aac-print-date-text) just before printing; this hides the input
	   itself so only that text shows. If JS didn't run for any reason, the
	   reset above is still the fallback. */
	.aac-field input.aac-print-date-hidden {
		display: none !important;
	}

	.aac-print-date-text {
		display: inline-block;
	}

	/* .aac-rate-cell is a flex row on screen (icon + input, right-aligned) -
	   flexed content doesn't report its true size to the table's auto
	   column-width algorithm correctly, so a "shrink to fit" column can end
	   up narrower than the flex box actually needs; the overflow then
	   renders past the column's left edge (since content is right-anchored)
	   instead of simply widening the column. Switching back to normal
	   inline flow for print sidesteps that entirely. */
	.aac-summary-table .aac-rate-cell {
		display: table-cell !important;
		text-align: right !important;
	}

	/* A number input has no natural width of its own, so left unconstrained
	   it renders at the browser's default (~150px+) even for a one-digit
	   rate - same fix as the Description/numeric column split above:
	   shrink it to its value instead of leaving a wide, boxy control. */
	.aac-summary-table input[type="number"] {
		width: 3.5em !important;
		text-align: right;
	}

	/* Hide entry helpers that only make sense while editing on screen. */
	.aac-desc-picker,
	.aac-mode-hint,
	.aac-help,
	.aac-live-preview,
	.aac-options-modal-backdrop,
	.aac-sheets-modal-backdrop {
		display: none !important;
	}

	/* The Category column exists to feed the Rate Summary below the table -
	   repeating it as its own printed column is redundant and, at the
	   table's fixed layout, left too little room for the Description
	   column next to it. Collapse it to nothing rather than removing the
	   cell outright, so the column count (and every colspan built on it)
	   stays correct. Selector must be at least as specific as the generic
	   ".aac-rows-table th/td { border: 1px solid #333 !important }" rule
	   above, or that rule wins and leaves a thin bordered sliver behind -
	   which is exactly the "blank column" that was still showing. */
	.aac-rows-table th.aac-col-category,
	.aac-rows-table td.aac-col-category {
		width: 0 !important;
		min-width: 0 !important;
		max-width: 0 !important;
		padding: 0 !important;
		border: none !important;
		overflow: hidden !important;
	}

	.aac-col-category * {
		display: none !important;
	}

	.aac-signature-row {
		page-break-inside: avoid;
	}

	/* --- Company header/footer block: only prints when explicitly turned
	       on (Settings, or per-sheet) - off by default, even on A4. --- */
	.aac-print-header-off .aac-letterhead {
		display: none !important;
	}

	.aac-print-header-on .aac-letterhead {
		display: flex !important;
	}

	/* --- Letterhead paper: reserve top space, hide our own branding
	       since it is already printed on the physical letterhead. --- */
	.aac-print-letterhead {
		margin-top: 42mm !important;
	}

	.aac-print-letterhead .aac-letterhead {
		display: none !important;
	}
}