{% extends "invoices/base.html" %}
{% load static %}

{# templates/invoices/barcode_sticker_form.html #}
{% block title %}Barcode Sticker — Settings{% endblock %}
{% block heading %}Barcode Sticker — Settings{% endblock %}

{% block content %}
<div class="card shadow mb-3">
  <div class="card-body">
    <form method="get"
          action="{% url 'invoices:barcode_sticker_preview' %}"
          target="_blank"  class="small">

      <div class="row">
        <div class="col-md-2">
          <label class="form-label mb-1">Width (inches)</label>
          <input type="number" step="0.01" min="0.5" class="form-control"
                 name="w" value="{{ defaults.w|default:'1.5' }}">
        </div>
        <div class="col-md-2">
          <label class="form-label mb-1">Height (inches)</label>
          <input type="number" step="0.01" min="0.5" class="form-control"
                 name="h" value="{{ defaults.h|default:'1.0' }}">
        </div>
      </div>

      <hr>

      <div class="row">
        <div class="col-md-6">
          <label class="form-label mb-1">Sticker Header</label>
          <input type="text" class="form-control"
                 name="header" value="{{ defaults.header|default:'Business Name' }}">
          <div class="form-text">Default: Business Name</div>
        </div>
        <div class="col-md-6">
          <label class="form-label mb-1">Product Code (for barcode)</label>
          <input type="text" class="form-control"
                 name="code" value="{{ defaults.code }}">
          <div class="form-text">CODE128 compatible (alphanumeric allowed)</div>
        </div>
      </div>

      <div class="row mt-2">
        <div class="col-md-6">
          <label class="form-label mb-1">Product Name</label>
          <input type="text" class="form-control" name="name" value="{{ defaults.name }}">
        </div>
      </div>

      <div class="row mt-2">
        <div class="col-md-3">
          <label class="form-label mb-1">Line 1</label>
          <input type="text" class="form-control" name="l1" value="{{ defaults.l1 }}">
        </div>
        <div class="col-md-3">
          <label class="form-label mb-1">Line 2</label>
          <input type="text" class="form-control" name="l2" value="{{ defaults.l2 }}">
        </div>
        <div class="col-md-3">
          <label class="form-label mb-1">Line 3</label>
          <input type="text" class="form-control" name="l3" value="{{ defaults.l3 }}">
        </div>
        <div class="col-md-3">
          <label class="form-label mb-1">Line 4</label>
          <input type="text" class="form-control" name="l4" value="{{ defaults.l4 }}">
        </div>
      </div>

      <div class="mt-3 d-flex gap-2">
        <button class="btn btn-primary btn-sm" type="submit">Preview / Print</button>
        <a class="btn btn-outline-secondary btn-sm"
           href="{% url 'invoices:barcode_sticker_generator' %}">Reset</a>
      </div>
    </form>
  </div>
</div>
{% endblock %}