<!DOCTYPE html>
<html lang="sk">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
  <meta name="theme-color" content="#0f172a" />

  <!-- PWA / Mobile Capable Tags -->
  <meta name="mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  <meta name="apple-mobile-web-app-title" content="XBloček">
  <title>XBloček - Archivácia platieb</title>

  <!-- Favicon -->
  <link rel="icon" type="image/svg+xml" href="/favicon.svg">
  <link rel="apple-touch-icon" href="/apple-touch-icon.png">

  <!-- PWA Manifest -->
  <link rel="manifest" href="/manifest.json">

  <!-- Fonts: Inter - Mobile optimized with font-display swap -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'">
  <noscript><link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"></noscript>

  <!-- Icons - Defer loading for mobile -->
  <link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
  <noscript><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"></noscript>

  <!-- Native CSS for critical styles to avoid FOUC and build issues -->
  <style>
    * {
      -webkit-tap-highlight-color: transparent;
      -webkit-touch-callout: none;
    }

    html {
      /* IMPORTANT: do NOT add global safe-area padding on <html> (breaks taps/focus on iOS in some cases).
         Handle safe-area only on specific fixed UI elements (bottom nav, panels). */
      padding: 0;
      /* Prevent text size adjustment on iOS */
      -webkit-text-size-adjust: 100%;
      -moz-text-size-adjust: 100%;
           text-size-adjust: 100%;
      /* Smooth scrolling for mobile */
      scroll-behavior: smooth;
      /* Better font rendering on mobile */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }

    body {
      background-color: #0f172a;
      color: #f8fafc;
      font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
      overscroll-behavior-y: none;
      /* Prevent pull-to-refresh on mobile */
      overscroll-behavior: none;
      /* IMPORTANT: don't force momentum scrolling on body (can interfere with iOS input focus) */
      -webkit-overflow-scrolling: auto;
      /* Prevent selection on mobile (except inputs) */
      -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
      /* IMPORTANT: don't restrict touch-action on body (can break input focus on iOS) */
      touch-action: auto;
      /* Mobile viewport fix */
      min-height: 100vh;
      min-height: -webkit-fill-available;
      /* Prevent horizontal scroll */
      overflow-x: hidden;
      width: 100%;
    }

    /* Allow text selection in inputs and content areas */
    input, textarea, select, [contenteditable] {
      -webkit-user-select: text;
      -moz-user-select: text;
           user-select: text;
      /* IMPORTANT: allow native text interactions + keyboard focus on iOS */
      -webkit-touch-callout: default;
      touch-action: auto;
    }

    /* iOS Input Zoom Fix - prevent zoom on focus */
    input,
    select,
    textarea {
      font-size: 16px !important;
      /* Better touch targets on mobile (min 44x44px) */
      min-height: 44px;
    }

    /* Better touch targets for buttons */
    button, a, [role="button"] {
      min-height: 44px;
      min-width: 44px;
      /* Better touch feedback */
      -webkit-tap-highlight-color: rgba(255, 255, 255, 0.1);
    }

    /* App Loading State */
    #root:empty::before {
      content: "";
      position: fixed;
      top: 50%;
      left: 50%;
      width: 40px;
      height: 40px;
      margin-top: -20px;
      margin-left: -20px;
      border: 4px solid #1e293b;
      border-top-color: #10b981;
      border-radius: 50%;
      animation: spin 1s linear infinite;
      z-index: 9999;
    }

    @keyframes spin {
      to {
        transform: rotate(360deg);
      }
    }

    /* Mobile-specific optimizations */
    @media (max-width: 768px) {
      /* Reduce animations on mobile for better performance */
      * {
        animation-duration: 0.2s !important;
        transition-duration: 0.2s !important;
      }
      
      /* Don't force momentum scrolling globally (iOS keyboard/focus issues) */
    }

    /* Prevent 300ms click delay on mobile */
    a, button, [role="button"] {
      touch-action: manipulation;
    }
  </style>

  <script type="module" crossorigin src="/assets/index.COqBWjON.js"></script>
  <link rel="modulepreload" crossorigin href="/assets/vendor-react.FHD5eNiO.js">
  <link rel="modulepreload" crossorigin href="/assets/vendor-firebase.CJd7gSnu.js">
  <link rel="modulepreload" crossorigin href="/assets/vendor.wS1GKyPw.js">
  <link rel="modulepreload" crossorigin href="/assets/vendor-scanner.BDzNShPg.js">
  <link rel="stylesheet" crossorigin href="/assets/index.DWKroKS5.css">
</head>

<body>
  <div id="root"></div>
  <script>
    // Recovery mode (iOS PWA can get stuck with stale caches/SW).
    // Open `/?swreset=1` or add `#swreset=1` to force clear and reload.
    (function () {
      try {
        var href = String(window.location.href || '');
        var shouldReset =
          href.indexOf('swreset=1') !== -1 ||
          href.indexOf('#swreset') !== -1 ||
          href.indexOf('swreset=true') !== -1;
        if (!shouldReset) return;

        var tasks = [];
        if ('serviceWorker' in navigator) {
          tasks.push(
            navigator.serviceWorker.getRegistrations().then(function (regs) {
              return Promise.all(
                regs.map(function (r) {
                  try { return r.unregister(); } catch (e) { return false; }
                })
              );
            })
          );
        }
        if (window.caches && caches.keys) {
          tasks.push(
            caches.keys().then(function (keys) {
              return Promise.all(keys.map(function (k) { return caches.delete(k); }));
            })
          );
        }
        Promise.all(tasks).finally(function () {
          // Remove the reset flag to avoid loops, then hard reload.
          try {
            var url = new URL(window.location.href);
            url.searchParams.delete('swreset');
            window.location.replace(url.toString().replace('#swreset=1', ''));
          } catch (e) {
            window.location.reload();
          }
        });
      } catch (e) {
        // ignore
      }
    })();
  </script>
</body>

</html>