<?php
$client_info = $this->quotations_model->check_by(array('client_id' => $quotations_info->client_id), 'tbl_client');
$user_info = $this->quotations_model->check_by(array('user_id' => $quotations_info->user_id), 'tbl_users');
$reviewer_info = $this->quotations_model->check_by(array('user_id' => $quotations_info->reviewer_id), 'tbl_users');
$reviewer_account_info = $this->quotations_model->check_by(array('user_id' => $quotations_info->reviewer_id), 'tbl_account_details');
$currency = $this->quotations_model->client_currency_symbol($quotations_info->client_id);

if (empty($currency)) {
	$currency = $this->quotations_model->check_by(array('code' => config_item('default_currency')), 'tbl_currencies');
}

$generated_by_name = !empty($user_info->username) ? $user_info->username : '-';
$generated_by_role = '-';
if (!empty($user_info)) {
	if ((int) $user_info->role_id === 1) {
		$generated_by_role = lang('admin');
	} elseif ((int) $user_info->role_id === 3) {
		$generated_by_role = lang('staff');
	} else {
		$generated_by_role = lang('client');
	}
}

$reviewer_name = '-';
$reviewer_role = '-';
if (!empty($reviewer_info)) {
	$reviewer_name = !empty($reviewer_account_info->fullname) ? $reviewer_account_info->fullname : $reviewer_info->username;
	if ((int) $reviewer_info->role_id === 1) {
		$reviewer_role = lang('admin');
	} elseif ((int) $reviewer_info->role_id === 3) {
		$reviewer_role = lang('staff');
	} else {
		$reviewer_role = lang('client');
	}
}

$status_class = !empty($quotations_info->quotations_status) && $quotations_info->quotations_status === 'completed'
	? 'quotation-detail-status quotation-detail-status--completed'
	: 'quotation-detail-status quotation-detail-status--pending';

$status_text = !empty($quotations_info->quotations_status) && $quotations_info->quotations_status === 'completed'
	? lang('completed')
	: lang('pending');

$amount_text = !empty($quotations_info->quotations_amount) && !empty($currency->symbol)
	? display_money($quotations_info->quotations_amount, $currency->symbol)
	: lang('pending');

$convert_url = null;
$convert_reference = null;
if ($quotations_info->quotations_status === 'completed' && $quotations_info->is_convert === 'Yes' && !empty($quotations_info->convert_module_id)) {
	if ($quotations_info->convert_module === 'invoice') {
		$convert_info = $this->quotations_model->check_by(array('invoices_id' => $quotations_info->convert_module_id), 'tbl_invoices');
		$convert_url = base_url('admin/invoice/manage_invoice/invoice_details/' . $quotations_info->convert_module_id);
	} else {
		$convert_info = $this->quotations_model->check_by(array('estimates_id' => $quotations_info->convert_module_id), 'tbl_estimates');
		$convert_url = base_url('admin/estimates/create/estimates_details/' . $quotations_info->convert_module_id);
	}

	if (!empty($convert_info->reference_no)) {
		$convert_reference = $convert_info->reference_no;
	}
}
?>

<div id="printableArea" class="quotation-detail-page space-y-6">
	<section class="rounded-3xl border border-border bg-card shadow-sm overflow-hidden">
		<div class="quotation-detail-hero">
			<div>
				<div class="quotation-detail-hero__eyebrow-wrap">
					<a href="<?= base_url('admin/quotations') ?>" class="quotation-detail-back">
						<i data-lucide="arrow-left" class="h-4 w-4"></i>
						<?= lang('quotations') ?>
					</a>
					<span class="quotation-detail-eyebrow"><?= lang('quotation_details') ?></span>
				</div>
				<h1 class="quotation-detail-title"><?= html_escape($quotations_info->quotations_form_title) ?></h1>
				<p class="quotation-detail-subtitle">A complete admin view of quotation request details, submitted responses, conversion status, and pricing workflow actions.</p>
			</div>
		</div>

		<div class="quotation-detail-stats">
			<article class="quotation-detail-stat">
				<span class="quotation-detail-stat__label"><?= lang('status') ?></span>
				<span class="<?= $status_class ?>"><?= $status_text ?></span>
			</article>
			<article class="quotation-detail-stat">
				<span class="quotation-detail-stat__label"><?= lang('date') ?></span>
				<strong class="quotation-detail-stat__value"><?= display_date($quotations_info->quotations_date) ?></strong>
			</article>
			<article class="quotation-detail-stat">
				<span class="quotation-detail-stat__label"><?= lang('amount') ?></span>
				<strong class="quotation-detail-stat__value"><?= $amount_text ?></strong>
			</article>
			<article class="quotation-detail-stat">
				<span class="quotation-detail-stat__label"><?= lang('reviewer') ?></span>
				<strong class="quotation-detail-stat__value"><?= html_escape($reviewer_name) ?></strong>
			</article>
		</div>
	</section>

	<div class="grid gap-6 xl:grid-cols-12">
		<aside class="xl:col-span-4 rounded-3xl border border-border bg-card shadow-sm">
			<div class="quotation-detail-card-head">
				<h2><?= lang('quotation_details') ?></h2>
				<p>Client, reviewer, and generated summary.</p>
			</div>

			<div class="quotation-detail-overview">
				<div class="quotation-detail-overview__row">
					<span><?= lang('client') ?></span>
					<strong><?= html_escape($quotations_info->name) ?></strong>
				</div>
				<div class="quotation-detail-overview__row">
					<span><?= lang('email') ?></span>
					<strong><?= html_escape($quotations_info->email) ?></strong>
				</div>
				<div class="quotation-detail-overview__row">
					<span><?= lang('mobile') ?></span>
					<strong><?= html_escape($quotations_info->mobile) ?></strong>
				</div>
				<div class="quotation-detail-overview__row">
					<span><?= lang('generated_by') ?></span>
					<strong><?= html_escape($generated_by_name . ' (' . $generated_by_role . ')') ?></strong>
				</div>
				<?php if (!empty($reviewer_info)) : ?>
					<div class="quotation-detail-overview__row">
						<span><?= lang('reviewer') ?></span>
						<strong><?= html_escape($reviewer_name . ' (' . $reviewer_role . ')') ?></strong>
					</div>
					<div class="quotation-detail-overview__row">
						<span><?= lang('reviewed_date') ?></span>
						<strong><?= !empty($quotations_info->reviewed_date) ? display_date($quotations_info->reviewed_date) : '-' ?></strong>
					</div>
				<?php endif; ?>
			</div>

			<?php if (!empty($quotations_info->notes)) : ?>
				<div class="quotation-detail-note">
					<h3><?= lang('comments') ?></h3>
					<p><?= nl2br(html_escape(strip_tags($quotations_info->notes))) ?></p>
				</div>
			<?php endif; ?>
		</aside>

		<section class="xl:col-span-8 rounded-3xl border border-border bg-card shadow-sm">
			<div class="quotation-detail-card-head">
				<h2><?= lang('quotaion_form_response') ?></h2>
				<p>All submitted responses are presented in a clearer admin-readable format.</p>
			</div>

			<div class="quotation-detail-response-list">
				<?php if (!empty($quotation_details)) : ?>
					<?php foreach ($quotation_details as $v_q_details) : ?>
						<article class="quotation-detail-response-card">
							<div class="quotation-detail-response-card__head">
								<h3><?= html_escape($v_q_details->quotation_form_data) ?></h3>
							</div>
							<div class="quotation-detail-response-card__body">
								<?php
								$decoded_value = @unserialize($v_q_details->quotation_data);
								if ($decoded_value !== false || $v_q_details->quotation_data === 'b:0;') :
									$multiple_data = is_array($decoded_value) ? $decoded_value : array();
								?>
									<div class="quotation-detail-chip-list">
										<?php foreach ($multiple_data as $index => $response_value) : ?>
											<span class="quotation-detail-chip"><?= ($index + 1) . '. ' . html_escape($response_value) ?></span>
										<?php endforeach; ?>
									</div>
								<?php else : ?>
									<p><?= nl2br(html_escape($v_q_details->quotation_data)) ?></p>
								<?php endif; ?>
							</div>
						</article>
					<?php endforeach; ?>
				<?php else : ?>
					<div class="quotation-detail-empty">
						<i data-lucide="file-search" class="h-5 w-5"></i>
						<span><?= lang('no_data') ?></span>
					</div>
				<?php endif; ?>
			</div>
		</section>
	</div>
</div>

<style>
	.quotation-detail-page .quotation-detail-hero {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		padding: 1.2rem 1.25rem;
		background:
			radial-gradient(circle at top right, rgba(79, 70, 229, 0.14), transparent 36%),
			linear-gradient(135deg, rgba(15, 23, 42, 0.02), rgba(59, 130, 246, 0.05));
	}

	.quotation-detail-page .quotation-detail-hero__eyebrow-wrap {
		display: flex;
		flex-wrap: wrap;
		gap: 0.55rem;
		align-items: center;
	}

	.quotation-detail-page .quotation-detail-back,
	.quotation-detail-page .quotation-detail-eyebrow,
	.quotation-detail-page .quotation-detail-btn {
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
		border-radius: 999px;
		padding: 0.48rem 0.8rem;
		font-size: 0.76rem;
		font-weight: 700;
		text-decoration: none;
	}

	.quotation-detail-page .quotation-detail-back {
		border: 1px solid hsl(var(--border));
		background: hsl(var(--background));
		color: hsl(var(--foreground));
	}

	.quotation-detail-page .quotation-detail-eyebrow {
		border: 1px solid hsl(var(--primary) / 0.2);
		background: hsl(var(--primary) / 0.08);
		color: hsl(var(--primary));
		letter-spacing: 0.12em;
		text-transform: uppercase;
	}

	.quotation-detail-page .quotation-detail-title {
		margin: 0.55rem 0 0.3rem;
		color: hsl(var(--foreground));
		font-size: clamp(1.55rem, 1.8vw, 2rem);
		font-weight: 700;
		line-height: 1.12;
	}

	.quotation-detail-page .quotation-detail-subtitle {
		margin: 0;
		max-width: 48rem;
		color: hsl(var(--muted-foreground));
		font-size: 0.9rem;
		line-height: 1.6;
	}

	

	.quotation-detail-page .quotation-detail-btn {
		border: 1px solid hsl(var(--border));
		background: hsl(var(--background));
		color: hsl(var(--foreground));
	}

	.quotation-detail-page .quotation-detail-btn--primary {
		border-color: hsl(var(--primary));
		background: hsl(var(--primary));
		color: hsl(var(--primary-foreground));
	}

	.quotation-detail-page .quotation-detail-btn--primary:hover {
		filter: brightness(0.95);
		color: hsl(var(--primary-foreground));
	}

	.quotation-detail-page .quotation-detail-btn--muted {
		cursor: pointer;
	}

	.quotation-detail-page .quotation-detail-action-dropdown .dropdown-menu {
		border: 1px solid hsl(var(--border));
		border-radius: 0.85rem;
		box-shadow: 0 18px 36px -24px rgba(15, 23, 42, 0.25);
		overflow: hidden;
	}

	.quotation-detail-page .quotation-detail-action-dropdown .dropdown-menu>li>a {
		padding: 0.55rem 0.9rem;
		font-size: 0.86rem;
	}

	.quotation-detail-page .quotation-detail-stats {
		display: grid;
		gap: 1rem;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding: 0 1.25rem 1.25rem;
	}

	.quotation-detail-page .quotation-detail-stat {
		border: 1px solid hsl(var(--border));
		background: hsl(var(--background));
		border-radius: 1.2rem;
		padding: 0.85rem;
	}

	.quotation-detail-page .quotation-detail-stat__label {
		display: block;
		color: hsl(var(--muted-foreground));
		font-size: 0.72rem;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
	}

	.quotation-detail-page .quotation-detail-stat__value {
		display: block;
		margin-top: 0.4rem;
		color: hsl(var(--foreground));
		font-size: 1rem;
		font-weight: 700;
	}

	.quotation-detail-page .quotation-detail-status {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 7rem;
		margin-top: 0.4rem;
		border-radius: 999px;
		padding: 0.55rem 0.85rem;
		font-size: 0.8rem;
		font-weight: 700;
		text-transform: uppercase;
	}

	.quotation-detail-page .quotation-detail-status--completed {
		background: rgba(16, 185, 129, 0.12);
		color: #059669;
	}

	.quotation-detail-page .quotation-detail-status--pending {
		background: rgba(245, 158, 11, 0.12);
		color: #d97706;
	}

	.quotation-detail-page .quotation-detail-card-head {
		padding: 1.5rem 1.5rem 1.1rem;
		border-bottom: 1px solid hsl(var(--border));
	}

	.quotation-detail-page .quotation-detail-card-head h2 {
		margin: 0;
		color: hsl(var(--foreground));
		font-size: 1.15rem;
		font-weight: 700;
	}

	.quotation-detail-page .quotation-detail-card-head p {
		margin: 0.45rem 0 0;
		color: hsl(var(--muted-foreground));
		font-size: 0.92rem;
		line-height: 1.65;
	}

	.quotation-detail-page .quotation-detail-overview {
		padding: 1.4rem 1.5rem 1.2rem;
	}

	.quotation-detail-page .quotation-detail-overview__row {
		display: flex;
		justify-content: space-between;
		gap: 1rem;
		padding: 0.95rem 0;
		border-bottom: 1px solid hsl(var(--border));
	}

	.quotation-detail-page .quotation-detail-overview__row:last-child {
		border-bottom: 0;
		padding-bottom: 0;
	}

	.quotation-detail-page .quotation-detail-overview__row span {
		color: hsl(var(--muted-foreground));
		font-size: 0.86rem;
	}

	.quotation-detail-page .quotation-detail-overview__row strong {
		color: hsl(var(--foreground));
		font-size: 0.92rem;
		font-weight: 700;
		text-align: right;
	}

	.quotation-detail-page .quotation-detail-note {
		margin: 0 1.5rem 1.5rem;
		border: 1px solid hsl(var(--border));
		background: hsl(var(--background));
		border-radius: 1.2rem;
		padding: 1rem;
	}

	.quotation-detail-page .quotation-detail-note h3 {
		margin: 0 0 0.5rem;
		color: hsl(var(--foreground));
		font-size: 0.95rem;
		font-weight: 700;
	}

	.quotation-detail-page .quotation-detail-note p {
		margin: 0;
		color: hsl(var(--muted-foreground));
		font-size: 0.9rem;
		line-height: 1.75;
	}

	.quotation-detail-page .quotation-detail-response-list {
		padding: 1.5rem;
		display: grid;
		gap: 1rem;
	}

	.quotation-detail-page .quotation-detail-response-card {
		border: 1px solid hsl(var(--border));
		background: linear-gradient(180deg, hsl(var(--card)), hsl(var(--background)));
		border-radius: 1.25rem;
		overflow: hidden;
		box-shadow: 0 20px 45px -34px rgba(15, 23, 42, 0.3);
	}

	.quotation-detail-page .quotation-detail-response-card__head {
		padding: 1rem 1.1rem;
		border-bottom: 1px solid hsl(var(--border));
		background: hsl(var(--background) / 0.8);
	}

	.quotation-detail-page .quotation-detail-response-card__head h3 {
		margin: 0;
		color: hsl(var(--foreground));
		font-size: 1rem;
		font-weight: 700;
	}

	.quotation-detail-page .quotation-detail-response-card__body {
		padding: 1rem 1.1rem;
	}

	.quotation-detail-page .quotation-detail-response-card__body p {
		margin: 0;
		color: hsl(var(--muted-foreground));
		font-size: 0.92rem;
		line-height: 1.8;
		word-break: break-word;
	}

	.quotation-detail-page .quotation-detail-chip-list {
		display: flex;
		flex-wrap: wrap;
		gap: 0.6rem;
	}

	.quotation-detail-page .quotation-detail-chip {
		display: inline-flex;
		align-items: center;
		border: 1px solid hsl(var(--border));
		background: hsl(var(--background));
		border-radius: 999px;
		padding: 0.55rem 0.85rem;
		color: hsl(var(--foreground));
		font-size: 0.84rem;
		font-weight: 600;
	}

	.quotation-detail-page .quotation-detail-empty {
		display: inline-flex;
		align-items: center;
		gap: 0.6rem;
		border: 1px dashed hsl(var(--border));
		border-radius: 1rem;
		padding: 1rem;
		color: hsl(var(--muted-foreground));
		font-size: 0.92rem;
	}

	@media (min-width: 768px) {
		.quotation-detail-page .quotation-detail-hero {
			flex-direction: row;
			justify-content: space-between;
			align-items: flex-start;
		}

		.quotation-detail-page .quotation-detail-stats {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
	}

	@media print {
		@page {
			margin: 12mm;
		}

		body {
			display: block !important;
			background: #fff !important;
			color: #111827 !important;
		}

		#sidebar,
		#sidebar-backdrop,
		body > main > header,
		.hidden-print,
		.quotation-detail-page .quotation-detail-back,
		.quotation-detail-page .quotation-detail-subtitle,
		.quotation-detail-page i[data-lucide] {
			display: none !important;
		}

		body > main {
			display: block !important;
			height: auto !important;
			overflow: visible !important;
			width: 100% !important;
		}

		body > main > .flex-1 {
			overflow: visible !important;
			padding: 0 !important;
		}

		body > main > .flex-1 > *:not(#printableArea) {
			display: none !important;
		}

		.quotation-detail-page {
			margin: 0 !important;
			gap: 0.85rem !important;
		}

		.quotation-detail-page .quotation-detail-hero {
			display: block !important;
			padding: 0 0 0.85rem !important;
			background: none !important;
			border-bottom: 1px solid #d1d5db !important;
		}

		.quotation-detail-page .quotation-detail-eyebrow {
			border: 1px solid #d1d5db !important;
			background: #fff !important;
			color: #111827 !important;
		}

		.quotation-detail-page .quotation-detail-title {
			margin-top: 0.55rem !important;
			color: #111827 !important;
			font-size: 20px !important;
		}

		.quotation-detail-page .quotation-detail-stats,
		.quotation-detail-page>.grid {
			display: block !important;
			padding: 0 !important;
		}

		.quotation-detail-page .quotation-detail-stat,
		.quotation-detail-page aside,
		.quotation-detail-page section,
		.quotation-detail-page .quotation-detail-response-card,
		.quotation-detail-page .quotation-detail-note {
			margin-bottom: 0.65rem !important;
			border: 1px solid #d1d5db !important;
			border-radius: 6px !important;
			background: #fff !important;
			box-shadow: none !important;
			break-inside: avoid;
			page-break-inside: avoid;
		}

		.quotation-detail-page .quotation-detail-card-head,
		.quotation-detail-page .quotation-detail-response-card__head {
			background: #fff !important;
		}

		.quotation-detail-page .quotation-detail-status--completed,
		.quotation-detail-page .quotation-detail-status--pending,
		.quotation-detail-page .quotation-detail-chip {
			border: 1px solid #d1d5db !important;
			background: #fff !important;
			color: #111827 !important;
		}
	}
</style>

<script type="text/javascript">
	function printDiv(printableArea) {
		window.print();
	}
</script>
