{% extends 'base.html' %}
{% block title %}{% if swp %}Editar{% else %}Nuevo{% endif %} Procedimiento{% endblock %}
{% block page_title %}{% if swp %}Editar — {{ swp.code }}{% else %}Nuevo Procedimiento SWP{% endif %}{% endblock %}
{% block topbar_actions %}
    <a href="{{ url_for('ism_index') }}" class="btn btn-secondary">← Volver</a>
{% endblock %}
{% block content %}
<div class="card" style="max-width:860px">
<form method="POST">
    {% if is_superadmin and companies %}
    <div class="form-group mb-4" style="background:rgba(0,180,216,0.06);border:1px solid rgba(0,180,216,0.2);border-radius:8px;padding:12px 16px">
        <label style="color:var(--cyan)">🏢 Compañía *</label>
        <select name="company_id" required>
            <option value="">— Seleccionar compañía —</option>
            {% for c in companies %}
            <option value="{{ c.id }}">{{ c.name }}</option>
            {% endfor %}
        </select>
    </div>
    {% endif %}
    <div class="form-grid">
        <div class="form-group">
            <label>Código <span style="color:var(--gray);font-size:11px">(asignado automáticamente)</span></label>
            <input type="text" name="code" value="{{ swp.code if swp else code }}"
                   readonly style="opacity:0.6;cursor:not-allowed;background:rgba(255,255,255,0.03)">
        </div>
        <div class="form-group">
            <label>Categoría *</label>
            <select name="category" required>
                {% for val, label in categories %}
                <option value="{{ val }}" {% if swp and swp.category==val %}selected{% endif %}>{{ label }}</option>
                {% endfor %}
            </select>
        </div>
        <div class="form-group full">
            <label>Título del Procedimiento *</label>
            <input type="text" name="title" required
                   value="{{ swp.title if swp else '' }}"
                   placeholder="Ej: Procedimiento para trabajo eléctrico a bordo">
        </div>
        <div class="form-group full">
            <label>Propósito</label>
            <textarea name="purpose" rows="2" placeholder="¿Para qué sirve este procedimiento?">{{ swp.purpose if swp else '' }}</textarea>
        </div>
        <div class="form-group full">
            <label>Alcance</label>
            <textarea name="scope" rows="2" placeholder="¿A qué trabajos y personal aplica?">{{ swp.scope if swp else '' }}</textarea>
        </div>
        <div class="form-group full">
            <label>Riesgos Identificados <span style="color:var(--gray);font-size:11px">(uno por línea)</span></label>
            <textarea name="hazards" rows="4" placeholder="Electrocución&#10;Quemaduras&#10;Caída al agua&#10;Cortocircuito">{{ swp.hazards if swp else '' }}</textarea>
        </div>
        <div class="form-group full">
            <label>EPP Requerido <span style="color:var(--gray);font-size:11px">(uno por línea)</span></label>
            <textarea name="ppe" rows="3" placeholder="Guantes dieléctricos&#10;Gafas de seguridad&#10;Zapatos con aislamiento">{{ swp.ppe if swp else '' }}</textarea>
        </div>
        <div class="form-group full">
            <label>Herramientas y Materiales <span style="color:var(--gray);font-size:11px">(uno por línea)</span></label>
            <textarea name="tools" rows="3" placeholder="Multímetro&#10;Destornillador aislado&#10;Cinta aislante"></textarea>
        </div>
        <div class="form-group full">
            <label>Pasos del Procedimiento <span style="color:var(--gray);font-size:11px">(uno por línea, en orden)</span></label>
            <textarea name="steps" rows="8" placeholder="Verificar que el sistema esté desenergizado&#10;Bloquear y etiquetar el breaker (LOTO)&#10;Verificar ausencia de voltaje con multímetro&#10;Realizar el trabajo&#10;Verificar conexiones antes de energizar&#10;Energizar y probar funcionamiento">{{ swp.steps if swp else '' }}</textarea>
        </div>
        <div class="form-group full">
            <label>Medidas de Emergencia</label>
            <textarea name="emergency" rows="3" placeholder="En caso de accidente eléctrico: cortar energía inmediatamente, llamar al 911, aplicar RCP si es necesario. No tocar a la víctima sin cortar la corriente primero.">{{ swp.emergency if swp else '' }}</textarea>
        </div>
        <div class="form-group full">
            <label>Referencias y Normativa <span style="color:var(--gray);font-size:11px">(una por línea)</span></label>
            <textarea name="ref_standards" rows="3" placeholder="OSHA 1910.147 — Control of Hazardous Energy&#10;NFPA 70E — Electrical Safety&#10;Código ISM — Sección 7">{{ swp.ref_standards if swp else '' }}</textarea>
        </div>
        <div class="form-group">
            <label>Fecha de Vigencia</label>
            <input type="date" name="effective_date">
        </div>
        {% if not swp %}
        <div class="form-group full" style="background:rgba(244,162,97,0.08);border:1px solid rgba(244,162,97,0.3);border-radius:8px;padding:12px">
            <div style="font-size:12px;color:var(--warning);margin-bottom:4px">📝 Se creará como <strong>Borrador (v1.0)</strong></div>
            <div style="font-size:12px;color:var(--gray)">Puedes editarlo libremente mientras sea borrador. Una vez aprobado por el admin, quedará activo y solo se podrá modificar creando una nueva versión.</div>
        </div>
        {% endif %}
    </div>
    <div class="flex gap-3 mt-6">
        <button type="submit" class="btn btn-primary">💾 Guardar Procedimiento</button>
        <a href="{{ url_for('ism_index') }}" class="btn btn-secondary">Cancelar</a>
    </div>
</form>
</div>
{% endblock %}