/**
 * Template skins for the front-end editor preview.
 * Each of the 5 templates gets a genuinely distinct identity, not just a
 * recolor: typography, header treatment, rule weight and table styling
 * all change. The final PDF/print render for each template lives in
 * /templates/invoice-{key}.php and mirrors these same decisions.
 */

/* =========================================================
   1. CORPORATE — classic letterhead, serif display, navy/gold
   ========================================================= */

.sigp-template-corporate .sigp-doc-heading {
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 700;
	letter-spacing: 0.02em;
}
.sigp-template-corporate .sigp-company-name { font-family: Georgia, "Times New Roman", serif; }
.sigp-template-corporate .sigp-company-header {
	border-bottom: 3px double var(--sigp-primary, #1f3a5f);
}
.sigp-template-corporate .sigp-section h3 {
	font-family: Georgia, "Times New Roman", serif;
	text-transform: none;
	font-size: 14px;
	letter-spacing: 0;
	border-bottom: 1px solid var(--sigp-secondary, #c9a35c);
}
.sigp-template-corporate .sigp-items-table thead th { background: var(--sigp-primary, #1f3a5f); }
.sigp-template-corporate .sigp-total-grand {
	border-top: 1px solid var(--sigp-secondary, #c9a35c);
	border-bottom: 3px double var(--sigp-primary, #1f3a5f);
}

/* =========================================================
   2. MODERN — bold geometric, colored block heading, rounded
   ========================================================= */

.sigp-template-modern .sigp-paper { border-radius: 0; }
.sigp-template-modern .sigp-company-header {
	border-bottom: none;
	background: linear-gradient(135deg, var(--sigp-primary, #1f3a5f) 0%, var(--sigp-primary, #1f3a5f) 60%, var(--sigp-secondary, #c9a35c) 60%, var(--sigp-secondary, #c9a35c) 100%);
	border-radius: 12px;
	padding: 18px 22px;
	margin-bottom: 26px;
}
.sigp-template-modern .sigp-company-name,
.sigp-template-modern .sigp-company-line { color: #fff; }
.sigp-template-modern .sigp-doc-heading {
	color: #fff;
	font-weight: 900;
	letter-spacing: -0.01em;
	font-size: 28px;
}
.sigp-template-modern .sigp-section h3 {
	border-bottom: none;
	background: var(--sigp-bg, #f3f5f8);
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	color: var(--sigp-primary, #1f3a5f);
}
.sigp-template-modern .sigp-items-table thead th { border-radius: 0; }
.sigp-template-modern .sigp-items-table { border-radius: 8px; overflow: hidden; }
.sigp-template-modern .sigp-total-grand {
	background: var(--sigp-bg, #f3f5f8);
	border-radius: 8px;
	padding: 10px 12px;
	border-bottom: none;
}

/* =========================================================
   3. MINIMAL — hairlines only, thin weight, wide small caps
   ========================================================= */

.sigp-template-minimal .sigp-app,
.sigp-template-minimal { font-weight: 300; }
.sigp-template-minimal .sigp-company-header { border-bottom: 1px solid var(--sigp-border, #e1e5eb); }
.sigp-template-minimal .sigp-company-name { font-weight: 500; }
.sigp-template-minimal .sigp-doc-heading {
	font-weight: 400;
	font-size: 18px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--sigp-ink, #1b2330);
}
.sigp-template-minimal .sigp-section h3 {
	font-weight: 500;
	letter-spacing: 0.12em;
	color: var(--sigp-muted, #6b7280);
	border-bottom: 1px solid var(--sigp-border, #e1e5eb);
}
.sigp-template-minimal .sigp-items-table thead th {
	background: transparent;
	color: var(--sigp-muted, #6b7280);
	border-bottom: 1px solid var(--sigp-ink, #1b2330);
	font-weight: 500;
}
.sigp-template-minimal .sigp-tablestyle-striped .sigp-items-table tbody tr:nth-child(even) { background: transparent; }
.sigp-template-minimal .sigp-items-table tbody td { border-bottom: 1px solid var(--sigp-border, #e1e5eb); }
.sigp-template-minimal .sigp-total-grand {
	font-weight: 500;
	color: var(--sigp-ink, #1b2330);
	border-top: 1px solid var(--sigp-ink, #1b2330);
	border-bottom: 1px solid var(--sigp-ink, #1b2330);
}
.sigp-template-minimal .sigp-amount-words { background: transparent; border: none; padding-left: 0; }

/* =========================================================
   4. PROFESSIONAL — structured consultancy grid, top accent bar
   ========================================================= */

.sigp-template-professional .sigp-paper { border-top: 5px solid var(--sigp-primary, #1f3a5f); }
.sigp-template-professional .sigp-company-header { align-items: center; }
.sigp-template-professional .sigp-doc-heading {
	font-size: 22px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	border-left: 4px solid var(--sigp-secondary, #c9a35c);
	padding-left: 10px;
}
.sigp-template-professional .sigp-section h3 {
	display: flex;
	align-items: center;
	gap: 8px;
}
.sigp-template-professional .sigp-section h3::before {
	content: "";
	width: 8px;
	height: 8px;
	background: var(--sigp-secondary, #c9a35c);
	border-radius: 1px;
	display: inline-block;
}
.sigp-template-professional .sigp-items-table thead th {
	background: var(--sigp-ink, #1b2330);
	color: #fff;
}
.sigp-template-professional .sigp-tablestyle-striped .sigp-items-table tbody tr:nth-child(even) { background: #f4f6f8; }
.sigp-template-professional .sigp-total-grand { background: #f4f6f8; padding: 10px 12px; border-bottom: none; border-radius: 4px; }

/* =========================================================
   5. CONSTRUCTION STYLE — industrial, hazard-stripe accent
   ========================================================= */

.sigp-template-construction {
	--sigp-construction-accent: #e8590c;
	--sigp-construction-ink: #1c1c1c;
}
.sigp-template-construction .sigp-paper { border: 2px solid var(--sigp-construction-ink); }
.sigp-template-construction .sigp-company-header {
	border-bottom: none;
	padding-bottom: 0;
}
.sigp-template-construction .sigp-company-name {
	text-transform: uppercase;
	font-weight: 900;
	letter-spacing: 0.01em;
	color: var(--sigp-construction-ink);
}
.sigp-template-construction .sigp-doc-heading {
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: 24px;
	color: var(--sigp-construction-ink);
	background: repeating-linear-gradient(
		45deg,
		var(--sigp-construction-accent),
		var(--sigp-construction-accent) 10px,
		var(--sigp-construction-ink) 10px,
		var(--sigp-construction-ink) 20px
	);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.sigp-template-construction .sigp-company-header::after {
	content: "";
	display: block;
	grid-column: 1 / -1;
	height: 8px;
	margin-top: 14px;
	background: repeating-linear-gradient(
		45deg,
		var(--sigp-construction-accent),
		var(--sigp-construction-accent) 14px,
		var(--sigp-construction-ink) 14px,
		var(--sigp-construction-ink) 28px
	);
}
.sigp-template-construction .sigp-section h3 {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border-bottom: 2px solid var(--sigp-construction-ink);
	color: var(--sigp-construction-ink);
}
.sigp-template-construction .sigp-items-table thead th {
	background: var(--sigp-construction-ink);
	color: #fff;
	font-weight: 800;
}
.sigp-template-construction .sigp-items-table tbody td { border-bottom: 1px solid var(--sigp-construction-ink); }
.sigp-template-construction .sigp-total-grand {
	color: var(--sigp-construction-ink);
	border-top: 3px solid var(--sigp-construction-accent);
	border-bottom: 3px solid var(--sigp-construction-ink);
}
.sigp-template-construction .sigp-btn-primary { background: var(--sigp-construction-accent); color: #fff; }
