// Siuntų integracijos — Solution page (DPD, LP Express, Omniva, Venipak)

function ShippingPage() {
  const url = window.__erp_url;

  const couriers = [
    { code: 'DPD',  name: 'DPD',        logo: 'assets/courier-dpd.svg',       desc: 'Tarptautinis kurjeris. Etiketės, sekimo kodai, paėmimo užsakymai tiesiai iš Odoo.' },
    { code: 'LPE',  name: 'LP Express', logo: 'assets/courier-lpexpress.svg', desc: 'Lietuvos pašto kurjerių tarnyba. Paštomatai ir pristatymas į duris vienoje vietoje.' },
    { code: 'OMN',  name: 'Omniva',     logo: 'assets/courier-omniva.svg',    desc: 'Baltijos regiono paštomatų tinklas. Automatiniai sekimo būsenos atnaujinimai.' },
    { code: 'VEN',  name: 'Venipak',    logo: 'assets/courier-venipak.svg',   desc: 'Lietuviškas kurjeris. Paštomatai, kurjeris į biurą ir apmokėjimas pristatymo metu.' },
  ];

  const features = [
    { icon: 'printer',       title: 'Etiketės generavimas',        desc: 'Siuntos etiketė sukuriama vienu paspaudimu iš Odoo pristatymo dokumento — be kopijavimo į kurjerio svetainę.' },
    { icon: 'link-2',        title: 'Sekimo kodai',                desc: 'Tracking kodas automatiškai grąžinamas į Odoo ir matomas kliento portale bei el. laiškuose.' },
    { icon: 'map-pin',       title: 'Paštomatai ir taškai',        desc: 'Paštomatų sąrašas sinchronizuojamas iš kurjerio — pirkėjas pasirenka tašką tiesiogiai užsakyme.' },
    { icon: 'clock',         title: 'Paėmimo užsakymas',           desc: 'Suplanuokite kurjerio atvykimą tiesiai iš Odoo — be atskiro skambučio ar svetainės.' },
    { icon: 'rotate-ccw',    title: 'Grąžinimų etiketės',          desc: 'Grąžinimo etiketės kuriamos tame pačiame sraute — klientui automatiškai siunčiamos el. paštu.' },
    { icon: 'euro',          title: 'COD — pristatymo mokėjimas',  desc: 'Pilnas COD palaikymas: pinigai surenkami pristatymo metu ir grąžinami į jūsų sąskaitą per kurjerį.' },
    { icon: 'package',       title: 'Daugiapakinės siuntos',       desc: 'Viename užsakyme — kelios dėžės ar paletės su atskirais svoriais ir matmenimis.' },
    { icon: 'calculator',    title: 'Pristatymo kainos',           desc: 'Pristatymo kaina apskaičiuojama realiu laiku pagal svorį, matmenis ir paskirties tašką.' },
  ];

  return (
    <>
      {/* === HERO === */}
      <section className="erp-pagehead erp-rivile-hero">
        <img src="assets/orbit-pattern.svg" className="erp-pagehead-orbit" alt="" />
        <div className="erp-container">
          <div className="erp-pagehead-inner">
            <div className="erp-breadcrumb">
              <a href={url('home')}>Pradžia</a>
              <span>/</span>
              <span>Sprendimai</span>
              <span>/</span>
              <span>Siuntų integracijos</span>
            </div>
            <div className="erp-eyebrow">Sprendimai · Logistika</div>
            <h1>Siuntų etiketės <span className="erp-accent">→</span> tiesiai iš Odoo.</h1>
            <p>Keturių pagrindinių Lietuvos ir Baltijos kurjerių integracijos. Etiketės, sekimo kodai ir paėmimo užsakymai kuriami paspaudus mygtuką — be rankinio duomenų perkėlimo į kurjerio svetainę.</p>
          </div>
        </div>

        {/* Courier cards */}
        <div className="erp-container">
          <div className="erp-ship-couriers">
            {couriers.map(c => (
              <div key={c.code} className="erp-ship-courier-card">
                <div className="erp-ship-courier-logo">
                  <img src={c.logo} alt={c.name + ' logo'} />
                </div>
                <div className="erp-ship-courier-body">
                  <div className="erp-ship-courier-name">{c.name}</div>
                  <div className="erp-ship-courier-desc">{c.desc}</div>
                </div>
                <div className="erp-ship-courier-price">
                  <span className="erp-ship-courier-price-n">20 €</span>
                  <span className="erp-ship-courier-price-u">/ mėn.</span>
                </div>
              </div>
            ))}
          </div>
        </div>
      </section>

      {/* === VALUE STRIP === */}
      <section className="erp-riv-valuestrip">
        <div className="erp-container">
          <div className="erp-riv-valuestrip-grid">
            <div>
              <div className="erp-riv-valuestrip-n">4</div>
              <div className="erp-riv-valuestrip-l">kurjerių integracijos<br/>DPD · LP Express · Omniva · Venipak</div>
            </div>
            <div>
              <div className="erp-riv-valuestrip-n">20 €</div>
              <div className="erp-riv-valuestrip-l">mėnesinis mokestis<br/>už kiekvieną kurjerį</div>
            </div>
            <div>
              <div className="erp-riv-valuestrip-n">0</div>
              <div className="erp-riv-valuestrip-l">rankinio duomenų<br/>įvedimo kurjerio puslapyje</div>
            </div>
            <div>
              <div className="erp-riv-valuestrip-n">API</div>
              <div className="erp-riv-valuestrip-l">tiesioginis ryšys su<br/>kiekvieno kurjerio sistema</div>
            </div>
          </div>
        </div>
      </section>

      {/* === FUNCTIONALITY GRID === */}
      <section className="erp-section">
        <div className="erp-container">
          <div className="erp-section-head">
            <div className="erp-eyebrow">Ką apima integracija</div>
            <h2 className="erp-section-title">Aštuonios galimybės — visi kurjeriai, viena logika.</h2>
            <p className="erp-section-lede">Visi keturi kurjeriai prijungiami per vieną Odoo modulį. Darbo srautas išlieka toks pat — tik skirtingi API galiniai taškai. Pridėjus naują kurjerį, jūsų kasdienis procesas nepasikeičia.</p>
          </div>

          <div className="erp-riv-feat-grid">
            {features.map((f, i) => (
              <div key={f.title} className="erp-riv-feat-card">
                <div className="erp-riv-feat-num">0{i + 1}</div>
                <div className="erp-feature-icon"><i data-lucide={f.icon}></i></div>
                <h3>{f.title}</h3>
                <p>{f.desc}</p>
              </div>
            ))}
          </div>
        </div>
      </section>

      {/* === FLOW DIAGRAM === */}
      <section className="erp-section erp-section-gray">
        <div className="erp-container">
          <div className="erp-section-head erp-section-head-center">
            <div className="erp-eyebrow">Kaip tai veikia</div>
            <h2 className="erp-section-title" style={{marginLeft: 'auto', marginRight: 'auto'}}>Trys žingsniai — nuo pristatymo dokumento iki kurjerio rankų.</h2>
          </div>
          <ShippingFlow />
        </div>
      </section>

      {/* === PRICING + REQUIREMENTS === */}
      <section className="erp-section">
        <div className="erp-container">
          <div className="erp-riv-price-grid">
            <div className="erp-riv-price-card">
              <div className="erp-eyebrow">Modulio kaina</div>
              <div className="erp-riv-price-row">
                <span className="erp-riv-price-n">20 €</span>
                <span className="erp-riv-price-u">/ mėn. už kurjerį</span>
              </div>
              <p className="erp-riv-price-desc">Pasirinkite tik tuos kurjerius, kurie jums reikalingi. Kiekviena integracija aktyvuojama atskirai — mokate tik už tai, ką naudojate.</p>
              <ul className="erp-riv-price-list">
                <li>DPD integracija — 20 €/mėn.</li>
                <li>LP Express integracija — 20 €/mėn.</li>
                <li>Omniva integracija — 20 €/mėn.</li>
                <li>Venipak integracija — 20 €/mėn.</li>
              </ul>
              <a href="https://appt.link/meet-with-erp365-7L7tGvrg" onClick={(e) => { e.preventDefault(); window.__erp_book_demo && window.__erp_book_demo(); }} className="erp-btn erp-btn-primary erp-btn-lg">Išbandyti ERP365 →</a>
            </div>

            <div className="erp-riv-req-card">
              <div className="erp-eyebrow erp-eyebrow-yellow">Ko reikia pradžiai</div>
              <h3>Kurjerio sutartis ir API prieiga</h3>
              <p>Kiekvienas kurjeris turi savo sutarties sąlygas ir API raktus. Verslo sutartį pasirašote tiesiogiai su kurjeriu — mes padėsime su API konfigūracija ir Odoo prijungimu.</p>

              <div className="erp-riv-req-checklist">
                <div className="erp-riv-req-step">
                  <span className="erp-riv-req-num">1</span>
                  <div>
                    <div className="erp-riv-req-t">Verslo sutartis su kurjeriu</div>
                    <div className="erp-riv-req-d">Atskira kiekvienam pasirinktam paslaugų tiekėjui</div>
                  </div>
                </div>
                <div className="erp-riv-req-step">
                  <span className="erp-riv-req-num">2</span>
                  <div>
                    <div className="erp-riv-req-t">API prieigos raktai</div>
                    <div className="erp-riv-req-d">Gaunami kurjerio savitarnos portale</div>
                  </div>
                </div>
                <div className="erp-riv-req-step">
                  <span className="erp-riv-req-num">3</span>
                  <div>
                    <div className="erp-riv-req-t">Integracijos aktyvavimas</div>
                    <div className="erp-riv-req-d">20 €/mėn. už kurjerį · diegimą atliekame mes</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      <CTASection
        title="Prijunkime jūsų kurjerį."
        lede="30 min. demo. Parodysime, kaip Odoo pristatymas tampa kurjerio siunta — be kopijavimo."
        primary="Išbandyti ERP365 →"
        secondary="Peržiūrėti kainas"
      />
    </>
  );
}

/* === Data flow: shipment journey === */
function ShippingFlow() {
  const stages = [
    { title: '1 · Odoo',     desc: 'Sukuriamas pristatymo dokumentas arba patvirtinamas pardavimo užsakymas su kurjerio pasirinkimu.', icon: 'edit-3',        color: '#0080FF', bg: 'var(--erp-freedom-50)' },
    { title: '2 · API',      desc: 'Modulis kreipiasi į pasirinkto kurjerio API — sugeneruojama etiketė ir sekimo kodas.',                icon: 'zap',           color: '#B8860B', bg: 'var(--erp-yellow-50)' },
    { title: '3 · Kurjeris', desc: 'Etiketė atspausdinama, siunta paimama. Klientui automatiškai išsiunčiama sekimo nuoroda.',             icon: 'truck',         color: '#16A34A', bg: '#DCFCE7' },
  ];
  return (
    <div className="erp-riv-flow">
      {stages.map((s, i) => (
        <React.Fragment key={s.title}>
          <div className="erp-riv-flow-step">
            <div className="erp-riv-flow-icon" style={{background: s.bg, color: s.color}}>
              <i data-lucide={s.icon}></i>
            </div>
            <div className="erp-riv-flow-t">{s.title}</div>
            <div className="erp-riv-flow-d">{s.desc}</div>
          </div>
          {i < stages.length - 1 && (
            <div className="erp-riv-flow-arrow">
              <svg width="36" height="20" viewBox="0 0 36 20" fill="none"><path d="M0 10 L30 10 M24 4 L30 10 L24 16" stroke="#0080FF" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/></svg>
            </div>
          )}
        </React.Fragment>
      ))}
    </div>
  );
}

window.ShippingPage = ShippingPage;