<?php
defined('BASEPATH') OR exit('No direct script access allowed');
/** SERVICE FORM — Expects: $service, $mode. */
$s = $service;
$icons = array('sparkle','star','palette','camera','film','handshake','users','calendar','grid','quote','tag');
$steps = decode_json($s['process_steps']);
?>
<div class="page-head">
	<div><h2><?= $mode === 'edit' ? 'Edit' : 'Add' ?> Service</h2></div>
	<a href="<?= base_url('admin/services') ?>" class="btn btn-ghost">← Back</a>
</div>

<form action="<?= base_url('admin/services/save') ?>" method="post" enctype="multipart/form-data">
	<?= form_hidden($this->security->get_csrf_token_name(), $this->security->get_csrf_hash()) ?>
	<input type="hidden" name="id" value="<?= (int) $s['id'] ?>">

	<div class="grid grid-2-1">
		<div>
			<div class="card">
				<div class="card-head"><h3>Service Details</h3></div>
				<div class="card-body">
					<div class="form-grid cols-2">
						<div class="fld"><label>Title <span class="req">*</span></label>
							<input type="text" name="title" value="<?= html_escape($s['title']) ?>" required data-slug-source></div>
						<div class="fld"><label>Slug</label>
							<input type="text" name="slug" value="<?= html_escape($s['slug']) ?>" data-slug-target placeholder="auto-generated"></div>
						<div class="fld fld-full"><label>Summary</label>
							<textarea name="summary" placeholder="Short one-line summary shown on cards"><?= html_escape($s['summary']) ?></textarea></div>
						<div class="fld fld-full"><label>Full Description</label>
							<textarea name="description" style="min-height:160px;"><?= html_escape($s['description']) ?></textarea></div>
						<div class="fld fld-full"><label>Who It's For</label>
							<input type="text" name="for_who" value="<?= html_escape($s['for_who']) ?>" placeholder="e.g. Brands launching a new product line"></div>
					</div>
				</div>
			</div>

			<!-- PROCESS STEPS repeater -->
			<div class="card" data-repeater>
				<div class="card-head">
					<h3>Process Steps</h3>
					<button type="button" class="btn btn-ghost btn-sm" data-repeater-add><?= bloom_icon('plus', 14) ?> Add Step</button>
				</div>
				<div class="card-body">
					<div data-repeater-list>
						<?php foreach ($steps as $st): ?>
							<div class="form-grid cols-2" data-repeater-row style="margin-bottom:12px;align-items:end;">
								<div class="fld"><label>Step Title</label>
									<input type="text" name="step_title[]" value="<?= html_escape($st['title'] ?? '') ?>"></div>
								<div class="fld" style="display:flex;gap:8px;align-items:flex-end;">
									<div style="flex:1;"><label>Step Text</label>
										<input type="text" name="step_text[]" value="<?= html_escape($st['text'] ?? '') ?>"></div>
									<button type="button" class="icon-btn danger" data-repeater-remove><?= bloom_icon('trash', 16) ?></button>
								</div>
							</div>
						<?php endforeach; ?>
					</div>
					<template data-repeater-template>
						<div class="form-grid cols-2" data-repeater-row style="margin-bottom:12px;align-items:end;">
							<div class="fld"><label>Step Title</label><input type="text" name="step_title[]"></div>
							<div class="fld" style="display:flex;gap:8px;align-items:flex-end;">
								<div style="flex:1;"><label>Step Text</label><input type="text" name="step_text[]"></div>
								<button type="button" class="icon-btn danger" data-repeater-remove><?= bloom_icon('trash', 16) ?></button>
							</div>
						</div>
					</template>
					<?php if (empty($steps)): ?><p class="muted" style="font-size:.85rem;">No steps yet — add steps to show a process timeline on the service page.</p><?php endif; ?>
				</div>
			</div>

			<!-- SEO -->
			<div class="card">
				<div class="card-head"><h3>SEO</h3></div>
				<div class="card-body">
					<div class="form-grid">
						<div class="fld"><label>Meta Title</label><input type="text" name="meta_title" value="<?= html_escape($s['meta_title']) ?>"></div>
						<div class="fld"><label>Meta Description</label><textarea name="meta_desc"><?= html_escape($s['meta_desc']) ?></textarea></div>
					</div>
				</div>
			</div>
		</div>

		<div>
			<div class="card">
				<div class="card-head"><h3>Display</h3></div>
				<div class="card-body">
					<div class="fld"><label>Icon</label>
						<select name="icon">
							<?php foreach ($icons as $ic): ?>
								<option value="<?= $ic ?>" <?= $s['icon'] === $ic ? 'selected' : '' ?>><?= ucfirst($ic) ?></option>
							<?php endforeach; ?>
						</select>
					</div>
					<div class="fld"><label>Image</label>
						<?php if ($s['image']): ?><img src="<?= upload_url($s['image']) ?>" class="thumb-lg" id="imgPrev" style="margin-bottom:8px;"><?php else: ?><img src="" class="thumb-lg" id="imgPrev" style="display:none;margin-bottom:8px;"><?php endif; ?>
						<?php $this->load->view('admin/partials/_upload_field', array(
						'name' => 'image',
						'accept' => 'image/*',
						'icon' => 'image',
						'label' => 'Choose image',
						'preview' => '#imgPrev',
					)); ?>
					</div>
					<div class="fld"><label>CTA Button Label</label>
						<input type="text" name="cta_label" value="<?= html_escape($s['cta_label']) ?>"></div>
					<div class="fld"><label>Sort Order</label>
						<input type="number" name="sort_order" value="<?= (int) $s['sort_order'] ?>"></div>
					<div class="fld"><label class="check"><input type="checkbox" name="is_active" value="1" <?= $s['is_active'] ? 'checked' : '' ?>><span>Active</span></label></div>
				</div>
			</div>
		</div>
	</div>

	<div class="card"><div class="card-body"><div class="form-actions">
		<button type="submit" class="btn btn-primary"><?= bloom_icon('check', 16) ?> Save Service</button>
		<a href="<?= base_url('admin/services') ?>" class="btn btn-ghost">Cancel</a>
	</div></div></div>
</form>
