// ===== RIVAMAR Group — Páginas Legales (Sec. 9) =====
const { useState } = React;

function LegalLayout({ titulo, eyebrow, vigencia, children, go }) {
  return (
    <main>
      <section className="border-b border-white/10 bg-steel/30">
        <div className="max-w-4xl mx-auto px-5 lg:px-8 py-12">
          <button onClick={() => go('home')} className="text-sm text-gray-400 hover:text-gold mb-5 flex items-center gap-1.5">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><polyline points="15 18 9 12 15 6"/></svg>
            Volver al inicio
          </button>
          <p className="text-xs font-semibold uppercase tracking-[0.28em] text-copper mb-3">{eyebrow}</p>
          <h1 className="font-display text-3xl md:text-4xl font-bold text-gray-50 tracking-tight">{titulo}</h1>
          <p className="mt-3 text-sm text-gray-500 font-mono">{vigencia}</p>
        </div>
      </section>
      <section className="max-w-4xl mx-auto px-5 lg:px-8 py-12">
        <div className="prose-legal space-y-8">{children}</div>
        <div className="mt-12 p-4 rounded-lg bg-iron border border-white/10 text-xs text-gray-500 leading-relaxed">
          <strong className="text-gray-400">Nota de implementación:</strong> los campos entre corchetes
          (<span className="font-mono text-copper">[RAZÓN_SOCIAL]</span>, <span className="font-mono text-copper">[RUT]</span>,
          <span className="font-mono text-copper"> [CORREO_LEGAL]</span>) son placeholders editables desde el CMS Lite y se
          completarán con los datos legales que entregue el cliente (Checklist Sec. 12).
        </div>
      </section>
    </main>
  );
}

function LegalBlock({ n, title, children }) {
  return (
    <div>
      <h2 className="font-display text-xl font-bold text-gold mb-3 flex items-baseline gap-3">
        <span className="text-copper font-mono text-sm">{n}</span> {title}
      </h2>
      <div className="text-gray-300 text-[15px] leading-relaxed space-y-3">{children}</div>
    </div>
  );
}

function Privacidad({ go }) {
  return (
    <LegalLayout go={go} eyebrow="Legal" titulo="Política de Privacidad" vigencia="Conforme a la Ley N° 19.628 · Última actualización: Mayo 2026">
      <p className="text-gray-300 text-[15px] leading-relaxed">
        En <strong className="text-gray-100">RIVAMAR Group</strong> (<span className="font-mono text-copper">[RAZÓN_SOCIAL]</span>,
        RUT <span className="font-mono text-copper">[RUT]</span>) protegemos los datos personales de quienes utilizan nuestra
        plataforma de reservas, en cumplimiento de la Ley N° 19.628 sobre Protección de la Vida Privada.
      </p>
      <LegalBlock n="1." title="Responsable del tratamiento">
        <p>RIVAMAR Group / MAEDY GROUP, con domicilio en Antofagasta, Chile, es responsable del tratamiento de los datos
        recopilados a través de este sitio. Para consultas sobre privacidad: <span className="font-mono text-copper">[CORREO_LEGAL]</span>.</p>
      </LegalBlock>
      <LegalBlock n="2." title="Datos que recopilamos">
        <p>Recopilamos los siguientes datos cuando realizas una reserva o solicitas un convenio:</p>
        <ul className="list-disc pl-5 space-y-1 text-gray-400">
          <li>Nombre completo y, opcionalmente, empresa y RUT de la empresa.</li>
          <li>Correo electrónico y teléfono de contacto.</li>
          <li>Datos de la reserva: local, fecha, hora y número de personas.</li>
          <li>Número de credencial EXPONOR, cuando aplica al beneficio de descuento.</li>
        </ul>
      </LegalBlock>
      <LegalBlock n="3." title="Finalidad del tratamiento">
        <p>Tus datos se utilizan exclusivamente para: la gestión y confirmación de reservas, comunicaciones comerciales
        relacionadas con nuestros servicios, y reportería interna de operación. No comercializamos tus datos con terceros.</p>
      </LegalBlock>
      <LegalBlock n="4." title="Derechos ARCO">
        <p>Puedes ejercer en cualquier momento tus derechos de <strong className="text-gray-100">Acceso, Rectificación,
        Cancelación y Oposición</strong> sobre tus datos personales, escribiendo a <span className="font-mono text-copper">[CORREO_LEGAL]</span>.
        Responderemos tu solicitud en los plazos que establece la ley.</p>
      </LegalBlock>
      <LegalBlock n="5." title="Conservación y seguridad">
        <p>Aplicamos medidas técnicas y organizativas razonables para proteger tus datos. Conservamos la información solo
        durante el tiempo necesario para las finalidades descritas o según lo exija la normativa vigente.</p>
      </LegalBlock>
      <LegalBlock n="6." title="Ley aplicable">
        <p>Esta política se rige por la Ley N° 19.628 de la República de Chile. Cualquier controversia se someterá a los
        Tribunales de Justicia de Antofagasta.</p>
      </LegalBlock>
    </LegalLayout>
  );
}

function Terminos({ go }) {
  return (
    <LegalLayout go={go} eyebrow="Legal" titulo="Términos y Condiciones" vigencia="Servicio de reservas online · Última actualización: Mayo 2026">
      <p className="text-gray-300 text-[15px] leading-relaxed">
        Estos términos regulan el uso del servicio de reservas online de <strong className="text-gray-100">RIVAMAR Group</strong>
        en sus locales Aromas Costanera, Aromas del Inca y Rivamar (Gran Chimú).
      </p>
      <LegalBlock n="1." title="Descripción del servicio">
        <p>La plataforma permite solicitar reservas de mesa online <strong className="text-gray-100">sin que ello implique un
        pago previo</strong>. La reserva constituye una solicitud que es validada por el local correspondiente.</p>
      </LegalBlock>
      <LegalBlock n="2." title="Confirmación de la reserva">
        <p>Toda reserva ingresa en estado <span className="text-exponor font-medium">Pendiente</span> y será confirmada en un
        plazo máximo de <strong className="text-gray-100">24 horas</strong> desde el ingreso del formulario, mediante correo
        electrónico o llamada telefónica.</p>
      </LegalBlock>
      <LegalBlock n="3." title="Cancelación">
        <p>Para que una cancelación sea considerada válida, debe realizarse con un mínimo de <strong className="text-gray-100">4 horas
        de anticipación</strong> respecto del horario reservado.</p>
      </LegalBlock>
      <LegalBlock n="4." title="Descuento EXPONOR 2026">
        <p>El beneficio del 15% requiere la <strong className="text-gray-100">presentación de la credencial oficial</strong>
        (física o digital) de EXPONOR 2026 al momento de solicitar la cuenta. No es acumulable con otras promociones.</p>
      </LegalBlock>
      <LegalBlock n="5." title="Limitación de responsabilidad">
        <p>RIVAMAR Group no será responsable por incumplimientos derivados de fuerza mayor o caso fortuito. La disponibilidad
        de mesas está sujeta a la capacidad de cada local y a la validación de la reserva.</p>
      </LegalBlock>
      <LegalBlock n="6." title="Jurisdicción">
        <p>Estos términos se rigen por las leyes de la República de Chile y se someten a la competencia de los Tribunales de
        Justicia de Antofagasta.</p>
      </LegalBlock>
    </LegalLayout>
  );
}

Object.assign(window, { Privacidad, Terminos });