import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
import { useState, useEffect } from 'react';
import { c as EXPOSICION_ETIQUETAS, O as OTRO_RIESGO_ETIQUETAS, d as EPP_ETIQUETAS, A as AISLAMIENTO_ETIQUETAS, o as obtenerUsuario, a as api, f as crearAprobacionVacia, g as crearAislamientoVacio } from './AppLayout_QSZet0sz.mjs';
import { S as SeccionObservaciones } from './SeccionObservaciones_DWiyrRF8.mjs';

const niveles = [
  {
    id: "alto",
    abrev: "AR",
    etiqueta: "Alto Riesgo",
    activo: "bg-red-600 border-red-600 text-white shadow-md",
    inactivo: "border-red-300 text-red-700 bg-white",
    hover: "hover:bg-red-50"
  },
  {
    id: "mediano",
    abrev: "MR",
    etiqueta: "Mediano Riesgo",
    activo: "bg-amber-500 border-amber-500 text-white shadow-md",
    inactivo: "border-amber-300 text-amber-700 bg-white",
    hover: "hover:bg-amber-50"
  },
  {
    id: "bajo",
    abrev: "BR",
    etiqueta: "Bajo Riesgo",
    activo: "bg-green-600 border-green-600 text-white shadow-md",
    inactivo: "border-green-300 text-green-700 bg-white",
    hover: "hover:bg-green-50"
  }
];
function SelectorRiesgo({ value, onChange, requerido }) {
  const sinClasificar = value === null;
  return /* @__PURE__ */ jsxs("div", { children: [
    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
      /* @__PURE__ */ jsxs("label", { className: "block text-sm font-medium text-gray-700", children: [
        "Clasificación del Trabajo a Realizar",
        requerido && /* @__PURE__ */ jsx("span", { className: "text-red-500 ml-1", children: "*" })
      ] }),
      !sinClasificar && /* @__PURE__ */ jsx(
        "button",
        {
          type: "button",
          onClick: () => onChange(null),
          className: "text-xs text-gray-400 hover:text-gray-600 transition-colors",
          children: "Limpiar selección"
        }
      )
    ] }),
    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-3", children: niveles.map((nivel) => {
      const seleccionado = value === nivel.id;
      return /* @__PURE__ */ jsxs(
        "button",
        {
          type: "button",
          onClick: () => onChange(seleccionado ? null : nivel.id),
          className: `
                flex flex-col items-center justify-center
                border-2 rounded-lg py-4 px-2
                transition-all duration-150 cursor-pointer select-none
                ${seleccionado ? nivel.activo : `${nivel.inactivo} ${nivel.hover}`}
              `,
          children: [
            /* @__PURE__ */ jsx("span", { className: "text-2xl font-bold leading-none", children: nivel.abrev }),
            /* @__PURE__ */ jsx("span", { className: "text-xs font-medium mt-1 text-center leading-tight", children: nivel.etiqueta })
          ]
        },
        nivel.id
      );
    }) }),
    requerido && sinClasificar && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs text-amber-600", children: "Selecciona el nivel de riesgo para clasificar esta actividad." })
  ] });
}

const TIPOS_ORDENADOS$2 = Object.keys(EXPOSICION_ETIQUETAS);
function SelectorExposicionRiesgo({ value, onChange }) {
  function estaSeleccionado(tipo) {
    return value.some((e) => e.tipo === tipo);
  }
  function obtenerHerramientas(tipo) {
    return value.find((e) => e.tipo === tipo)?.herramientas ?? "";
  }
  function toggleTipo(tipo) {
    if (estaSeleccionado(tipo)) {
      onChange(value.filter((e) => e.tipo !== tipo));
    } else {
      onChange([...value, { tipo, herramientas: "" }]);
    }
  }
  function cambiarHerramientas(tipo, herramientas) {
    onChange(value.map((e) => e.tipo === tipo ? { ...e, herramientas } : e));
  }
  return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full border border-gray-200 text-sm", children: [
    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-600", children: [
      /* @__PURE__ */ jsxs("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/2", children: [
        "Si su actividad es de Alto Riesgo",
        /* @__PURE__ */ jsx("span", { className: "block font-normal normal-case text-gray-400 mt-0.5", children: "(Marcar las que correspondan)" })
      ] }),
      /* @__PURE__ */ jsxs("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/2", children: [
        "Herramientas, equipos o maquinarias a utilizar",
        /* @__PURE__ */ jsx("span", { className: "block font-normal normal-case text-gray-400 mt-0.5", children: "(Enumerar)" })
      ] })
    ] }) }),
    /* @__PURE__ */ jsx("tbody", { children: TIPOS_ORDENADOS$2.map((tipo, i) => {
      const seleccionado = estaSeleccionado(tipo);
      return /* @__PURE__ */ jsxs(
        "tr",
        {
          className: seleccionado ? "bg-blue-50" : i % 2 === 0 ? "bg-white" : "bg-gray-50",
          children: [
            /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-3 py-2", children: /* @__PURE__ */ jsxs("label", { className: "flex items-start gap-2 cursor-pointer select-none", children: [
              /* @__PURE__ */ jsx(
                "input",
                {
                  type: "checkbox",
                  checked: seleccionado,
                  onChange: () => toggleTipo(tipo),
                  className: "mt-0.5 h-4 w-4 rounded border-gray-300 text-[#1B2B4B] cursor-pointer flex-shrink-0"
                }
              ),
              /* @__PURE__ */ jsxs("span", { className: seleccionado ? "font-medium text-[#1B2B4B]" : "text-gray-700", children: [
                i + 1,
                ". ",
                EXPOSICION_ETIQUETAS[tipo]
              ] })
            ] }) }),
            /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-3 py-1.5", children: seleccionado ? /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 500,
                placeholder: "Enumere herramientas, equipos o maquinarias…",
                value: obtenerHerramientas(tipo),
                onChange: (e) => cambiarHerramientas(tipo, e.target.value),
                className: "w-full px-2 py-1.5 text-sm border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-[#1B2B4B]/30 focus:border-[#1B2B4B]"
              }
            ) : /* @__PURE__ */ jsx("span", { className: "text-gray-300 text-xs", children: "—" }) })
          ]
        },
        tipo
      );
    }) })
  ] }) });
}

const TIPOS_ORDENADOS$1 = Object.keys(OTRO_RIESGO_ETIQUETAS);
const COLUMNAS$1 = [
  TIPOS_ORDENADOS$1.slice(0, 10),
  TIPOS_ORDENADOS$1.slice(10, 20),
  TIPOS_ORDENADOS$1.slice(20, 30)
];
function SelectorOtrosRiesgos({ value, otroDetalle, onChange, onOtroDetalle }) {
  function estaSeleccionado(tipo) {
    return value.includes(tipo);
  }
  function toggleTipo(tipo) {
    if (estaSeleccionado(tipo)) {
      onChange(value.filter((t) => t !== tipo));
      if (tipo === "otro") onOtroDetalle("");
    } else {
      onChange([...value, tipo]);
    }
  }
  return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full border border-gray-200 text-sm", children: [
    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-600", children: [
      /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/3", children: "Riesgo" }),
      /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/3", children: "Riesgo" }),
      /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/3", children: "Riesgo" })
    ] }) }),
    /* @__PURE__ */ jsx("tbody", { children: Array.from({ length: 10 }).map((_, fila) => /* @__PURE__ */ jsx("tr", { className: fila % 2 === 0 ? "bg-white" : "bg-gray-50", children: COLUMNAS$1.map((col, colIdx) => {
      const tipo = col[fila];
      if (!tipo) return /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-3 py-2" }, colIdx);
      const seleccionado = estaSeleccionado(tipo);
      return /* @__PURE__ */ jsxs("td", { className: "border border-gray-200 px-3 py-1.5", children: [
        /* @__PURE__ */ jsxs("label", { className: "flex items-start gap-2 cursor-pointer select-none", children: [
          /* @__PURE__ */ jsx(
            "input",
            {
              type: "checkbox",
              checked: seleccionado,
              onChange: () => toggleTipo(tipo),
              className: "mt-0.5 h-4 w-4 rounded border-gray-300 text-[#1B2B4B] cursor-pointer flex-shrink-0"
            }
          ),
          /* @__PURE__ */ jsx("span", { className: `text-sm ${seleccionado ? "font-medium text-gray-900" : "text-gray-700"}`, children: OTRO_RIESGO_ETIQUETAS[tipo] })
        ] }),
        tipo === "otro" && seleccionado && /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            maxLength: 300,
            placeholder: "Especifique el riesgo…",
            value: otroDetalle,
            onChange: (e) => onOtroDetalle(e.target.value),
            className: "mt-1.5 w-full px-2 py-1.5 text-sm border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-[#1B2B4B]/30 focus:border-[#1B2B4B]"
          }
        )
      ] }, colIdx);
    }) }, fila)) })
  ] }) });
}

const TIPOS_ORDENADOS = Object.keys(EPP_ETIQUETAS);
const COLUMNAS = [
  TIPOS_ORDENADOS.slice(0, 4),
  TIPOS_ORDENADOS.slice(4, 8),
  TIPOS_ORDENADOS.slice(8, 12),
  TIPOS_ORDENADOS.slice(12, 16)
];
function SelectorEpp({ value, eppOtro, onChange, onEppOtro, mecanismos, onMecanismos }) {
  function estaSeleccionado(tipo) {
    return value.includes(tipo);
  }
  function toggleTipo(tipo) {
    if (estaSeleccionado(tipo)) {
      onChange(value.filter((t) => t !== tipo));
      if (tipo === "otros") onEppOtro("");
    } else {
      onChange([...value, tipo]);
    }
  }
  function cambiarMecanismo(indice, texto) {
    const nuevo = [...mecanismos];
    nuevo[indice] = texto;
    onMecanismos(nuevo);
  }
  function agregarMecanismo() {
    onMecanismos([...mecanismos, ""]);
  }
  function quitarMecanismo(indice) {
    onMecanismos(mecanismos.filter((_, i) => i !== indice));
  }
  return /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full border border-gray-200 text-sm", children: [
      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-600", children: [
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/4", children: "EPP" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/4", children: "EPP" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/4", children: "EPP" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold uppercase tracking-wide w-1/4", children: "EPP" })
      ] }) }),
      /* @__PURE__ */ jsx("tbody", { children: Array.from({ length: 4 }).map((_, fila) => /* @__PURE__ */ jsx("tr", { className: fila % 2 === 0 ? "bg-white" : "bg-gray-50", children: COLUMNAS.map((col, colIdx) => {
        const tipo = col[fila];
        if (!tipo) return /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-3 py-2 w-1/4" }, colIdx);
        const seleccionado = estaSeleccionado(tipo);
        return /* @__PURE__ */ jsxs("td", { className: "border border-gray-200 px-3 py-1.5 w-1/4", children: [
          /* @__PURE__ */ jsxs("label", { className: "flex items-start gap-2 cursor-pointer select-none", children: [
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "checkbox",
                checked: seleccionado,
                onChange: () => toggleTipo(tipo),
                className: "mt-0.5 h-4 w-4 rounded border-gray-300 text-[#1B2B4B] cursor-pointer flex-shrink-0"
              }
            ),
            /* @__PURE__ */ jsx("span", { className: `text-sm ${seleccionado ? "font-medium text-gray-900" : "text-gray-700"}`, children: EPP_ETIQUETAS[tipo] })
          ] }),
          tipo === "otros" && seleccionado && /* @__PURE__ */ jsx(
            "input",
            {
              type: "text",
              maxLength: 300,
              placeholder: "Especifique…",
              value: eppOtro,
              onChange: (e) => onEppOtro(e.target.value),
              className: "mt-1.5 w-full px-2 py-1.5 text-sm border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-[#1B2B4B]/30 focus:border-[#1B2B4B]"
            }
          )
        ] }, colIdx);
      }) }, fila)) })
    ] }) }) }),
    /* @__PURE__ */ jsxs("div", { children: [
      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
        /* @__PURE__ */ jsxs("p", { className: "text-xs font-bold uppercase text-gray-700", children: [
          "Mecanismo de Control Adicional",
          /* @__PURE__ */ jsx("span", { className: "ml-1 font-normal normal-case text-gray-500", children: "(otros mecanismos de control de riesgos no considerados)" })
        ] }),
        /* @__PURE__ */ jsx(
          "button",
          {
            type: "button",
            onClick: agregarMecanismo,
            className: "text-sm text-blue-600 hover:text-blue-800 font-medium",
            children: "+ Agregar mecanismo"
          }
        )
      ] }),
      /* @__PURE__ */ jsx("div", { className: "space-y-2", children: mecanismos.map((val, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ jsxs("span", { className: "flex-shrink-0 w-7 text-sm font-medium text-gray-400 text-right", children: [
          i + 1,
          ".-"
        ] }),
        /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            maxLength: 300,
            placeholder: `Mecanismo ${i + 1}`,
            value: val,
            onChange: (e) => cambiarMecanismo(i, e.target.value),
            className: "input flex-1"
          }
        ),
        mecanismos.length > 1 && /* @__PURE__ */ jsx(
          "button",
          {
            type: "button",
            onClick: () => quitarMecanismo(i),
            className: "flex-shrink-0 text-gray-400 hover:text-red-500 p-1",
            title: "Quitar mecanismo",
            "aria-label": "Quitar mecanismo",
            children: /* @__PURE__ */ jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
          }
        )
      ] }, i)) })
    ] })
  ] });
}

const TIPOS = ["electrico", "mecanico", "ducto", "otro"];
function SelectorAislamiento({ value, onChange }) {
  function getItem(tipo) {
    return value.find((a) => a.tipo === tipo) ?? {
      tipo,
      seleccionado: false,
      otro_detalle: null,
      aislamiento_fecha: null,
      aislamiento_hora: null,
      aislamiento_nombre: null,
      aislamiento_firma: null,
      fin_fecha: null,
      fin_hora: null,
      fin_nombre: null,
      fin_firma: null
    };
  }
  function actualizarItem(tipo, cambios) {
    const nuevo = value.map((a) => a.tipo === tipo ? { ...a, ...cambios } : a);
    if (!nuevo.some((a) => a.tipo === tipo)) {
      nuevo.push({ ...getItem(tipo), ...cambios });
    }
    onChange(nuevo);
  }
  function toggleSeleccionado(tipo) {
    const item = getItem(tipo);
    actualizarItem(tipo, { seleccionado: !item.seleccionado });
  }
  function campo(tipo, campo2, valor) {
    actualizarItem(tipo, { [campo2]: valor || null });
  }
  const inputCls = "w-full px-1.5 py-1 text-xs border border-gray-300 rounded focus:outline-none focus:ring-1 focus:ring-[#1B2B4B]/40 focus:border-[#1B2B4B]";
  return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full border border-gray-200 text-xs", children: [
    /* @__PURE__ */ jsxs("thead", { children: [
      /* @__PURE__ */ jsx("tr", { className: "bg-gray-50", children: /* @__PURE__ */ jsx(
        "th",
        {
          colSpan: 9,
          className: "border border-gray-200 px-3 py-2 text-center text-xs font-bold uppercase text-gray-700",
          children: "Aislamiento / Bloqueo de equipos"
        }
      ) }),
      /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-600", children: [
        /* @__PURE__ */ jsxs("th", { className: "border border-gray-200 px-2 py-1.5 text-left text-xs font-semibold w-36", children: [
          "Equipos que se deben aislar",
          /* @__PURE__ */ jsx("span", { className: "block font-normal normal-case text-gray-400", children: '(Marcar con "X")' })
        ] }),
        /* @__PURE__ */ jsx("th", { colSpan: 4, className: "border border-gray-200 px-2 py-1.5 text-center text-xs font-semibold uppercase tracking-wide", children: "Aislamiento dispuesto por" }),
        /* @__PURE__ */ jsx("th", { colSpan: 4, className: "border border-gray-200 px-2 py-1.5 text-center text-xs font-semibold uppercase tracking-wide", children: "Fin de aislamiento dispuesto por" })
      ] }),
      /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-500", children: [
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Fecha" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Hora" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Nombre" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Firma" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Fecha" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Hora" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Nombre" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1 font-semibold", children: "Firma" })
      ] })
    ] }),
    /* @__PURE__ */ jsx("tbody", { children: TIPOS.map((tipo, i) => {
      const item = getItem(tipo);
      const activo = item.seleccionado;
      return /* @__PURE__ */ jsxs("tr", { className: i % 2 === 0 ? "bg-white" : "bg-gray-50", children: [
        /* @__PURE__ */ jsxs("td", { className: "border border-gray-200 px-2 py-1.5 align-top", children: [
          /* @__PURE__ */ jsxs("label", { className: "flex items-start gap-2 cursor-pointer select-none", children: [
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "checkbox",
                checked: activo,
                onChange: () => toggleSeleccionado(tipo),
                className: "mt-0.5 h-4 w-4 rounded border-gray-300 text-[#1B2B4B] cursor-pointer flex-shrink-0"
              }
            ),
            /* @__PURE__ */ jsx("span", { className: `text-xs ${activo ? "font-semibold text-gray-900" : "text-gray-700"}`, children: tipo === "otro" ? "Otros (especificar):" : AISLAMIENTO_ETIQUETAS[tipo] })
          ] }),
          tipo === "otro" && activo && /* @__PURE__ */ jsx(
            "input",
            {
              type: "text",
              maxLength: 300,
              placeholder: "Especifique…",
              value: item.otro_detalle ?? "",
              onChange: (e) => campo(tipo, "otro_detalle", e.target.value),
              className: `mt-1 ${inputCls}`
            }
          )
        ] }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "date",
            disabled: !activo,
            value: item.aislamiento_fecha ?? "",
            onChange: (e) => campo(tipo, "aislamiento_fecha", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "time",
            disabled: !activo,
            value: item.aislamiento_hora ?? "",
            onChange: (e) => campo(tipo, "aislamiento_hora", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            disabled: !activo,
            maxLength: 150,
            placeholder: "Nombre",
            value: item.aislamiento_nombre ?? "",
            onChange: (e) => campo(tipo, "aislamiento_nombre", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            disabled: !activo,
            maxLength: 150,
            placeholder: "Firma",
            value: item.aislamiento_firma ?? "",
            onChange: (e) => campo(tipo, "aislamiento_firma", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "date",
            disabled: !activo,
            value: item.fin_fecha ?? "",
            onChange: (e) => campo(tipo, "fin_fecha", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "time",
            disabled: !activo,
            value: item.fin_hora ?? "",
            onChange: (e) => campo(tipo, "fin_hora", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            disabled: !activo,
            maxLength: 150,
            placeholder: "Nombre",
            value: item.fin_nombre ?? "",
            onChange: (e) => campo(tipo, "fin_nombre", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1.5 py-1.5 align-top", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            disabled: !activo,
            maxLength: 150,
            placeholder: "Firma",
            value: item.fin_firma ?? "",
            onChange: (e) => campo(tipo, "fin_firma", e.target.value),
            className: `${inputCls} ${!activo ? "opacity-40 bg-gray-50" : ""}`
          }
        ) })
      ] }, tipo);
    }) })
  ] }) });
}

const inputCls = "w-full px-2 py-1 text-xs border border-gray-300 rounded focus:outline-none focus:ring-1 focus:ring-[#1B2B4B]/40 focus:border-[#1B2B4B]";
function FilaAprobacion({
  titulo,
  labelNombre,
  labelFirma,
  value,
  onChange
}) {
  function toggleSi() {
    onChange({ ...value, aprobado: value.aprobado === true ? null : true });
  }
  function toggleNo() {
    onChange({ ...value, aprobado: value.aprobado === false ? null : false });
  }
  return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full border border-gray-200 text-xs", children: [
    /* @__PURE__ */ jsxs("thead", { children: [
      /* @__PURE__ */ jsx("tr", { className: "bg-[#1B2B4B]/5", children: /* @__PURE__ */ jsx(
        "th",
        {
          colSpan: 6,
          className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold text-[#1B2B4B]",
          children: titulo
        }
      ) }),
      /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-600", children: [
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 text-center font-semibold w-10", children: "Sí" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 text-center font-semibold w-10", children: "No" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 text-left font-semibold", children: labelNombre }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 text-left font-semibold", children: labelFirma }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 text-left font-semibold w-32", children: "Fecha" }),
        /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 text-left font-semibold w-24", children: "Hora" })
      ] })
    ] }),
    /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsxs("tr", { className: "bg-white", children: [
      /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-2 text-center align-middle", children: /* @__PURE__ */ jsx(
        "input",
        {
          type: "checkbox",
          checked: value.aprobado === true,
          onChange: toggleSi,
          className: "h-4 w-4 rounded border-gray-300 text-green-600 cursor-pointer"
        }
      ) }),
      /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-2 text-center align-middle", children: /* @__PURE__ */ jsx(
        "input",
        {
          type: "checkbox",
          checked: value.aprobado === false,
          onChange: toggleNo,
          className: "h-4 w-4 rounded border-gray-300 text-red-500 cursor-pointer"
        }
      ) }),
      /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-1.5 align-middle", children: /* @__PURE__ */ jsx(
        "input",
        {
          type: "text",
          maxLength: 200,
          placeholder: "Nombre completo",
          value: value.nombre,
          onChange: (e) => onChange({ ...value, nombre: e.target.value }),
          className: inputCls
        }
      ) }),
      /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-1.5 align-middle", children: /* @__PURE__ */ jsx(
        "input",
        {
          type: "text",
          maxLength: 200,
          placeholder: "Firma",
          value: value.firma ?? "",
          onChange: (e) => onChange({ ...value, firma: e.target.value || null }),
          className: inputCls
        }
      ) }),
      /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-1.5 align-middle", children: /* @__PURE__ */ jsx(
        "input",
        {
          type: "date",
          value: value.fecha ?? "",
          onChange: (e) => onChange({ ...value, fecha: e.target.value || null }),
          className: inputCls
        }
      ) }),
      /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-1.5 align-middle", children: /* @__PURE__ */ jsx(
        "input",
        {
          type: "time",
          value: value.hora ?? "",
          onChange: (e) => onChange({ ...value, hora: e.target.value || null }),
          className: inputCls
        }
      ) })
    ] }) })
  ] }) });
}
function SelectorAprobacion({
  trabajadores,
  onTrabajadores,
  aprobacionApr,
  onAprobacionApr,
  aprobacionSupervisor,
  onAprobacionSupervisor
}) {
  function cambiarTrabajador(i, campo, valor) {
    onTrabajadores(
      trabajadores.map((t, idx) => idx === i ? { ...t, [campo]: valor || null } : t)
    );
  }
  function agregarTrabajador() {
    onTrabajadores([...trabajadores, { nombre: "", firma: null }]);
  }
  function quitarTrabajador(i) {
    onTrabajadores(trabajadores.filter((_, idx) => idx !== i));
  }
  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
    /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full border border-gray-200 text-xs", children: [
      /* @__PURE__ */ jsxs("thead", { children: [
        /* @__PURE__ */ jsx("tr", { className: "bg-[#1B2B4B]/5", children: /* @__PURE__ */ jsx(
          "th",
          {
            colSpan: 3,
            className: "border border-gray-200 px-3 py-2 text-left text-xs font-semibold text-[#1B2B4B]",
            children: "El personal más abajo identificado declara que comprende la naturaleza del trabajo a realizar y se compromete a adoptar las precauciones señaladas en este documento:"
          }
        ) }),
        /* @__PURE__ */ jsxs("tr", { className: "bg-gray-50 text-gray-600", children: [
          /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-1.5 text-left font-semibold w-1/2", children: "Nombre" }),
          /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-3 py-1.5 text-left font-semibold w-1/2", children: "Firma" }),
          /* @__PURE__ */ jsx("th", { className: "border border-gray-200 px-2 py-1.5 w-8" })
        ] })
      ] }),
      /* @__PURE__ */ jsx("tbody", { children: trabajadores.map((t, i) => /* @__PURE__ */ jsxs("tr", { className: i % 2 === 0 ? "bg-white" : "bg-gray-50", children: [
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-1.5 align-middle", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            maxLength: 150,
            placeholder: "Nombre completo",
            value: t.nombre,
            onChange: (e) => cambiarTrabajador(i, "nombre", e.target.value),
            className: inputCls
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-2 py-1.5 align-middle", children: /* @__PURE__ */ jsx(
          "input",
          {
            type: "text",
            maxLength: 150,
            placeholder: "Firma",
            value: t.firma ?? "",
            onChange: (e) => cambiarTrabajador(i, "firma", e.target.value),
            className: inputCls
          }
        ) }),
        /* @__PURE__ */ jsx("td", { className: "border border-gray-200 px-1 py-1.5 text-center align-middle", children: trabajadores.length > 1 && /* @__PURE__ */ jsx(
          "button",
          {
            type: "button",
            onClick: () => quitarTrabajador(i),
            className: "text-gray-400 hover:text-red-500 p-0.5",
            title: "Quitar fila",
            children: /* @__PURE__ */ jsx("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
          }
        ) })
      ] }, i)) })
    ] }) }),
    /* @__PURE__ */ jsx(
      "button",
      {
        type: "button",
        onClick: agregarTrabajador,
        className: "text-sm text-blue-600 hover:text-blue-800 font-medium",
        children: "+ Agregar trabajador"
      }
    ),
    /* @__PURE__ */ jsx(
      FilaAprobacion,
      {
        titulo: "Aprobación del Análisis de Seguro del Trabajo en terreno (Revisor-Validador APR):",
        labelNombre: "Nombre APR",
        labelFirma: "Firma APR",
        value: aprobacionApr,
        onChange: onAprobacionApr
      }
    ),
    /* @__PURE__ */ jsx(
      FilaAprobacion,
      {
        titulo: "Aprobación del Análisis de Seguro del Trabajo en terreno (Jefe área o Supervisor presente):",
        labelNombre: "Jefe área o Supervisor",
        labelFirma: "Firma Supervisor",
        value: aprobacionSupervisor,
        onChange: onAprobacionSupervisor
      }
    )
  ] });
}

function FormularioActividad({ id }) {
  const modoEdicion = id !== void 0;
  const [usuario, setUsuario] = useState(null);
  const [cargandoDatos, setCargandoDatos] = useState(modoEdicion);
  useEffect(() => {
    setUsuario(obtenerUsuario());
  }, []);
  useEffect(() => {
    if (!modoEdicion) return;
    api.get(`/actividades/${id}`).then((act) => {
      setForm({
        area: act.area,
        nombre: act.nombre,
        tipo_trabajo: act.tipo_trabajo,
        lugar_especifico: act.lugar_especifico,
        responsable_directo: act.responsable_directo,
        supervisor: act.supervisor,
        prevencionista: act.prevencionista,
        descripcion_trabajo: act.descripcion_trabajo ?? "",
        fecha_inicio: act.fecha_inicio,
        fecha_termino: act.fecha_termino,
        hora_inicio: act.hora_inicio.slice(0, 5)
      });
      setPasos(act.pasos.length > 0 ? act.pasos : [""]);
      setExposicion(act.exposicion_alto_riesgo);
      setOtrosRiesgos(act.otros_riesgos ?? []);
      setOtroRiesgoDetalle(act.otro_riesgo_especificado ?? "");
      setEpp(act.epp ?? []);
      setEppOtro(act.epp_otro ?? "");
      const mecsGuardados = act.mecanismos_adicionales ?? [];
      setMecanismos(mecsGuardados.length > 0 ? mecsGuardados : [""]);
      if ((act.aislamientos ?? []).length > 0) {
        const base = crearAislamientoVacio();
        setAislamientos(base.map((b) => act.aislamientos.find((a) => a.tipo === b.tipo) ?? b));
      }
      const trabs = act.toma_conocimiento ?? [];
      setTrabajadores(trabs.length > 0 ? trabs : [{ nombre: "", firma: null }]);
      setAprobacionApr(act.aprobacion_apr ?? crearAprobacionVacia(act.prevencionista));
      setAprobacionSupervisor(act.aprobacion_supervisor ?? crearAprobacionVacia(act.supervisor));
      setNivelRiesgo(act.nivel_riesgo);
      setNumero(act.numero);
    }).catch((e) => setError(e instanceof Error ? e.message : "Error al cargar la actividad")).finally(() => setCargandoDatos(false));
  }, [id, modoEdicion]);
  const [form, setForm] = useState({
    area: "",
    nombre: "",
    tipo_trabajo: "",
    lugar_especifico: "",
    responsable_directo: "",
    supervisor: "",
    prevencionista: "",
    descripcion_trabajo: "",
    fecha_inicio: "",
    fecha_termino: "",
    hora_inicio: ""
  });
  const [pasos, setPasos] = useState([""]);
  const [exposicion, setExposicion] = useState([]);
  const [otrosRiesgos, setOtrosRiesgos] = useState([]);
  const [otroRiesgoDetalle, setOtroRiesgoDetalle] = useState("");
  const [epp, setEpp] = useState([]);
  const [eppOtro, setEppOtro] = useState("");
  const [mecanismos, setMecanismos] = useState([""]);
  const [aislamientos, setAislamientos] = useState(crearAislamientoVacio());
  const [trabajadores, setTrabajadores] = useState([{ nombre: "", firma: null }]);
  const [aprobacionApr, setAprobacionApr] = useState(crearAprobacionVacia());
  const [aprobacionSupervisor, setAprobacionSupervisor] = useState(crearAprobacionVacia());
  const [nivelRiesgo, setNivelRiesgo] = useState(null);
  const [numero, setNumero] = useState(null);
  const [cargando, setCargando] = useState(false);
  const [error, setError] = useState(null);
  function cambiarCampo(campo, valor) {
    setForm((prev) => ({ ...prev, [campo]: valor }));
  }
  function cambiarPaso(indice, valor) {
    setPasos((prev) => prev.map((p, i) => i === indice ? valor : p));
  }
  function agregarPaso() {
    setPasos((prev) => [...prev, ""]);
  }
  function quitarPaso(indice) {
    setPasos((prev) => prev.filter((_, i) => i !== indice));
  }
  async function enviar(e) {
    e.preventDefault();
    setError(null);
    if (form.fecha_termino && form.fecha_inicio && form.fecha_termino < form.fecha_inicio) {
      setError("La fecha de término no puede ser anterior a la fecha de inicio.");
      return;
    }
    setCargando(true);
    const str = (v) => v.trim() || null;
    const cuerpo = {
      area: str(form.area),
      nombre: str(form.nombre),
      tipo_trabajo: str(form.tipo_trabajo),
      tipo_trabajo_detalle: null,
      lugar_especifico: str(form.lugar_especifico),
      responsable_directo: str(form.responsable_directo),
      supervisor: str(form.supervisor),
      prevencionista: str(form.prevencionista),
      descripcion_trabajo: form.descripcion_trabajo.trim() || null,
      pasos: pasos.map((p) => p.trim()).filter((p) => p.length > 0),
      exposicion_alto_riesgo: exposicion,
      otros_riesgos: otrosRiesgos,
      otro_riesgo_especificado: otrosRiesgos.includes("otro") ? otroRiesgoDetalle.trim() || null : null,
      epp,
      epp_otro: epp.includes("otros") ? eppOtro.trim() || null : null,
      mecanismos_adicionales: mecanismos.map((m) => m.trim()).filter((m) => m.length > 0),
      aislamientos,
      toma_conocimiento: trabajadores.filter((t) => t.nombre.trim().length > 0),
      aprobacion_apr: aprobacionApr,
      aprobacion_supervisor: aprobacionSupervisor,
      nivel_riesgo: nivelRiesgo,
      fecha_inicio: form.fecha_inicio || null,
      fecha_termino: form.fecha_termino || null,
      hora_inicio: form.hora_inicio || null
    };
    try {
      if (modoEdicion) {
        await api.put(`/actividades/${id}`, cuerpo);
        window.location.href = `/actividades/${id}`;
      } else {
        await api.post("/actividades", cuerpo);
        window.location.href = "/actividades";
      }
    } catch (err) {
      const msg = err instanceof Error ? err.message : "Error al guardar la actividad.";
      setError(msg);
    } finally {
      setCargando(false);
    }
  }
  if (cargandoDatos) {
    return /* @__PURE__ */ jsx("div", { className: "py-16 text-center text-gray-400", children: "Cargando actividad…" });
  }
  return /* @__PURE__ */ jsxs(Fragment, { children: [
    /* @__PURE__ */ jsxs("form", { id: "form-actividad", onSubmit: enviar, className: "space-y-6 max-w-4xl", children: [
      /* @__PURE__ */ jsx("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6", children: /* @__PURE__ */ jsx(SelectorRiesgo, { value: nivelRiesgo, onChange: setNivelRiesgo }) }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-5", children: [
        /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Datos Principales" }),
        /* @__PURE__ */ jsxs("div", { className: modoEdicion && numero !== null ? "grid grid-cols-1 sm:grid-cols-[1fr_auto] gap-4 items-end" : "", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Empresa" }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                readOnly: true,
                value: usuario?.empresa_nombre ?? "",
                className: "input bg-gray-50 cursor-not-allowed"
              }
            )
          ] }),
          modoEdicion && numero !== null && /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-end", children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "ID Actividad" }),
            /* @__PURE__ */ jsxs("div", { className: "input bg-gray-50 cursor-not-allowed font-mono text-2xl font-bold text-gray-300 w-28 flex items-center", children: [
              "#",
              String(numero).padStart(3, "0")
            ] })
          ] })
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Área            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 150,
                placeholder: "Ej: Mantención / Operaciones",
                value: form.area,
                onChange: (e) => cambiarCampo("area", e.target.value),
                className: "input"
              }
            )
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Actividad            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 200,
                placeholder: "Ej: Trabajo de Soldadura",
                value: form.nombre,
                onChange: (e) => cambiarCampo("nombre", e.target.value),
                className: "input"
              }
            )
          ] })
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Tipo de Trabajo          " }),
          /* @__PURE__ */ jsx(
            "input",
            {
              type: "text",
              required: false,
              maxLength: 200,
              placeholder: "Ej: Trabajo en altura, Soldadura, Eléctrico…",
              value: form.tipo_trabajo,
              onChange: (e) => cambiarCampo("tipo_trabajo", e.target.value),
              className: "input"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Lugar Específico          " }),
          /* @__PURE__ */ jsx(
            "input",
            {
              type: "text",
              required: false,
              maxLength: 200,
              placeholder: "Ej: Taller Mantención – Área 3",
              value: form.lugar_especifico,
              onChange: (e) => cambiarCampo("lugar_especifico", e.target.value),
              className: "input"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-4", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Responsable Directo            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 150,
                placeholder: "Nombre completo",
                value: form.responsable_directo,
                onChange: (e) => cambiarCampo("responsable_directo", e.target.value),
                className: "input"
              }
            )
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Supervisor            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 150,
                placeholder: "Nombre completo",
                value: form.supervisor,
                onChange: (e) => cambiarCampo("supervisor", e.target.value),
                className: "input"
              }
            )
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "APR / Prevencionista            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 150,
                placeholder: "Nombre completo",
                value: form.prevencionista,
                onChange: (e) => cambiarCampo("prevencionista", e.target.value),
                className: "input"
              }
            )
          ] })
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-4", children: [
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Fecha Inicio            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "date",
                value: form.fecha_inicio,
                onChange: (e) => cambiarCampo("fecha_inicio", e.target.value),
                className: "input"
              }
            )
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Fecha Término            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "date",
                min: form.fecha_inicio || void 0,
                value: form.fecha_termino,
                onChange: (e) => cambiarCampo("fecha_termino", e.target.value),
                className: "input"
              }
            )
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Hora de Inicio            " }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "time",
                value: form.hora_inicio,
                onChange: (e) => cambiarCampo("hora_inicio", e.target.value),
                className: "input"
              }
            )
          ] })
        ] }),
        nivelRiesgo && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-gray-600", children: "Nivel de Riesgo:" }),
          /* @__PURE__ */ jsx("span", { className: `badge ${nivelRiesgo === "alto" ? "badge-danger" : nivelRiesgo === "mediano" ? "badge-warning" : "badge-success"} text-xs font-semibold uppercase`, children: nivelRiesgo === "alto" ? "Alto" : nivelRiesgo === "mediano" ? "Mediano" : "Bajo" })
        ] })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-5", children: [
        /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Descripción del Trabajo" }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700 mb-1", children: "Descripción del trabajo a realizar (detalle)" }),
          /* @__PURE__ */ jsx(
            "textarea",
            {
              rows: 4,
              maxLength: 5e3,
              placeholder: "Describa en detalle el trabajo a realizar…",
              value: form.descripcion_trabajo,
              onChange: (e) => cambiarCampo("descripcion_trabajo", e.target.value),
              className: "input resize-y"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
            /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-gray-700", children: "Actividades involucradas (paso a paso)" }),
            /* @__PURE__ */ jsx(
              "button",
              {
                type: "button",
                onClick: agregarPaso,
                className: "text-sm text-blue-600 hover:text-blue-800 font-medium",
                children: "+ Agregar paso"
              }
            )
          ] }),
          /* @__PURE__ */ jsx("div", { className: "space-y-2", children: pasos.map((paso, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
            /* @__PURE__ */ jsxs("span", { className: "flex-shrink-0 w-7 text-sm font-medium text-gray-400 text-right", children: [
              i + 1,
              ".-"
            ] }),
            /* @__PURE__ */ jsx(
              "input",
              {
                type: "text",
                maxLength: 300,
                placeholder: `Paso ${i + 1}`,
                value: paso,
                onChange: (e) => cambiarPaso(i, e.target.value),
                className: "input flex-1"
              }
            ),
            pasos.length > 1 && /* @__PURE__ */ jsx(
              "button",
              {
                type: "button",
                onClick: () => quitarPaso(i),
                className: "flex-shrink-0 text-gray-400 hover:text-red-500 p-1",
                title: "Quitar paso",
                "aria-label": "Quitar paso",
                children: /* @__PURE__ */ jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
              }
            )
          ] }, i)) })
        ] })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Identificación de Exposición a Alto Riesgo" }),
          /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-0.5", children: "Marque las actividades que apliquen y enumere las herramientas o equipos a utilizar." })
        ] }),
        /* @__PURE__ */ jsx(SelectorExposicionRiesgo, { value: exposicion, onChange: setExposicion })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Identificación de Otros Riesgos" }),
          /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-0.5", children: "Seleccione los riesgos que apliquen para esta actividad." })
        ] }),
        /* @__PURE__ */ jsx(
          SelectorOtrosRiesgos,
          {
            value: otrosRiesgos,
            otroDetalle: otroRiesgoDetalle,
            onChange: setOtrosRiesgos,
            onOtroDetalle: setOtroRiesgoDetalle
          }
        )
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Mecanismos de Control de Riesgos" }),
          /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-0.5", children: "Detalle los medios que utilizará para controlar los riesgos en la ejecución del trabajo." })
        ] }),
        /* @__PURE__ */ jsx(
          SelectorEpp,
          {
            value: epp,
            eppOtro,
            onChange: setEpp,
            onEppOtro: setEppOtro,
            mecanismos,
            onMecanismos: setMecanismos
          }
        )
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Aislamiento y Bloqueo de Equipos" }),
          /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-0.5", children: "Registre los aislamientos de equipos requeridos antes de iniciar la actividad." })
        ] }),
        /* @__PURE__ */ jsx(SelectorAislamiento, { value: aislamientos, onChange: setAislamientos })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Toma de Conocimiento y Aprobación" }),
          /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-0.5", children: "Registro de trabajadores y aprobaciones del APR y Supervisor." })
        ] }),
        /* @__PURE__ */ jsx(
          SelectorAprobacion,
          {
            trabajadores,
            onTrabajadores: setTrabajadores,
            aprobacionApr,
            onAprobacionApr: setAprobacionApr,
            aprobacionSupervisor,
            onAprobacionSupervisor: setAprobacionSupervisor
          }
        )
      ] })
    ] }),
    modoEdicion && /* @__PURE__ */ jsx("div", { className: "space-y-4 max-w-4xl", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl border border-gray-200 shadow-sm p-6 space-y-4", children: [
      /* @__PURE__ */ jsxs("div", { children: [
        /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold text-gray-800", children: "Observaciones" }),
        /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 mt-0.5", children: "Fotografías, documentos adjuntos y otras evidencias de la ejecución del trabajo." })
      ] }),
      /* @__PURE__ */ jsx(SeccionObservaciones, { actividadId: id })
    ] }) }),
    error && /* @__PURE__ */ jsx("div", { className: "max-w-4xl rounded-lg bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-700", children: error }),
    /* @__PURE__ */ jsxs("div", { className: "max-w-4xl flex items-center gap-3", children: [
      /* @__PURE__ */ jsx(
        "button",
        {
          type: "submit",
          form: "form-actividad",
          disabled: cargando,
          className: "btn-primary disabled:opacity-50 disabled:cursor-not-allowed",
          children: cargando ? "Guardando…" : modoEdicion ? "Guardar Cambios" : "Guardar Actividad"
        }
      ),
      /* @__PURE__ */ jsx("a", { href: modoEdicion ? `/actividades/${id}` : "/actividades", className: "btn-secondary", children: "Cancelar" })
    ] })
  ] });
}

export { FormularioActividad as F };
