{% extends 'base.html.twig' %}

{% block title %}{{ action == 'new' ? 'Nueva' : 'Editar' }} clase de documento{% endblock %}
{% block page_title %}{{ action == 'new' ? 'Nueva' : 'Editar' }} clase de documento{% endblock %}

{% block body %}
  <div class="max-w-2xl mx-auto">
    <nav class="mb-6">
      <ol class="flex items-center space-x-2 text-sm">
        <li><a href="{{ path('classdoc_index') }}" class="text-primary-600 hover:text-primary-700">Clases de documento</a></li>
        <li class="text-secondary-400">/</li>
        <li class="text-secondary-600">{{ action == 'new' ? 'Nueva' : 'Editar' }}</li>
      </ol>
    </nav>

    <div class="bg-white rounded-xl shadow-sm border border-secondary-200 overflow-hidden">
      <div class="px-6 py-4 border-b border-secondary-200 bg-secondary-50">
        <h2 class="text-lg font-semibold text-secondary-900">{{ action == 'new' ? 'Crear clase de documento' : 'Editar clase de documento' }}</h2>
      </div>

      <form method="post" class="p-6 space-y-6">
        <div>
          <label for="codigo" class="form-label required">Codigo</label>
          <input type="text" id="codigo" name="codigo" value="{{ clase.codigo }}" required maxlength="20" class="form-control {{ errors.codigo is defined ? 'is-invalid' : '' }}" placeholder="Ej: FACT">
          {% if errors.codigo is defined %}<div class="invalid-feedback">{{ errors.codigo }}</div>{% endif %}
        </div>

        <div>
          <label for="nombre" class="form-label required">Nombre</label>
          <input type="text" id="nombre" name="nombre" value="{{ clase.nombre }}" required maxlength="80" class="form-control {{ errors.nombre is defined ? 'is-invalid' : '' }}" placeholder="Ej: Factura">
          {% if errors.nombre is defined %}<div class="invalid-feedback">{{ errors.nombre }}</div>{% endif %}
        </div>

        <div class="flex items-center">
          <input type="checkbox" id="activo" name="activo" class="form-checkbox h-4 w-4 text-primary-600 border-secondary-300 rounded focus:ring-primary-500" {% if clase.activo %}checked{% endif %}>
          <label for="activo" class="ml-2 block text-sm text-secondary-900">Registro activo</label>
        </div>

        <div class="pt-6 border-t border-secondary-200 flex items-center justify-end gap-3">
          <a href="{{ path('classdoc_index') }}" class="btn btn-outline-secondary">Cancelar</a>
          <button type="submit" class="btn btn-primary">Guardar cambios</button>
        </div>
      </form>
    </div>
  </div>
{% endblock %}