/* eslint-disable */
;(function(){
/* eslint-disable */
// יפן 2026 — "עוד (More)" screen. Hub for everything that isn't a main tab.
const DSmore = window.Ds2026DesignSystem_dc290c;
const ASSET_MORE = './assets';

const ROWS = [
  { id:'vault',      icon:'🎫', label:'הכספת',            sub:'כרטיסים, הזמנות ומסמכים',            tint:'var(--city-tokyo-tint)',  deep:'var(--city-tokyo-deep)' },
  { id:'phrasebook', icon:'🗣️', label:'שיחון',            sub:'ביטויים שימושיים ביפנית',            tint:'var(--city-kyoto-tint)',  deep:'var(--city-kyoto-deep)' },
  { id:'tips',       icon:'🎒', label:'טיפים וטריקים',     sub:'כדאי לדעת מראש',                     tint:'var(--city-hakone-tint)', deep:'var(--city-hakone-deep)' },
  { id:'hotels',     icon:'🛏️', label:'מלונות ולוגיסטיקה', sub:'כתובות, העברות ושינקנסן',            tint:'var(--city-osaka-tint)',  deep:'var(--city-osaka-deep)' },
  { id:'settings',   icon:'⚙️', label:'הגדרות',            sub:'שפה, התראות והורדה לצפייה אופליין', tint:'var(--sun-tint)',         deep:'var(--sun-deep)' },
];

function MoreRow({ r, onOpen }) {
  return (
    <button type="button" onClick={()=>onOpen && onOpen(r.id)} style={{
      appearance:'none', textAlign:'start', width:'100%', display:'flex', alignItems:'center', gap:14,
      padding:'14px 16px', background:'var(--surface-card)', border:'var(--border-card)',
      borderRadius:'var(--r-lg)', boxShadow:'var(--shadow-sm)', cursor:'pointer' }}>
      <span aria-hidden="true" style={{ flex:'0 0 auto', width:52, height:52, display:'grid',
        placeItems:'center', borderRadius:'var(--r-md)', background:r.tint, fontSize:26 }}>{r.icon}</span>
      <span style={{ flex:1, minWidth:0 }}>
        <span style={{ display:'block', fontFamily:'var(--font-display)', fontSize:28, lineHeight:0.95,
          color:'var(--ink-900)' }}>{r.label}</span>
        <span style={{ display:'block', fontFamily:'var(--font-ui)', fontSize:13, color:'var(--ink-500)', marginTop:2 }}>{r.sub}</span>
      </span>
      <span aria-hidden="true" style={{ color:'var(--ink-300)', fontSize:22 }}>‹</span>
    </button>
  );
}

function MoreScreen({ onOpen }) {
  return (
    <div style={{ paddingBottom:24 }}>
      <header style={{ position:'relative', padding:'16px 20px 12px' }}>
        <img src={`${ASSET_MORE}/chibi/chibi-wave.png`} alt="" style={{ position:'absolute', top:12,
          insetInlineEnd:12, height:70, borderRadius:'var(--r-md)' }} />
        <h1 style={{ fontFamily:'var(--font-display)', fontSize:46, lineHeight:0.88, color:'var(--ink-900)', margin:0 }}>עוד</h1>
        <div style={{ fontFamily:'var(--font-ui)', fontSize:14, color:'var(--ink-500)', marginTop:2 }}>הכול במקום אחד ✨</div>
      </header>

      <div style={{ display:'flex', flexDirection:'column', gap:12, padding:'6px 20px 0' }}>
        {ROWS.map((r,i) => <MoreRow key={i} r={r} onOpen={onOpen} />)}
      </div>

      <div style={{ margin:'22px 20px 0', textAlign:'center', fontFamily:'var(--font-ui)', fontSize:12.5, color:'var(--ink-500)' }}>
        משה וליעוז · יפן <span className="ltr">2026</span> ⛩️<br/>
        <span style={{ color:'var(--ink-300)' }}>גרסה <span className="ltr">1.0</span> · עובד גם ללא חיבור</span>
      </div>
    </div>
  );
}

window.JP2026More = MoreScreen;

})();