{% extends 'base.html' %}{% load static %}{% block title %}{{ product.name }}{% endblock %}{% block meta_description %}{{ product.description|striptags|truncatechars:155 }}{% endblock %}{% block social_title %}{{ product.name }} | Genez Print & Studio{% endblock %}{% block social_description %}{{ product.description|striptags|truncatechars:155 }}{% endblock %}{% block breadcrumb %}Product Details{% endblock %}{% block content %}
<div class="page-head"><div><div class="kicker">CUSTOMIZE YOUR ORDER</div><h2>Product Details</h2><p>Configure your specifications and see an instant estimate.</p></div><a href="{% url 'categories' %}" class="btn outline small">← All products</a></div>
<nav class="v20-detail-breadcrumb" aria-label="Breadcrumb"><a href="{% url 'home' %}">Home</a><span>›</span><a href="{% url 'categories' %}">Products &amp; Services</a><span>›</span><span aria-current="page">{{ product.name }}</span></nav>
<div class="product-detail-layout v20-product-detail"><section class="card card-pad product-visual-card"><div class="detail-main-image"><img src="{% if product.has_service_image %}{% url 'product_image' product.pk %}{% else %}{% static 'img/' %}{{ product.catalogue_image_key }}{% endif %}" alt="{{ product.name }}" fetchpriority="high" decoding="async"></div><div class="thumb-row"><div class="thumb-selected"><img src="{% if product.has_service_image %}{% url 'product_image' product.pk %}{% else %}{% static 'img/' %}{{ product.catalogue_image_key }}{% endif %}" alt="{{ product.name }} preview" loading="lazy" decoding="async"></div><div class="thumb-note">Professional-quality printing and creative services from Genez.<br><span class="muted">Illustrative product preview</span></div></div></section><section class="card card-pad detail-info"><span class="product-category">{{ product.category.name }}</span><h2>{{ product.name }}</h2><p class="v20-product-kind">✦ Genez print &amp; creative services</p><div class="price" id="live-price">₦{{ min_total|floatformat:2 }}</div><p class="muted">{{ product.description }}</p>
<form method="post" action="{% url 'cart_add' %}" data-price-calculator data-quote-url="{% url 'product_quote' product.slug %}" data-price="{{ product.starting_unit_price }}" data-min="{{ product.min_quantity }}">{% csrf_token %}<input type="hidden" name="product_id" value="{{ product.id }}">
{% if configurable_print %}<div class="detail-group"><label class="field">Product size<select name="size"><option value="A5">A5</option><option value="A4">A4</option><option value="A3">A3</option></select></label></div>
<div class="detail-group"><label class="field">Material / paper<select name="paper"><option value="Glossy">Glossy</option><option value="Matte">Matte</option></select></label></div>{% else %}<input type="hidden" name="size" value="Standard"><input type="hidden" name="paper" value="Standard"><p class="page-note">This service uses a standard starting rate. Job specifications and custom requirements are confirmed with the Genez team after ordering.</p>{% endif %}
<div class="detail-group"><label class="field">Quantity<input name="quantity" type="number" min="{{ product.min_quantity }}" max="100000" value="{{ product.min_quantity }}" required></label></div>
{% if bulk_tiers %}<div class="v7-bulk"><strong>Bulk order savings</strong><div class="v7-tiers">{% for tier in bulk_tiers %}<span class="v7-tier">{{ tier.min_quantity }}+ units: {{ tier.discount_percent|floatformat:0 }}% off</span>{% endfor %}</div><p class="muted small">Applied automatically to qualifying quantities before checkout. Product specifications affect the final total.</p></div>{% endif %}
<div class="quote-note" aria-live="polite"><strong>Server-calculated quotation</strong><span id="v6-quote-details">Calculating from product specifications…</span><span id="v26-turnaround" class="muted small">{% if product.production_days_min and product.production_days_max %}Estimated production: {{ product.production_days_min }}–{{ product.production_days_max }} working days after artwork approval. Delivery is scheduled separately.{% else %}Production timing and delivery are confirmed with your quote.{% endif %}</span><span class="muted small">This is an estimate; delivery is quoted separately. Your cart is independently repriced by the server.</span></div>
<button class="btn block" type="submit">🛒 Add to Cart · Continue Ordering</button><a class="btn outline block" href="{% url 'custom_quote_request' %}?product={{ product.slug|urlencode }}">Request a custom quote</a><a class="btn outline block" href="{% url 'studio' %}?product_id={{ product.pk }}">✎ Customize Design</a><div class="v20-product-reassurance"><span>✓ Artwork reviewed before production</span><span>✓ Track each stage in your account</span></div></form></section></div>
<section class="card card-pad v10-reviews"><div class="page-head"><div><h3>Verified customer reviews</h3><p class="muted small">Only customers with confirmed delivered orders can review a product.</p></div>
{% if review_count %}<span class="status-pill">★ {{ review_average|floatformat:1 }} / 5 · {{ review_count }} review{{ review_count|pluralize }}</span>{% endif %}</div>
<div class="v10-review-list">{% for review in verified_reviews %}<article class="v10-review"><strong>★ {{ review.rating }}/5</strong><span class="muted small">Verified delivered purchase · {{ review.created_at|date:'M Y' }}</span><p>{{ review.comment|linebreaksbr }}</p></article>{% empty %}<p class="muted">No verified reviews yet. Customer feedback appears here after successful delivery.</p>{% endfor %}</div></section>
{% endblock %}