/*
 * Q Vision Frontend Portal
 * نفس نظام الألوان والخطوط المستخدم في لوحة التحكم، لكن مستقل تماماً
 * وبأولوية عالية (!important) عشان يكسب قدام تنسيقات قالب الموقع (Theme).
 */

.qv-portal {
	--qv-navy: #0F2A43;
	--qv-navy-light: #16344F;
	--qv-teal: #0FBFAF;
	--qv-amber: #F2A93B;
	--qv-red: #E8604C;
	--qv-bg: #F5F7FA;
	--qv-card: #FFFFFF;
	--qv-text: #1B2B3A;
	--qv-muted: #64748B;
	--qv-border: #E4E9EF;

	font-family: 'Cairo', -apple-system, sans-serif !important;
	color: var(--qv-text);
	background: var(--qv-bg);
	padding: 24px;
	border-radius: 16px;
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}

.qv-portal * { box-sizing: border-box; }

.qv-portal-header { margin-bottom: 24px; }

.qv-portal-title {
	font-family: 'Cairo', sans-serif !important;
	font-weight: 800 !important;
	font-size: 26px !important;
	color: var(--qv-navy) !important;
	margin: 0 0 4px !important;
	white-space: nowrap;
	overflow: visible;
}

.qv-portal-subtitle {
	color: var(--qv-muted) !important;
	font-size: 14px !important;
	margin: 0 !important;
}

.qv-portal-notice {
	background: rgba(242,169,59,0.12) !important;
	color: #9A6A1A !important;
	border-radius: 8px !important;
	padding: 8px 12px !important;
	font-size: 13px !important;
	margin-top: 8px !important;
	display: inline-block !important;
}

.qv-portal-empty {
	text-align: center;
	color: var(--qv-muted);
	padding: 60px 20px;
}

/* ---------------- Product grid ---------------- */

.qv-portal-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 18px;
}

.qv-p-card {
	background: var(--qv-card) !important;
	border: 1px solid var(--qv-border) !important;
	border-radius: 14px !important;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.qv-p-card:hover { box-shadow: 0 8px 24px rgba(15,42,67,0.08); transform: translateY(-2px); }

.qv-p-image {
	width: 100%;
	aspect-ratio: 4 / 3;
	background: var(--qv-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.qv-p-image img { width: 100%; height: 100%; object-fit: cover; }
.qv-p-noimg {
	font-family: 'Cairo', sans-serif;
	font-weight: 800;
	font-size: 32px;
	color: var(--qv-border);
}
.qv-p-icon { font-size: 40px !important; }

.qv-p-image { position: relative; }
.qv-p-new-tag {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 2;
	background: var(--qv-teal) !important;
	color: #fff !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	padding: 3px 10px !important;
	border-radius: 20px !important;
}

.qv-p-discount-badge {
	background: rgba(232,96,76,0.12) !important;
	color: var(--qv-red) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	padding: 2px 8px !important;
	border-radius: 20px !important;
}

.qv-p-body { padding: 16px; display: flex; flex-direction: column; gap: 10px; flex: 1; }

.qv-p-chip {
	align-self: flex-start;
	background: rgba(15,42,67,0.06) !important;
	color: var(--qv-navy) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	padding: 3px 10px !important;
	border-radius: 20px !important;
}

.qv-p-name {
	font-family: 'Cairo', sans-serif !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	color: var(--qv-navy) !important;
	margin: 0 !important;
	line-height: 1.35 !important;
}

.qv-p-desc {
	font-size: 13px !important;
	color: var(--qv-muted) !important;
	margin: 0 !important;
	line-height: 1.5 !important;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.qv-p-qty-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 6px;
	border-top: 1px solid var(--qv-border);
}
.qv-p-qty-row label { font-size: 12px !important; color: var(--qv-muted) !important; font-weight: 600 !important; white-space: nowrap; }
.qv-p-qty-input {
	width: 100px !important;
	border: 1px solid var(--qv-border) !important;
	border-radius: 8px !important;
	padding: 8px 10px !important;
	font-family: 'Cairo', sans-serif !important;
	font-size: 15px !important;
	text-align: center !important;
	background: #fff !important;
	color: var(--qv-text) !important;
}
.qv-p-qty-input:focus { outline: none !important; border-color: var(--qv-teal) !important; }

.qv-p-price-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
	min-height: 22px;
	flex-wrap: wrap;
}
.qv-p-price-unit { font-size: 11px !important; color: var(--qv-muted) !important; white-space: nowrap; }
.qv-p-price-total { font-size: 18px !important; font-weight: 800 !important; color: #0A9E90 !important; white-space: nowrap; }

.qv-p-add-btn { width: 100% !important; padding: 8px 14px !important; font-size: 13px !important; }

@media (max-width: 640px) {
	.qv-portal-grid { grid-template-columns: 1fr; gap: 14px; }
	.qv-p-name { font-size: 16px !important; }
	.qv-p-price-total { font-size: 18px !important; }
}

/* ---------------- عناصر عامة (أزرار / حقول) ---------------- */

.qv-btn {
	font-family: 'Cairo', sans-serif !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	border-radius: 10px !important;
	padding: 10px 18px !important;
	border: 1px solid transparent !important;
	cursor: pointer !important;
	box-shadow: none !important;
	text-shadow: none !important;
}
.qv-btn--primary { background: var(--qv-navy) !important; color: #fff !important; }
.qv-btn--primary:hover:not(:disabled) { background: var(--qv-navy-light) !important; }
.qv-btn--primary:disabled { opacity: 0.5 !important; cursor: not-allowed !important; }
.qv-btn--block { width: 100% !important; }

.qv-icon-btn {
	background: transparent !important;
	border: none !important;
	color: var(--qv-navy-light) !important;
	font-size: 15px !important;
	cursor: pointer !important;
	padding: 4px 8px !important;
	border-radius: 6px !important;
}
.qv-icon-btn:hover { background: var(--qv-bg) !important; }

.qv-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--qv-text) !important;
	margin-bottom: 14px;
}
.qv-field input, .qv-field textarea {
	font-family: 'Cairo', sans-serif !important;
	border: 1px solid var(--qv-border) !important;
	border-radius: 8px !important;
	padding: 9px 12px !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	width: 100% !important;
	background: #fff !important;
	color: var(--qv-text) !important;
}
.qv-field input:focus, .qv-field textarea:focus { outline: none !important; border-color: var(--qv-teal) !important; }

.qv-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 6px; }

.qv-chip {
	display: inline-block;
	background: rgba(15,42,67,0.06);
	color: var(--qv-navy);
	font-size: 12px;
	font-weight: 600;
	padding: 3px 10px;
	border-radius: 20px;
}

.qv-muted-text { font-size: 12px !important; color: var(--qv-muted) !important; }

.qv-form-message { font-size: 13px !important; }
.qv-form-message.is-error { color: var(--qv-red) !important; }
.qv-form-message.is-success { color: #0A9E90 !important; }

/* ---------------- زرار السلة العائم ---------------- */

.qv-cart-fab {
	position: fixed !important;
	bottom: 24px !important;
	left: 24px !important;
	background: var(--qv-navy) !important;
	color: #fff !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 14px 22px !important;
	font-family: 'Cairo', sans-serif !important;
	font-weight: 700 !important;
	font-size: 15px !important;
	box-shadow: 0 10px 30px rgba(15,42,67,0.3) !important;
	cursor: pointer !important;
	z-index: 99998 !important;
}
.qv-cart-fab:hover { background: var(--qv-navy-light) !important; }

/* ---------------- سلة عرض السعر (Drawer) ---------------- */

.qv-overlay {
	position: fixed !important;
	inset: 0 !important;
	background: rgba(15,42,67,0.45) !important;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
	z-index: 100000 !important;
}
.qv-overlay.is-open { opacity: 1; pointer-events: auto; }

.qv-drawer {
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 420px !important;
	max-width: 92vw !important;
	height: 100vh !important;
	background: #fff !important;
	box-shadow: -8px 0 30px rgba(15,42,67,0.15) !important;
	transform: translateX(100%);
	transition: transform 0.25s ease;
	z-index: 100001 !important;
	font-family: 'Cairo', sans-serif !important;
	overflow: hidden !important;
}
.qv-drawer.is-open { transform: translateX(0); }

.qv-cart-step { display: flex; flex-direction: column; height: 100%; min-height: 0; }

.qv-drawer-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px 24px;
	border-bottom: 1px solid var(--qv-border);
	flex-shrink: 0;
}
.qv-drawer-header h2 { font-size: 17px !important; font-weight: 700 !important; color: var(--qv-navy) !important; margin: 0 !important; }

.qv-drawer-body { flex: 1 1 auto; min-height: 0; overflow-y: auto !important; padding: 20px 24px; }

.qv-drawer-footer { padding: 16px 24px; border-top: 1px solid var(--qv-border); flex-shrink: 0; background: #fff; }

.qv-cart-footer { display: flex; flex-direction: column; gap: 12px; }

.qv-cart-subtotal {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 15px !important;
	color: var(--qv-navy) !important;
}
.qv-cart-subtotal strong { font-size: 20px !important; }

.qv-cart-line-item {
	display: flex;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid var(--qv-border);
	align-items: center;
}
.qv-cart-line-thumb {
	width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--qv-bg); flex-shrink: 0;
}
.qv-cart-line-info { flex: 1; min-width: 0; }
.qv-cart-line-name { font-size: 13px !important; font-weight: 700 !important; color: var(--qv-navy) !important; }
.qv-cart-line-meta { font-size: 12px !important; color: var(--qv-muted) !important; }
.qv-cart-line-remove { color: var(--qv-red) !important; }

.qv-known-customer-box {
	background: var(--qv-bg);
	border: 1px solid var(--qv-border);
	border-radius: 10px;
	padding: 14px 16px;
}
.qv-known-customer-box strong { color: var(--qv-navy) !important; }

.qv-success-body { text-align: center; padding-top: 30px; }
.qv-quote-number {
	font-family: 'Cairo', sans-serif !important;
	font-size: 24px !important;
	font-weight: 800 !important;
	color: var(--qv-navy) !important;
	background: var(--qv-bg);
	border-radius: 10px;
	padding: 12px;
	margin: 14px 0;
	direction: ltr;
}

@media (max-width: 600px) {
	.qv-form-grid { grid-template-columns: 1fr; }
	.qv-drawer { width: 100% !important; }
	.qv-cart-fab { left: 14px !important; bottom: 14px !important; }
}

/* ==========================================================================
   صفحة متابعة عرض السعر (Quote View)
   ========================================================================== */

.qv-quote-view { max-width: 760px; }

.qv-qv-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 20px;
	flex-wrap: wrap;
	gap: 10px;
}

.qv-qv-header > div:first-child { flex-shrink: 0; min-width: max-content; }

.qv-qv-status-badge { font-size: 13px !important; padding: 6px 14px !important; }

.qv-qv-customer-box { margin-bottom: 20px; }

/* ==========================================================================
   جدول الأصناف والملخص الموحد - بيستخدمه القوالب التلاتة، والاختلاف
   بينهم بيبقى في الشكل بس (الألوان والحدود) مش في الهيكل.
   ========================================================================== */

.qv-items-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 16px;
}
.qv-items-table th {
	text-align: right;
	font-size: 12px;
	padding: 10px 12px;
}
.qv-items-table td {
	padding: 10px 12px;
	font-size: 13px;
	vertical-align: top;
}
.qv-items-th-index { width: 28px; text-align: center !important; }
.qv-items-desc, .qv-items-sku { font-size: 11px !important; }
.qv-items-th-desc, .qv-items-td-desc { font-size: 12px !important; color: var(--qv-muted); max-width: 220px; }

.qv-items-summary {
	margin-bottom: 20px;
	padding: 14px 18px;
}
.qv-items-summary-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4px 0;
	font-size: 13px;
}
.qv-items-summary-total {
	margin-top: 6px;
	padding-top: 10px;
	font-size: 17px;
	font-weight: 800;
}
.qv-items-summary-paid { color: #0A9E90; font-weight: 700; }
.qv-items-summary-remaining { color: var(--qv-red); font-weight: 700; }

/* ---------- شكل القالب العصري (Navy) ---------- */
.qv-tpl-modern {
	max-width: 800px !important;
	background: #fff !important;
}
.qv-tpl-modern .qv-items-table { background: #fff; border: 1px solid var(--qv-border); border-radius: 12px; overflow: hidden; }
.qv-tpl-modern .qv-items-table th { background: var(--qv-bg); color: var(--qv-muted); border-bottom: 1px solid var(--qv-border); }
.qv-tpl-modern .qv-items-table td { border-bottom: 1px solid var(--qv-border); }
.qv-tpl-modern .qv-items-summary { background: #fff; border: 1px solid var(--qv-border); border-radius: 12px; max-width: 300px; margin-right: auto; }
.qv-tpl-modern .qv-items-summary-total { border-top: 1px solid var(--qv-border); color: var(--qv-navy); }

@media print {
	.qv-tpl-modern {
		max-width: 210mm !important;
		background: #fff !important;
	}
}

/* ---------- شكل القالب الأخضر (Q Vision) ---------- */
.qv-tpl-branded .qv-items-table th { background: var(--qv-brand-green); color: #fff; }
.qv-tpl-branded .qv-items-table th:first-child { border-radius: 8px 0 0 0; }
.qv-tpl-branded .qv-items-table th:last-child { border-radius: 0 8px 0 0; }
.qv-tpl-branded .qv-items-table td { border-bottom: 1px solid var(--qv-border); }
.qv-tpl-branded .qv-items-table tbody tr:nth-child(even) { background: rgba(8,130,100,0.05); }
.qv-tpl-branded .qv-items-summary { background: var(--qv-bg); border-radius: 10px; }
.qv-tpl-branded .qv-items-summary-total { border-top: 1px solid var(--qv-border); color: var(--qv-brand-green); }

/* ---------- شكل القالب البسيط (أبيض/أسود) ---------- */
.qv-tpl-plain .qv-items-table th { border-bottom: 2px solid #111; color: #111; }
.qv-tpl-plain .qv-items-table td { border-bottom: 1px solid #e5e5e5; }
.qv-tpl-plain .qv-items-summary { padding: 0; }
.qv-tpl-plain .qv-items-summary-row { max-width: 280px; margin-right: auto; }
.qv-tpl-plain .qv-items-summary-total { border-top: 2px solid #111; color: #111; max-width: 280px; margin-right: auto; }

/* ---------- شريط علوي القالب البسيط (نفس ترتيب الأخضر بالظبط) ---------- */
.qv-pl-topbar { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid #111; padding-bottom: 14px; margin-bottom: 20px; }
.qv-pl-date { font-weight: 700; font-size: 13px; color: #111; }
.qv-pl-title-row { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; flex-wrap: wrap; gap: 10px; }
.qv-pl-title-row > div:first-child { flex-shrink: 0; min-width: max-content; }
.qv-pl-title-row h1 { font-size: 26px; font-weight: 800; margin: 0 0 6px; color: #111; white-space: nowrap; overflow: visible; }
.qv-pl-subtitle { font-size: 14px; color: #444; margin: 0 0 4px; }
.qv-pl-quote-number { font-size: 13px; color: #111; font-weight: 700; direction: ltr; text-align: right; margin: 0; }

.qv-qv-notes {
	background: #fff;
	border: 1px solid var(--qv-border);
	border-radius: 12px;
	padding: 16px 20px;
	margin-bottom: 20px;
}
.qv-qv-notes h3 { font-size: 14px; color: var(--qv-navy); margin: 0 0 8px; }
.qv-qv-notes p { font-size: 14px; color: var(--qv-text); margin: 0; line-height: 1.6; }

.qv-qv-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.qv-qv-decision-msg {
	font-weight: 700 !important;
	padding: 10px 16px !important;
	border-radius: 10px !important;
	font-size: 14px !important;
}
.qv-qv-decision-msg--accepted { background: rgba(15,191,175,0.12) !important; color: #0A9E90 !important; }
.qv-qv-decision-msg--rejected { background: rgba(232,96,76,0.12) !important; color: var(--qv-red) !important; }

.qv-badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 20px;
}
.qv-badge--draft    { background: rgba(148,163,184,0.15); color: #64748B; }
.qv-badge--sent     { background: rgba(22,52,79,0.1);     color: #16344F; }
.qv-badge--viewed   { background: rgba(46,111,149,0.12);  color: #2E6F95; }
.qv-badge--accepted { background: rgba(15,191,175,0.12);  color: #0A9E90; }
.qv-badge--rejected { background: rgba(232,96,76,0.12);   color: var(--qv-red); }
.qv-badge--expired  { background: rgba(242,169,59,0.15);  color: #9A6A1A; }

/* ---------------- رأس الطباعة (Letterhead) - مخفي على الشاشة، ظاهر عند الطباعة بس ---------------- */

.qv-print-only-block { display: none; }

.qv-qv-letterhead {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 16px;
	margin-bottom: 20px;
	border-bottom: 2px solid var(--qv-navy);
}
.qv-qv-letterhead-logo { max-height: 64px; max-width: 160px; object-fit: contain; }
.qv-qv-letterhead-info { font-size: 12px; color: var(--qv-muted); line-height: 1.6; }
.qv-qv-letterhead-info strong { font-size: 16px; color: var(--qv-navy); display: block; margin-bottom: 2px; }

@media print {
	/*
	 * بنخفي كل حاجة في الصفحة (هيدر وفوتر وقائمة الموقع...إلخ) ونظهر
	 * بس محتوى عرض السعر، بغض النظر عن تصميم القالب اللي الموقع شغال
	 * عليه. الطريقة دي مضمونة مع أي ثيم لأنها مش محتاجة تعرف هيكل
	 * الصفحة، بس بتخفي كل حاجة وتطلع بس اللي جوه .qv-portal.
	 */
	body * { visibility: hidden !important; }
	.qv-portal, .qv-portal * { visibility: visible !important; }
	.qv-portal {
		position: absolute !important;
		top: 0 !important;
		right: 0 !important;
		left: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 12px !important;
		background: #fff !important;
		box-shadow: none !important;
	}
	.qv-cart-fab, .qv-print-hide { display: none !important; }
	.qv-print-only-block { display: flex !important; }
	html, body { background: #fff !important; margin: 0 !important; padding: 0 !important; }

	/*
	 * تصغير شامل وقت الطباعة بس (الشاشة العادية فاضلة زي ما هي) عشان
	 * عرض السعر يتظبط في صفحة واحدة حتى لو فيه شوية أصناف، بدل ما
	 * يفيض لصفحة تانية بسبب المسافات والخطوط الكبيرة.
	 */
	.qv-portal { font-size: 12px !important; }
	.qv-portal-title, .qv-br-title, .qv-pl-title-row h1 { font-size: 24px !important; }
	.qv-qv-letterhead { padding-bottom: 10px !important; margin-bottom: 12px !important; }
	.qv-qv-letterhead-logo, .qv-br-logo, .qv-pl-logo { max-height: 50px !important; max-width: 200px !important; }
	.qv-items-table th { padding: 6px 8px !important; font-size: 10px !important; }
	.qv-items-table td { padding: 6px 8px !important; font-size: 11px !important; }
	.qv-items-summary, .qv-qv-notes, .qv-br-notes, .qv-pl-notes, .qv-known-customer-box { padding: 8px 12px !important; }
	.qv-items-summary-row { padding: 2px 0 !important; font-size: 12px !important; }
	.qv-items-summary-total { font-size: 15px !important; padding-top: 6px !important; }
	.qv-items-table { margin-bottom: 10px !important; }
	.qv-qv-notes, .qv-pl-notes, .qv-br-notes { font-size: 10px !important; }
	.qv-qv-header, .qv-qv-customer-box, .qv-br-title-row, .qv-pl-topbar, .qv-pl-title-row { margin-bottom: 10px !important; }
	.qv-items-table { page-break-inside: auto; }
	.qv-items-table tr { page-break-inside: avoid; }
	.qv-br-header { padding: 10px 20px !important; }
	.qv-br-body { padding: 14px !important; }
	.qv-br-footer { padding: 8px 20px !important; }
}

/* ==========================================================================
   قالب "Q Vision الأخضر" (Branded)
   ========================================================================== */

.qv-tpl-branded {
	--qv-brand-green: #088264;
	max-width: 800px;
	background: #fff;
	font-family: 'Cairo', sans-serif;
	padding: 0 !important;
	overflow: hidden;
	border-radius: 12px;
}

.qv-br-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: var(--qv-brand-green);
	padding: 20px 28px;
}
.qv-br-logo { max-height: 46px; max-width: 200px; object-fit: contain; }
.qv-br-date { color: #fff; font-weight: 700; font-size: 14px; }

.qv-br-body { padding: 24px; }

.qv-br-title-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 20px;
	flex-wrap: wrap;
	gap: 10px;
}
.qv-br-title-row > div:first-child { flex-shrink: 0; min-width: max-content; }
.qv-br-title { font-size: 28px; font-weight: 800; color: #111; margin: 0 0 6px; white-space: nowrap; overflow: visible; }
.qv-br-subtitle { font-size: 14px; color: #444; margin: 0 0 4px; }
.qv-br-quote-number { font-size: 13px; color: var(--qv-brand-green); font-weight: 700; direction: ltr; text-align: right; margin: 0; }

.qv-br-notes { margin-bottom: 20px; font-size: 12px; color: #555; }
.qv-br-notes h3 { font-size: 13px; color: var(--qv-brand-green); margin: 0 0 8px; }
.qv-br-notes p { margin: 0 0 8px; line-height: 1.6; }

@media print {
	.qv-tpl-branded { max-width: 100%; }
}

/* ==========================================================================
   قالب "بسيط" (Plain)
   ========================================================================== */

.qv-tpl-plain {
	max-width: 800px;
	background: #fff;
	font-family: 'Cairo', sans-serif;
	color: #1a1a1a;
}

.qv-pl-logo { max-height: 42px; max-width: 180px; object-fit: contain; }

.qv-pl-notes { margin-bottom: 20px; font-size: 12px; color: #555; line-height: 1.6; }

@media print {
	.qv-tpl-plain { max-width: 100%; }
}

/* ==========================================================================
   شعار العميل (يظهر في كل القوالب لو اتضاف من صفحة العملاء)
   ========================================================================== */

.qv-customer-box-with-logo { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.qv-customer-logo { max-height: 44px; max-width: 130px; object-fit: contain; }
.qv-customer-logo--branded { max-height: 40px; max-width: 120px; }
.qv-customer-logo--plain { max-height: 34px; max-width: 110px; margin-top: 4px; }

.qv-br-title-row-side { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }

/* ---------- أعمدة البنود الإضافية في المستند ---------- */

/* الجدول بقى بياخد أعمدة زيادة (نسبة الغلاء + أي أعمدة من الإعدادات)،
   فخانات الأرقام مبتلفّش على سطرين، والوصف هو اللي يتنازل عن المساحة. */
.qv-items-td-num { white-space: nowrap; text-align: center; }
.qv-items-table th, .qv-items-table td { word-break: break-word; }

@media print {
	/* مع أعمدة أكتر، الوصف لازم يسيب مساحة عشان الجدول يدخل في عرض A4. */
	.qv-items-th-desc, .qv-items-td-desc { max-width: 150px !important; }
}