{"id":812,"date":"2025-11-08T08:27:01","date_gmt":"2025-11-08T08:27:01","guid":{"rendered":"https:\/\/www.gurmanbakestudio.com\/?page_id=812"},"modified":"2025-11-08T08:50:12","modified_gmt":"2025-11-08T08:50:12","slug":"gbs-pos","status":"publish","type":"page","link":"https:\/\/www.gurmanbakestudio.com\/?page_id=812","title":{"rendered":"gbs POS"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"812\" class=\"elementor elementor-812\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3c79e86 e-flex e-con-boxed e-con e-parent\" data-id=\"3c79e86\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-91e45e2 elementor-widget elementor-widget-html\" data-id=\"91e45e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<!-- Charset & Viewport -->\n<meta charset=\"UTF-8\" \/>\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/>\n\n<!-- Google tag (gtag.js) -->\n<script async src=\"https:\/\/www.googletagmanager.com\/gtag\/js?id=G-ZYKRVPR2V6\"><\/script>\n<script>\n  window.dataLayer = window.dataLayer || [];\n  function gtag(){dataLayer.push(arguments);}\n  gtag('js', new Date());\n  gtag('config', 'G-ZYKRVPR2V6');\n<\/script>\n\n<!-- Title -->\n<title>POS System by Gurman Bake Studio \u2013 Smart Billing for Caf\u00e9s & Bakeries<\/title>\n<meta name=\"google-site-verification\" content=\"0jzVs1hUl96dZl99_b9g3ak08GfG5Od0wvAmtxEnhB4\" \/>\n\n<!-- Meta Description -->\n<meta name=\"description\" content=\"Simplify your caf\u00e9 or bakery with Gurman POS \u2013 smart billing software built in Jalandhar. Manage orders, inventory & payments with one easy system.\">\n\n<!-- Canonical -->\n<link rel=\"canonical\" href=\"https:\/\/www.gurmanbakestudio.com\/?page_id=56\" \/>\n\n<!-- Open Graph -->\n<meta property=\"og:type\" content=\"website\" \/>\n<meta property=\"og:locale\" content=\"en_IN\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.gurmanbakestudio.com\/?page_id=56\" \/>\n<meta property=\"og:title\" content=\"Gurman POS \u2013 Smart Billing Software for Caf\u00e9s & Bakeries\" \/>\n<meta property=\"og:description\" content=\"Easy POS system for caf\u00e9s, bakeries, and restaurants in Jalandhar. Manage billing, orders, and payments effortlessly.\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.gurmanbakestudio.com\/assets\/pos-og-image.jpg\" \/>\n<meta property=\"og:site_name\" content=\"Gurman Bake Studio POS\" \/>\n\n<!-- Twitter -->\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@gurmanmaketing\" \/>\n<meta name=\"twitter:url\" content=\"https:\/\/www.gurmanbakestudio.com\/?page_id=56\" \/>\n<meta name=\"twitter:title\" content=\"Gurman POS \u2013 Smart Billing for Bakeries & Caf\u00e9s\" \/>\n<meta name=\"twitter:description\" content=\"Fast, reliable POS system made for small caf\u00e9s & bakeries. Track sales, inventory & payments in one click.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/www.gurmanbakestudio.com\/assets\/pos-og-image.jpg\" \/>\n\n<!-- Favicon -->\n<link rel=\"icon\" type=\"image\/png\" href=\"https:\/\/iili.io\/K4doccQ.png\" \/>\n\n<!-- Web App -->\n<meta name=\"theme-color\" content=\"#007AFF\" \/>\n<meta name=\"mobile-web-app-capable\" content=\"yes\" \/>\n\n<!-- Structured Data (Schema.org JSON-LD) -->\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"SoftwareApplication\",\n  \"@id\": \"https:\/\/www.gurmanbakestudio.com\/#pos\",\n  \"name\": \"Gurman POS System\",\n  \"alternateName\": \"Gurman Bake Studio POS\",\n  \"applicationCategory\": \"BusinessApplication\",\n  \"operatingSystem\": \"Web, Android, iOS\",\n  \"url\": \"https:\/\/www.gurmanbakestudio.com\/?page_id=56\",\n  \"image\": \"https:\/\/www.gurmanbakestudio.com\/assets\/pos-og-image.jpg\",\n  \"description\": \"Gurman POS is a modern billing system for caf\u00e9s, bakeries, and small restaurants. Manage sales, orders, and payments seamlessly in one dashboard.\",\n  \"softwareVersion\": \"1.0.0\",\n  \"creator\": {\n    \"@type\": \"Organization\",\n    \"name\": \"Gurman Bake Studio\",\n    \"url\": \"https:\/\/www.gurmanbakestudio.com\/\",\n    \"logo\": \"https:\/\/iili.io\/K4doccQ.png\"\n  },\n  \"aggregateRating\": {\n    \"@type\": \"AggregateRating\",\n    \"ratingValue\": \"4.9\",\n    \"reviewCount\": \"132\"\n  },\n  \"offers\": {\n    \"@type\": \"Offer\",\n    \"priceCurrency\": \"INR\",\n    \"price\": \"0\",\n    \"category\": \"FreeTrial\",\n    \"url\": \"https:\/\/www.gurmanbakestudio.com\/?page_id=56\",\n    \"availability\": \"https:\/\/schema.org\/InStock\"\n  },\n  \"sameAs\": [\n    \"https:\/\/facebook.com\/gurmanmaketing\",\n    \"https:\/\/instagram.com\/gurmanmaketing\",\n    \"https:\/\/youtube.com\/@gurmanmaketing\"\n  ],\n  \"publisher\": {\n    \"@type\": \"Organization\",\n    \"name\": \"Gurman Bake Studio\",\n    \"address\": {\n      \"@type\": \"PostalAddress\",\n      \"streetAddress\": \"83\/3 Shaheed Baba Deep Singh Nagar, Pathankot Bye Pass\",\n      \"addressLocality\": \"Jalandhar\",\n      \"addressRegion\": \"Punjab\",\n      \"postalCode\": \"144009\",\n      \"addressCountry\": \"IN\"\n    },\n    \"telephone\": \"+91-9888190913\",\n    \"contactPoint\": {\n      \"@type\": \"ContactPoint\",\n      \"telephone\": \"+91-9888190913\",\n      \"contactType\": \"Sales Support\",\n      \"availableLanguage\": [\"English\", \"Hindi\", \"Punjabi\"]\n    }\n  },\n  \"potentialAction\": {\n    \"@type\": \"BuyAction\",\n    \"target\": \"https:\/\/www.gurmanbakestudio.com\/?page_id=56\",\n    \"name\": \"Get Gurman POS\"\n  },\n  \"keywords\": [\n    \"POS system\",\n    \"billing software\",\n    \"caf\u00e9 POS\",\n    \"bakery POS\",\n    \"restaurant billing system\",\n    \"point of sale Jalandhar\",\n    \"POS for small business\"\n  ]\n}\n<\/script>\n\n<style>\n:root{\n  --accent:#007aff;--accent-dark:#0056cc;--bg:#f9f9fb;--card:#fff;--border:#e5e5ea;--text:#1c1c1e;--text-light:#666;--warning:#ff3b30;--success:#34c759;--success-dark:#2a9e47;--shadow:0 2px 8px rgba(0,0,0,.06);--shadow-hover:0 8px 25px rgba(0,0,0,.12);\n} \n*{box-sizing:border-box;margin:0;padding:0}\nbody{font-family:-apple-system,BlinkMacSystemFont,\"SF Pro Display\",\"Helvetica Neue\",Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;line-height:1.5;min-height:100vh;padding-bottom:env(safe-area-inset-bottom)}\n\n#logout-btn{background:var(--warning);color:#fff;display:none}\n#login-btn{background:var(--accent);color:#fff}\n.employee-info{display:none;align-items:center;gap:8px;font-size:0.85rem;color:var(--text-light);background:rgba(0,122,255,0.1);padding:6px 12px;border-radius:8px;margin-left:auto}\n.employee-info .employee-name{font-weight:600;color:var(--accent)}\n.main-content{padding-top:20px}\n.container{max-width:1400px;margin:0 auto;padding:0 1rem 3rem;padding-left:max(1rem, env(safe-area-inset-left));padding-right:max(1rem, env(safe-area-inset-right))}\n.subheading{text-align:center;color:var(--text-light);margin:.3rem 0 1.5rem;font-size:0.95rem}\n.workflow-container{display:flex;gap:1.5rem;align-items:flex-start}\n.products-section{flex:1;min-width:0}\n.search-bar{position:relative;margin-bottom:1.5rem}\n.search-bar input{width:100%;padding:.82rem 1rem .82rem 3rem;font-size:1rem;border-radius:14px;border:1px solid rgba(0,0,0,0.06);background:#fff;background-image:url('data:image\/svg+xml,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"%23666\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"11\" cy=\"11\" r=\"8\"\/><path d=\"m21 21-4.3-4.3\"\/><\/svg>');background-repeat:no-repeat;background-position:12px center;background-size:18px;transition:border-color 0.2s, box-shadow 0.2s;-webkit-appearance:none}\n.search-bar input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,122,255,0.1)}\n.suggestions{position:absolute;left:0;right:0;top:110%;background:rgba(255,255,255,0.98);border:1px solid rgba(0,0,0,0.06);border-radius:12px;margin-top:8px;box-shadow:0 10px 30px rgba(0,0,0,0.06);max-height:280px;overflow:auto;display:none;z-index:120;backdrop-filter:blur(10px)}\n.suggestion-item{display:flex;align-items:center;gap:12px;padding:10px;border-bottom:1px solid rgba(0,0,0,0.03);cursor:pointer;transition:background 0.2s;-webkit-tap-highlight-color:transparent}\n.suggestion-item:hover{background:rgba(0,0,0,0.03)}\n.suggestion-item img{width:46px;height:46px;border-radius:10px;object-fit:cover}\n.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.25rem}\n.card{background:var(--card);border-radius:14px;padding:14px;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .12s ease,box-shadow .12s;height:100%;border:1px solid rgba(0,0,0,0.03);-webkit-tap-highlight-color:transparent;cursor:pointer;position:relative}\n.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}\n.card:active{transform:translateY(0);box-shadow:var(--shadow)}\n.card img{height:120px;object-fit:cover;border-radius:10px;margin-bottom:12px;pointer-events:none}\n.card h3{font-size:1rem;margin:0 0 6px;font-weight:600;pointer-events:none}\n.card p{color:var(--text-light);margin:0 0 12px;font-size:0.95rem;pointer-events:none}\n.card button{background:var(--accent);color:#fff;border:none;padding:10px;border-radius:10px;cursor:pointer;margin-top:auto;font-weight:600;transition:background 0.2s;-webkit-tap-highlight-color:transparent;pointer-events:auto}\n.card button:hover{background:var(--accent-dark)}\n.card .quick-add{position:absolute;top:8px;right:8px;background:rgba(0,0,0,0.7);color:white;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:18px;opacity:0;transition:opacity 0.2s;pointer-events:none}\n.card:hover .quick-add{opacity:1}\n\n\/* Product highlight animation *\/\n.card.highlighted {\n  animation: productHighlight 3s ease-in-out;\n  position: relative;\n  z-index: 10;\n}\n\n@keyframes productHighlight {\n  0% {\n    box-shadow: 0 0 0 0 rgba(52, 199, 89, 0.7);\n    border-color: var(--success);\n    transform: scale(1);\n  }\n  15% {\n    box-shadow: 0 0 0 10px rgba(52, 199, 89, 0.4);\n    border-color: var(--success);\n    transform: scale(1.02);\n  }\n  30% {\n    box-shadow: 0 0 0 15px rgba(52, 199, 89, 0.2);\n    border-color: var(--success);\n    transform: scale(1.02);\n  }\n  50% {\n    box-shadow: 0 0 0 20px rgba(52, 199, 89, 0.1);\n    border-color: var(--success);\n    transform: scale(1.01);\n  }\n  70% {\n    box-shadow: 0 0 0 15px rgba(52, 199, 89, 0.05);\n    border-color: rgba(52, 199, 89, 0.5);\n    transform: scale(1);\n  }\n  100% {\n    box-shadow: var(--shadow);\n    border-color: rgba(0,0,0,0.03);\n    transform: scale(1);\n  }\n}\n\n.cart-section{width:380px;position:sticky;top:110px;flex-shrink:0}\n#cart-checkout{background:var(--card);border-radius:14px;padding:18px;box-shadow:var(--shadow);border:1px solid rgba(0,0,0,0.03)}\n#cart-checkout h2{font-size:1.3rem;margin-bottom:1rem;display:flex;align-items:center;gap:6px}\n#cart-items{max-height:400px;overflow:auto;margin-bottom:1rem}\n.cart-item{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}\n.cart-item:last-child{border-bottom:none}\n.cart-item img{width:56px;height:56px;border-radius:8px;object-fit:cover;flex-shrink:0}\n.qty-btns{display:flex;gap:10px;align-items:center}.qty-btns button{width:36px;height:36px;border-radius:50%;border:none;background:#f5f5f7;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:bold;font-size:1.1rem;color:#1d1d1f;box-shadow:0 4px 12px rgba(0,0,0,0.08);transition:background 0.2s,transform 0.15s,box-shadow 0.2s;-webkit-tap-highlight-color:transparent}.qty-btns button:hover{background:#eaeaea;transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,0.12)}.qty-btns button:active{background:#dcdcdc;transform:translateY(0);box-shadow:0 3px 8px rgba(0,0,0,0.08)}.qty-input{width:60px;height:36px;text-align:center;border:1px solid #d1d1d6;border-radius:12px;font-size:1rem;-webkit-appearance:none;padding:0 6px;background:#fff;box-shadow:inset 0 1px 2px rgba(0,0,0,0.06);transition:border-color 0.2s,box-shadow 0.2s}.qty-input:focus{outline:none;border-color:#007aff;box-shadow:0 0 0 3px rgba(0,122,255,0.15)}.total{font-weight:700;text-align:right;margin-top:12px;font-size:1.4rem;padding-top:12px;border-top:1px dashed #d1d1d6;color:#1d1d1f}\n\n.small{font-size:.9rem;color:var(--text-light)}\n.payment-options{margin-top:16px;padding:14px;background:#fbfdff;border-radius:10px;border:1px solid var(--border)}\n.payment-options .small{font-weight:600;margin-bottom:8px;display:block}\n.payment-options label{display:flex;align-items:center;gap:6px;cursor:pointer;padding:6px 0;-webkit-tap-highlight-color:transparent}\n.actions{display:flex;gap:10px;margin-top:16px}\n.actions button{flex:1;padding:12px;border-radius:10px;border:none;cursor:pointer;font-weight:600;transition:all 0.2s;-webkit-tap-highlight-color:transparent}\n#complete-order{background:var(--success);color:#fff}\n#complete-order:hover:not(:disabled){background:var(--success-dark)}\n#complete-order:disabled{background:#ccc;cursor:not-allowed}\n#print-receipt{background:#8e44ad;color:#fff}\n#print-receipt:hover{background:#9b59b6}\n#send-whatsapp{background:#007aff;color:#fff;transition:background 0.2s}\n#send-whatsapp:hover{background:var(--accent-dark)}\n.receipt-section{margin-top:16px;display:none}\n.receipt{font-family:'Courier New', monospace;background:#fff;padding:16px;border-radius:10px;border:1px dashed #ddd;white-space:pre-line;font-size:0.9rem;line-height:1.4}\n.input-whatsapp{display:flex;gap:8px;margin-top:12px}\n.input-whatsapp input{flex:1;padding:10px;border-radius:8px;border:1px solid var(--border);font-size:0.9rem;-webkit-appearance:none}\n.input-whatsapp button{padding:10px 14px;border-radius:8px;border:none;background:var(--accent);color:#fff;cursor:pointer;font-weight:600;transition:background 0.2s;-webkit-tap-highlight-color:transparent}\n.input-whatsapp button:hover{background:var(--accent-dark)}\n.login-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:2000;display:none;padding:1rem;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}\n.login-form{background:var(--card);padding:2rem;border-radius:14px;max-width:400px;width:100%;box-shadow:0 10px 40px rgba(0,0,0,0.2)}\n.login-form h2{margin:0 0 1.5rem;text-align:center;font-size:1.5rem}\n.login-form input{width:100%;padding:14px;margin-bottom:1rem;border-radius:8px;border:1px solid var(--border);font-size:1rem;transition:border-color 0.2s;-webkit-appearance:none}\n.login-form input:focus{outline:none;border-color:var(--accent)}\n.login-form button{width:100%;padding:14px;border-radius:8px;border:none;background:var(--accent);color:#fff;cursor:pointer;font-weight:600;font-size:1rem;transition:background 0.2s;-webkit-tap-highlight-color:transparent}\n.login-form button:hover{background:var(--accent-dark)}\n.login-error{color:var(--warning);text-align:center;margin-top:10px;display:none;font-weight:600}\n.empty-cart{text-align:center;padding:2rem;color:var(--text-light)}\n.empty-cart p{margin:0}\n.empty-cart .small{margin-top:8px}\n.added-feedback{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--success);color:white;padding:12px 24px;border-radius:10px;font-weight:600;z-index:2000;animation:fadeOut 1.5s ease-in-out forwards;pointer-events:none}\n@keyframes fadeOut{0%{opacity:1}70%{opacity:1}100%{opacity:0}}\n\n\/* Database modal *\/\n.database-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:2000;display:none;padding:1rem;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}\n.database-content{background:var(--card);padding:2rem;border-radius:14px;max-width:800px;width:100%;max-height:80vh;overflow:auto;box-shadow:0 10px 40px rgba(0,0,0,0.2)}\n.database-content h2{margin:0 0 1.5rem;text-align:center;font-size:1.5rem}\n.database-stats{display:grid;grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));gap:1rem;margin-bottom:1.5rem}\n.stat-card{background:#f9f9fb;padding:1rem;border-radius:10px;text-align:center;border:1px solid var(--border)}\n.stat-card .value{font-size:1.5rem;font-weight:700;color:var(--accent)}\n.stat-card .label{font-size:0.85rem;color:var(--text-light);margin-top:0.5rem}\n.database-table{width:100%;border-collapse:collapse;margin-top:1rem}\n.database-table th, .database-table td{padding:0.75rem;text-align:left;border-bottom:1px solid var(--border)}\n.database-table th{font-weight:600;color:var(--text-light);background:#f9f9fb}\n.database-table tr:last-child td{border-bottom:none}\n.database-actions{display:flex;gap:10px;margin-top:1.5rem;justify-content:center}\n.database-actions button{padding:10px 16px;border-radius:8px;border:none;cursor:pointer;font-weight:600;transition:background 0.2s}\n#export-all{background:var(--success);color:#fff}\n#export-all:hover{background:var(--success-dark)}\n#print-db{background:#8e44ad;color:#fff}\n#print-db:hover{background:#9b59b6}\n#close-db{background:var(--accent);color:#fff}\n#close-db:hover{background:var(--accent-dark)}\n\n\/* Print styles for database *\/\n@media print {\n  body * {\n    visibility: hidden;\n  }\n  .database-content, .database-content * {\n    visibility: visible;\n  }\n  .database-content {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    max-width: 100%;\n    box-shadow: none;\n    padding: 0;\n  }\n  .database-actions {\n    display: none;\n  }\n  .database-table {\n    width: 100%;\n    font-size: 12px;\n  }\n  .database-table th, .database-table td {\n    padding: 4px 8px;\n  }\n}\n\n\/* iPhone 12 Pro (390px) and similar *\/\n@media (max-width: 390px) {\n  .products { grid-template-columns: repeat(2, 1fr); gap: 1rem; }\n  .card { padding: 12px; }\n  .card img { height: 100px; }\n  .header-actions { flex-direction: column; width: auto; margin-top: 0; }\n  .header-actions button { width: 120px; font-size: 0.8rem; padding: 6px 10px; }\n  .search-bar input { padding: 0.7rem 1rem 0.7rem 2.5rem; font-size: 0.9rem; }\n  .cart-section { width: 100%; }\n  #cart-checkout { padding: 14px; }\n  .employee-info { margin-left: 0; margin-top: 8px; width: 100%; justify-content: center; }\n  .qty-input { width: 45px; }\n  .database-stats { grid-template-columns: repeat(2, 1fr); }\n}\n\n\/* iPad (768px) and similar tablets *\/\n@media (max-width: 768px) {\n  .workflow-container { flex-direction: column; }\n  .cart-section { \n    width: 100%; \n    position: static; \n    margin-top: 1.5rem; \n  }\n  .products { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }\n  header { height: auto; padding: 0.8rem; gap: 10px; }\n  .header-title h1 { font-size: 1.1rem; }\n  .header-title h3 { font-size: 0.75rem; }\n  .logo { height: 38px; }\n  .header-actions { width: 100%; justify-content: flex-end; margin-top: 8px; }\n  .header-title { text-align: center; }\n  .card { padding: 12px; }\n  .card img { height: 100px; }\n  .employee-info { margin-left: auto; margin-top: 0; }\n  .database-content { padding: 1.5rem; }\n  .database-stats { grid-template-columns: repeat(3, 1fr); }\n}\n\n\/* Small tablets and large phones (640px) *\/\n@media (max-width: 640px) {\n  .container { padding: 0 0.8rem 2rem; }\n  .search-bar { margin-bottom: 1rem; }\n  .products { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 1rem; }\n  .card img { height: 90px; }\n  .actions { flex-direction: column; }\n  .input-whatsapp { flex-direction: column; }\n  #cart-checkout { padding: 14px; }\n  .payment-options { padding: 12px; }\n  .qty-input { width: 40px; }\n  .database-stats { grid-template-columns: repeat(2, 1fr); }\n}\n\n\/* Large laptops (1200px+) *\/\n@media (min-width: 1200px) {\n  .container { max-width: 95%; }\n  .products { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }\n}\n\n\/* Medium laptops (900px-1199px) *\/\n@media (max-width: 1199px) and (min-width: 901px) {\n  .products { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }\n  .card img { height: 110px; }\n}\n\n\/* Small laptops and large tablets (901px-1024px) *\/\n@media (max-width: 1024px) and (min-width: 769px) {\n  .products { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }\n}\n\n\/* Very small phones (360px and below) *\/\n@media (max-width: 360px) {\n  .products { grid-template-columns: 1fr; }\n  .card { max-width: 220px; margin: 0 auto; }\n  .card img { height: 120px; }\n  header { padding: 0.6rem; }\n  .logo { height: 32px; }\n  .qty-input { width: 35px; }\n  .database-stats { grid-template-columns: 1fr; }\n}\n\n\/* iPad Pro and larger tablets in landscape *\/\n@media (min-width: 1024px) and (max-height: 1366px) and (orientation: portrait) {\n  .workflow-container { flex-direction: row; }\n  .cart-section { width: 380px; position: sticky; top: 110px; }\n}\n\n\/* Safe area support for notched devices *\/\n@supports(padding: max(0px)) {\n  .container, header, .login-modal, .database-modal {\n    padding-left: max(1rem, env(safe-area-inset-left));\n    padding-right: max(1rem, env(safe-area-inset-right));\n  }\n  body {\n    padding-bottom: env(safe-area-inset-bottom);\n  }\n}\n\n\/* Prevent zoom on input focus for iOS *\/\n@media (max-width: 768px) {\n  input, select, textarea {\n    font-size: 16px !important;\n  }\n}\n\n\/* Enhanced touch targets for mobile *\/\n@media (max-width: 768px) {\n  .card button, .actions button, .qty-btns button, .input-whatsapp button {\n    min-height: 44px;\n  }\n  .suggestion-item {\n    min-height: 44px;\n  }\n}\n\n\/* Enhanced Apple-style improvements *\/\n.header-title h1 {\n  background: linear-gradient(135deg, #1c1c1e 0%, #3a3a3c 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-clip: text;\n}\n\n.card {\n  background: linear-gradient(145deg, #ffffff, #f7f7f7);\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n}\n\n.card:hover {\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n}\n\n#cart-checkout {\n  background: linear-gradient(145deg, #ffffff, #fafafa);\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n}\n\n.search-bar input {\n  background: #ffffff;\n  box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);\n}\n\n.qty-input {\n  background: #ffffff;\n  box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);\n}\n\n\/* Enhanced Apple-style buttons *\/\n.actions button, .header-actions button, .input-whatsapp button, .database-actions button, .login-form button, .card button {\n  background: linear-gradient(145deg, var(--accent), var(--accent-dark));\n  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n  border: none;\n  border-radius: 10px;\n  font-weight: 600;\n  transition: all 0.2s ease;\n  position: relative;\n  overflow: hidden;\n}\n\n.actions button:hover, .header-actions button:hover, .input-whatsapp button:hover, .database-actions button:hover, .login-form button:hover, .card button:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\n}\n\n.actions button:active, .header-actions button:active, .input-whatsapp button:active, .database-actions button:active, .login-form button:active, .card button:active {\n  transform: translateY(0);\n  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.06);\n}\n\n\/* Success button styling *\/\n#complete-order {\n  background: linear-gradient(145deg, var(--success), var(--success-dark));\n}\n\n\/* Print button styling *\/\n#print-receipt {\n  background: linear-gradient(145deg, #8e44ad, #9b59b6);\n}\n\n\/* Database button styling *\/\n#database-btn {\n  background: linear-gradient(145deg, #8e44ad, #9b59b6);\n}\n\n\/* Number input styling for better mobile experience *\/\n.qty-input {\n  -webkit-appearance: none;\n  -moz-appearance: textfield;\n}\n\n.qty-input::-webkit-outer-spin-button,\n.qty-input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n\n\/* Focus styles for better accessibility *\/\nbutton:focus, input:focus {\n  outline: 2px solid var(--accent);\n  outline-offset: 2px;\n}\n\n\/* Apple-style improvements for better visual hierarchy *\/\n.header-title h1 {\n  font-weight: 700;\n  letter-spacing: -0.5px;\n}\n\n.subheading {\n  font-weight: 400;\n  letter-spacing: 0.2px;\n}\n\n.card h3 {\n  font-weight: 600;\n  letter-spacing: 0.1px;\n}\n\n\/* Improved Apple-style shadows and depth *\/\n.card {\n  border: 1px solid rgba(0,0,0,0.04);\n  backdrop-filter: blur(10px);\n  -webkit-backdrop-filter: blur(10px);\n}\n\n#cart-checkout {\n  border: 1px solid rgba(0,0,0,0.04);\n  backdrop-filter: blur(10px);\n  -webkit-backdrop-filter: blur(10px);\n}\n\n\/* Enhanced Apple-style animations *\/\n@keyframes appleFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(8px) scale(0.98);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n\n.card {\n  animation: appleFadeIn 0.3s ease-out;\n}\n\n\/* Improved Apple-style typography *\/\nbody {\n  font-family: -apple-system, BlinkMacSystemFont, \"SF Pro Text\", \"SF Pro Display\", \"Helvetica Neue\", Arial, sans-serif;\n  font-weight: 400;\n  letter-spacing: -0.1px;\n}\n\n\/* Enhanced Apple-style form elements *\/\n.search-bar input, .login-form input, .input-whatsapp input, .qty-input {\n  font-family: -apple-system, BlinkMacSystemFont, \"SF Pro Text\", \"Helvetica Neue\", Arial, sans-serif;\n  font-weight: 400;\n  letter-spacing: 0.1px;\n}\n\n\/* Apple-style loading states *\/\n.card button:disabled {\n  opacity: 0.6;\n  cursor: not-allowed;\n  transform: none !important;\n}\n\n\/* Improved Apple-style color scheme *\/\n:root {\n  --accent: #007AFF;\n  --accent-dark: #0056CC;\n  --bg: #F9F9FB;\n  --card: #FFFFFF;\n  --border: #E5E5EA;\n  --text: #1C1C1E;\n  --text-light: #8E8E93;\n  --warning: #FF3B30;\n  --success: #34C759;\n  --success-dark: #2A9E47;\n  --shadow: 0 2px 8px rgba(0,0,0,0.06);\n  --shadow-hover: 0 8px 25px rgba(0,0,0,0.12);\n}\n\n\/* Close button styling *\/\n#close-receipt {\n  background: var(--warning);\n  color: #fff;\n  margin-top: 12px;\n  width: 100%;\n}\n\n#close-receipt:hover {\n  background: #e03530;\n}\n\n\/* Reset cart button styling *\/\n#reset-cart {\n  background: #ff6b6b;\n  color: #fff;\n  margin-top: 8px;\n  width: 100%;\n}\n\n#reset-cart:hover {\n  background: #e74c3c;\n}\n<\/style>\n<\/head>\n<body>\n\n<!-- Staff Login Overlay -->\n<div id=\"staffOverlay\" style=\"\n    position: fixed;\n    top:0; left:0; right:0; bottom:0;\n    background: rgba(255, 255, 255, 0.95);\n    backdrop-filter: blur(12px);\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif;\n    z-index: 9999;\n    transition: opacity 0.3s ease;\n\">\n\n    <!-- Login Box -->\n    <div style=\"\n        background: #fff;\n        padding: 2rem;\n        border-radius: 24px;\n        box-shadow: 0 20px 50px rgba(0,0,0,0.08);\n        text-align: center;\n        min-width: 340px;\n    \">\n        <!-- Logo & Title -->\n        <img decoding=\"async\" src=\"https:\/\/iili.io\/KQzUoiP.png\" alt=\"Gurman Logo\" style=\"height:50px; width:auto; margin-bottom: 1rem;\">\n        <h1 style=\"margin:0; font-size:1.8rem; font-weight:600; line-height:1.3; color:#1C1C1E;\">Gurman Bake Studio - POS<\/h1>\n        <h3 style=\"margin:0.5rem 0 1.5rem; font-weight:400; font-size:1rem; color:#8E8E93;\">FSSAI: 22125020001544<\/h3>\n\n        <!-- Menu Links Inside Login Box -->\n        <nav aria-label=\"Primary\" style=\"display:flex; justify-content:center; gap:12px; margin-bottom:1.5rem; flex-wrap:wrap;\">\n          <a href=\"https:\/\/www.gurmanbakestudio.com\/\" style=\"\n              padding:7px 16px;\n              border-radius:14px;\n              text-decoration:none;\n              font-weight:600;\n              font-size:14px;\n              color:#0A84FF;\n              background:rgba(0,132,255,0.05);\n              transition: background 0.3s, transform 0.2s ease;\"\n              onmouseover=\"this.style.background='rgba(0,132,255,0.15)'; this.style.transform='translateY(-2px)';\"\n              onmouseout=\"this.style.background='rgba(0,132,255,0.05)'; this.style.transform='translateY(0)';\">Shop<\/a>\n\n          <a href=\"https:\/\/www.gurmanbakestudio.com\/?page_id=56\" style=\"\n              padding:7px 16px;\n              border-radius:14px;\n              text-decoration:none;\n              font-weight:600;\n              font-size:14px;\n              color:#1C1C1E;\n              background:rgba(0,0,0,0.03);\n              transition: background 0.3s, transform 0.2s ease;\"\n              onmouseover=\"this.style.background='rgba(0,0,0,0.08)'; this.style.transform='translateY(-2px)';\"\n              onmouseout=\"this.style.background='rgba(0,0,0,0.03)'; this.style.transform='translateY(0)';\">POS<\/a>\n\n          <a href=\"https:\/\/www.gurmanbakestudio.com\/?page_id=97\" style=\"\n              padding:7px 16px;\n              border-radius:14px;\n              text-decoration:none;\n              font-weight:600;\n              font-size:14px;\n              color:#1C1C1E;\n              background:rgba(0,0,0,0.03);\n              transition: background 0.3s, transform 0.2s ease;\"\n              onmouseover=\"this.style.background='rgba(0,0,0,0.08)'; this.style.transform='translateY(-2px)';\"\n              onmouseout=\"this.style.background='rgba(0,0,0,0.03)'; this.style.transform='translateY(0)';\">Job Openings<\/a>\n        <\/nav>\n        \n        <!-- Staff Login Heading -->\n        <h2 style=\"\n            margin:0 0 1.5rem 0;\n            font-size:1.6rem;\n            font-weight:700;\n            color:#1C1C1E;\n        \">\n            Staff Login\n        <\/h2>\n\n        <!-- Staff Password Input -->\n        <input id=\"staffPassword\" type=\"password\" placeholder=\"Staff Password\" style=\"\n            width:100%;\n            padding:0.65rem 1rem;\n            border-radius:14px;\n            border:1px solid #d1d1d6;\n            font-size:1rem;\n            text-align:center;\n            outline:none;\n            margin-bottom:1rem;\n            transition: border-color 0.2s;\n        \" onfocus=\"this.style.borderColor='#007aff';\" onblur=\"this.style.borderColor='#d1d1d6';\">\n        \n        <button onclick=\"checkPassword()\" style=\"\n            width:100%;\n            padding:0.65rem 1rem;\n            border:none;\n            border-radius:14px;\n            background:#007aff;\n            color:white;\n            font-size:1rem;\n            font-weight:600;\n            cursor:pointer;\n            transition: background 0.3s, transform 0.2s;\n        \" onmouseover=\"this.style.background='#0056cc'; this.style.transform='translateY(-2px)';\"\n          onmouseout=\"this.style.background='#007aff'; this.style.transform='translateY(0)';\">Login<\/button>\n    <\/div>\n<\/div>\n\n<script>\nfunction checkPassword() {\n    const input = document.getElementById('staffPassword').value;\n    if(input === '0295') {\n        const overlay = document.getElementById('staffOverlay');\n        overlay.style.opacity = '0';\n        setTimeout(()=> overlay.style.display = 'none', 300);\n    } else {\n        alert('Incorrect Password!');\n        document.getElementById('staffPassword').value = '';\n    }\n}\n\n\/\/ Auto-focus input\nwindow.onload = () => {\n    document.getElementById('staffPassword').focus();\n};\n<\/script>\n\n\n<header style=\"background:#fff; border-bottom:1px solid #e5e5ea; font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif; box-shadow:0 2px 10px rgba(0,0,0,0.05); padding:20px;\">\n\n  <!-- Logo + Title -->\n  <div style=\"display:flex; align-items:center; justify-content:center; gap:16px; text-align:center; margin-bottom:15px;\">\n    <img decoding=\"async\" src=\"https:\/\/iili.io\/KQzUoiP.png\" alt=\"Gurman Logo\"\n         style=\"width:70px; height:auto; cursor:pointer; transition:transform 0.3s ease;\"\n         onmouseover=\"this.style.transform='scale(1.05)'; this.style.cursor='pointer';\"\n         onmouseout=\"this.style.transform='scale(1)';\">\n    \n    <div style=\"line-height:1.3;\">\n      <h1 style=\"font-size:1.6rem; font-weight:700; color:#1c1c1e; margin:0;\">Gurman Bake Studio - POS<\/h1>\n      <h3 style=\"font-size:1rem; font-weight:500; color:#8e8e93; margin:4px 0 0;\">FSSAI: 22125020001544<\/h3>\n    <\/div>\n  <\/div>\n<nav aria-label=\"Primary\" style=\"display:flex; justify-content:center; gap:10px; margin-bottom:1.5rem; flex-wrap:wrap;\">\n  <a href=\"https:\/\/www.gurmanbakestudio.com\/\" style=\"\n      padding:6px 14px;\n      border-radius:10px;\n      text-decoration:none;\n      font-weight:600;\n      font-size:14px;\n      color:#0A84FF;\n      background:rgba(0,132,255,0.05);\n      transition: background 0.3s, transform 0.2s ease;\"\n      onmouseover=\"this.style.background='rgba(0,132,255,0.15)'; this.style.transform='translateY(-2px)';\"\n      onmouseout=\"this.style.background='rgba(0,132,255,0.05)'; this.style.transform='translateY(0)';\">\n      Back to Website\n  <\/a>\n<\/nav>\n\n  <!-- Employee Info + Buttons -->\n  <div style=\"display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; max-width:900px; margin:0 auto;\">\n    \n    <div id=\"employee-info\" style=\"display:flex; align-items:center; gap:8px; font-size:1rem; color:#1c1c1e;\">\n      <span>\ud83d\udc64<\/span>\n      <span>Employee: <span id=\"employee-name\" style=\"font-weight:600; color:#007aff;\">\u2014<\/span><\/span>\n    <\/div>\n    \n    <div class=\"header-actions\" style=\"display:flex; gap:10px;\">\n      <button id=\"login-btn\" style=\"padding:8px 16px; background:#007aff; color:#fff; border:none; border-radius:10px; font-weight:600; cursor:pointer; transition:background 0.2s;\">Employee Login<\/button>\n      <button id=\"logout-btn\" style=\"padding:8px 16px; background:#ff3b30; color:#fff; border:none; border-radius:10px; font-weight:600; cursor:pointer; transition:background 0.2s;\">Logout<\/button>\n      <button id=\"database-btn\" style=\"display:none; padding:8px 16px; background:#34c759; color:#fff; border:none; border-radius:10px; font-weight:600; cursor:pointer; transition:background 0.2s;\">\ud83d\udcca Database<\/button>\n    <\/div>\n    \n  <\/div>\n\n<\/header>\n\n\n<div class=\"login-modal\" id=\"login-modal\">\n  <div class=\"login-form\">\n    <h2>Employee Login<\/h2>\n    <input type=\"text\" id=\"username\" placeholder=\"Username\" autocomplete=\"username\">\n    <input type=\"password\" id=\"password\" placeholder=\"Password\" autocomplete=\"current-password\">\n    <button id=\"submit-login\">Login<\/button>\n    <div class=\"login-error\" id=\"login-error\">Invalid username or password<\/div>\n  <\/div>\n<\/div>\n\n<div class=\"database-modal\" id=\"database-modal\">\n  <div class=\"database-content\">\n    <h2>Sales Database<\/h2>\n    <div class=\"database-stats\" id=\"database-stats\">\n      <!-- Stats will be populated by JavaScript -->\n    <\/div>\n    <div class=\"database-table-container\">\n      <table class=\"database-table\">\n        <thead>\n          <tr>\n            <th>Order #<\/th>\n            <th>Date<\/th>\n            <th>Time<\/th>\n            <th>Items<\/th>\n            <th>Total<\/th>\n            <th>Payment<\/th>\n            <th>Employee<\/th>\n          <\/tr>\n        <\/thead>\n        <tbody id=\"database-table-body\">\n          <!-- Table rows will be populated by JavaScript -->\n        <\/tbody>\n      <\/table>\n    <\/div>\n    <div class=\"database-actions\">\n      <button id=\"export-all\">Export All Data<\/button>\n      <button id=\"print-db\">\ud83d\udda8\ufe0f Print<\/button>\n      <button id=\"close-db\">Close<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<div class=\"main-content\">\n  <div class=\"container\">\n    <p class=\"subheading\">Fast, reliable POS with instant receipt download & WhatsApp sharing<\/p>\n\n    <div class=\"workflow-container\">\n      <!-- Products Section (Left) -->\n      <div class=\"products-section\">\n        <div class=\"search-bar\">\n          <input id=\"searchInput\" placeholder=\"\ud83d\udd0d search here please.......\" autocomplete=\"off\">\n          <div id=\"suggestions\" class=\"suggestions\" aria-hidden=\"true\"><\/div>\n        <\/div>\n        \n        <div class=\"products\" id=\"product-list\"><\/div>\n      <\/div>\n      \n      <!-- Cart Section (Right) -->\n      <div class=\"cart-section\">\n        <div id=\"cart-checkout\">\n          <h2>\ud83d\uded2 Current Order <small class=\"small\">(<span id=\"item-count\">0<\/span> items)<\/small><\/h2>\n          <div id=\"cart-items\">\n            <div class=\"empty-cart\">\n              <p>Your cart is empty<\/p>\n              <p class=\"small\">Add items from the menu<\/p>\n            <\/div>\n          <\/div>\n          <div class=\"total\" id=\"cart-total\">Total \u20b90<\/div>\n\n          <div class=\"payment-options\">\n            <span class=\"small\">Payment method<\/span>\n            <div style=\"display:flex;gap:8px;margin-top:8px\">\n              <label style=\"flex:1\"><input type=\"radio\" name=\"payment\" value=\"cash\" checked> Cash<\/label>\n              <label style=\"flex:1\"><input type=\"radio\" name=\"payment\" value=\"paytm\"> Paytm<\/label>\n            <\/div>\n        \n            <div class=\"actions\">\n              <button id=\"print-receipt\">\ud83d\udda8\ufe0f Print<\/button>\n              <button id=\"complete-order\" disabled>Complete Order<\/button>\n            <\/div>\n\n          <\/div>\n\n          <div class=\"receipt-section\" id=\"receipt-section\">\n            <div class=\"receipt\" id=\"receipt\"><\/div>\n            <div class=\"input-whatsapp\">\n              <input id=\"whatsappNumber\" type=\"tel\" placeholder=\"Customer WhatsApp (e.g. 919888190913)\" inputmode=\"tel\">\n              <button id=\"send-whatsapp\" title=\"Open WhatsApp Web with receipt\">\ud83d\udcf2 Send<\/button>\n            <\/div>\n            <!-- Reset Cart Button Added Here -->\n            <button id=\"reset-cart\">\ud83d\udd04 Reset Cart<\/button>\n            <button id=\"close-receipt\">Close<\/button>\n          <\/div>\n          \n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n\/\/ --------- Data ---------\nconst products = [\n \n  {\n    id: 'cheese-veg-sandwich',\n    name: 'Veg Loaded Sandwich',\n    price: 20,\n    category: 'sandwich',\n    description: 'Cheese Veg Sandwich with butter and tomato',\n    image: 'https:\/\/iili.io\/KQeLVJ1.png'\n  },\n  {\n    id: 'grilled-veg-sandwich',\n    name: 'Veg Grilled Sandwich',\n    price: 30,\n    category: 'sandwich',\n    description: 'Crispy Grilled Veg Sandwich with golden brown bread',\n    image: 'https:\/\/iili.io\/KQIGyjs.png'\n  },\n {\n  name: 'Aloo Paratha',\n  price: 35,\n  image: 'https:\/\/iili.io\/KD2L1J2.png',\n  alt: 'Freshly made Aloo Paratha served with curd and achaar',\n  description: 'Delicious Aloo Paratha made with spiced potato filling and whole wheat flour, served with curd and achaar. perfect for a fulfilling meal, available online in Jalandhar for quick delivery.'\n},\n{\n  name: 'Homemade Maggi (2 Person serving)',\n  price: 70,\n  image: 'https:\/\/iili.io\/KDTkdyx.jpg',\n  alt: 'Homemade Maggi noodles served hot with potatoes and mild spices',\n  description: 'Instantly cooked homemade Maggi noodles, enriched with fresh potatoes and mild spices for a comforting taste. Serves 6\u201310 people, perfect for a quick and satisfying meal, available online in Jalandhar for fast delivery.'\n}\n\n];\n\n\/\/ Employee credentials with names - Added 2 more employees\nconst employeeCredentials = {\n  'gurman': { \n    password: 'a6',\n    name: 'Gurman Preet Singh'\n  },\n  'aman': { \n    password: 'a1',\n    name: 'Aman Sharma'\n  },\n  'priya': { \n    password: 'p1',\n    name: 'Priya Patel'\n  }\n};\n\n\/\/ --------- State ---------\nlet cart = [];\nlet orderNumber = Number(localStorage.getItem('pos_order_number') || '1');\nlet isLoggedIn = localStorage.getItem('pos_logged_in') === 'true';\nlet currentEmployee = localStorage.getItem('pos_employee_name') || '';\nlet logoutTimer;\nconst LOGOUT_TIME = 5 * 60 * 1000; \/\/ 5 minutes in milliseconds\n\n\/\/ Database for storing all transactions\nlet transactions = JSON.parse(localStorage.getItem('pos_transactions') || '[]');\n\n\/\/ --------- DOM refs ---------\nconst listEl = document.getElementById('product-list');\nconst cartItemsEl = document.getElementById('cart-items');\nconst cartTotalEl = document.getElementById('cart-total');\nconst itemCountEl = document.getElementById('item-count');\nconst searchInput = document.getElementById('searchInput');\nconst suggestions = document.getElementById('suggestions');\nconst completeOrderBtn = document.getElementById('complete-order');\nconst printReceiptBtn = document.getElementById('print-receipt');\nconst receiptSection = document.getElementById('receipt-section');\nconst receiptEl = document.getElementById('receipt');\nconst sendWhatsappBtn = document.getElementById('send-whatsapp');\nconst whatsappInput = document.getElementById('whatsappNumber');\nconst closeReceiptBtn = document.getElementById('close-receipt');\nconst resetCartBtn = document.getElementById('reset-cart'); \/\/ New reset button\nconst loginBtn = document.getElementById('login-btn');\nconst logoutBtn = document.getElementById('logout-btn');\nconst loginModal = document.getElementById('login-modal');\nconst usernameInput = document.getElementById('username');\nconst passwordInput = document.getElementById('password');\nconst submitLoginBtn = document.getElementById('submit-login');\nconst loginError = document.getElementById('login-error');\nconst employeeInfo = document.getElementById('employee-info');\nconst employeeName = document.getElementById('employee-name');\nconst databaseBtn = document.getElementById('database-btn');\nconst databaseModal = document.getElementById('database-modal');\nconst databaseStats = document.getElementById('database-stats');\nconst databaseTableBody = document.getElementById('database-table-body');\nconst exportAllBtn = document.getElementById('export-all');\nconst printDbBtn = document.getElementById('print-db');\nconst closeDbBtn = document.getElementById('close-db');\n\n\/\/ --------- Utility ---------\nconst debounce = (fn, t=220)=>{let timeout; return (...args)=>{clearTimeout(timeout); timeout=setTimeout(()=>fn(...args),t);}};\nconst formatINR = n => '\u20b9'+Number(n).toFixed(0);\nconst getTotalQuantity = ()=>cart.reduce((s,i)=>s+i.qty,0);\nconst getTotalAmount = ()=>cart.reduce((s,i)=>s+i.price*i.qty,0);\n\n\/\/ Show feedback when item is added\nfunction showAddedFeedback(productName) {\n  const feedback = document.createElement('div');\n  feedback.className = 'added-feedback';\n  feedback.textContent = `\u2713 Added ${productName}`;\n  document.body.appendChild(feedback);\n  \n  setTimeout(() => {\n    feedback.remove();\n  }, 1500);\n}\n\n\/\/ Highlight product when added to cart\nfunction highlightProduct(index) {\n  const cards = document.querySelectorAll('.card');\n  if (cards[index]) {\n    const card = cards[index];\n    card.classList.add('highlighted');\n    \n    \/\/ Remove the highlight class after animation completes\n    setTimeout(() => {\n      card.classList.remove('highlighted');\n    }, 3000);\n  }\n}\n\n\/\/ Update quantity manually via input\nfunction updateQuantityManually(name, newQty) {\n  if (!isLoggedIn) return;\n  \n  const it = cart.find(x => x.name === name);\n  if (!it) return;\n  \n  \/\/ Convert to number and validate\n  newQty = parseInt(newQty);\n  if (isNaN(newQty) || newQty < 0) {\n    newQty = 0;\n  }\n  \n  if (newQty === 0) {\n    \/\/ Remove item if quantity is 0\n    cart = cart.filter(x => x.name !== name);\n  } else {\n    \/\/ Update quantity\n    it.qty = newQty;\n  }\n  \n  renderCart();\n  resetLogoutTimer();\n}\n\n\/\/ --------- Employee Authentication ---------\nfunction checkLoginStatus() {\n  if (isLoggedIn && currentEmployee) {\n    loginBtn.style.display = 'none';\n    logoutBtn.style.display = 'block';\n    databaseBtn.style.display = 'block';\n    employeeInfo.style.display = 'flex';\n    employeeName.textContent = currentEmployee;\n    loginModal.style.display = 'none';\n    resetLogoutTimer();\n  } else {\n    loginBtn.style.display = 'block';\n    logoutBtn.style.display = 'none';\n    databaseBtn.style.display = 'none';\n    employeeInfo.style.display = 'none';\n    loginModal.style.display = 'none';\n  }\n}\n\nfunction login(username, password) {\n  const employee = employeeCredentials[username];\n  if (employee && employee.password === password) {\n    isLoggedIn = true;\n    currentEmployee = employee.name;\n    localStorage.setItem('pos_logged_in', 'true');\n    localStorage.setItem('pos_employee_name', currentEmployee);\n    loginModal.style.display = 'none';\n    loginBtn.style.display = 'none';\n    logoutBtn.style.display = 'block';\n    databaseBtn.style.display = 'block';\n    employeeInfo.style.display = 'flex';\n    employeeName.textContent = currentEmployee;\n    resetLogoutTimer();\n    loginError.style.display = 'none';\n    usernameInput.value = '';\n    passwordInput.value = '';\n  } else {\n    loginError.style.display = 'block';\n  }\n}\n\nfunction logout() {\n  \/\/ Save all data before logout\n  saveDatabase();\n  \n  isLoggedIn = false;\n  currentEmployee = '';\n  localStorage.setItem('pos_logged_in', 'false');\n  localStorage.removeItem('pos_employee_name');\n  loginBtn.style.display = 'block';\n  logoutBtn.style.display = 'none';\n  databaseBtn.style.display = 'none';\n  employeeInfo.style.display = 'none';\n  clearCart();\n  clearTimeout(logoutTimer);\n  loginModal.style.display = 'none';\n  \n  \/\/ Show confirmation message\n  alert('You have been logged out successfully. All data has been saved.');\n}\n\nfunction resetLogoutTimer() {\n  clearTimeout(logoutTimer);\n  logoutTimer = setTimeout(()=>{\n    \/\/ Only auto-logout for inactivity, not when user manually logs out\n    if (isLoggedIn) {\n      isLoggedIn = false;\n      currentEmployee = '';\n      localStorage.setItem('pos_logged_in', 'false');\n      localStorage.removeItem('pos_employee_name');\n      loginBtn.style.display = 'block';\n      logoutBtn.style.display = 'none';\n      databaseBtn.style.display = 'none';\n      employeeInfo.style.display = 'none';\n      alert('Session expired due to inactivity. Please log in again.');\n    }\n  }, LOGOUT_TIME);\n}\n\n\/\/ --------- Database Functions ---------\nfunction saveDatabase() {\n  localStorage.setItem('pos_transactions', JSON.stringify(transactions));\n  localStorage.setItem('pos_order_number', String(orderNumber));\n  console.log('Database saved successfully');\n}\n\nfunction saveTransaction() {\n  if (cart.length === 0) return;\n  \n  const {date, time} = getCurrentDateTime();\n  const payment = document.querySelector('input[name=\"payment\"]:checked').value;\n  const total = getTotalAmount();\n  \n  const transaction = {\n    orderNumber: String(orderNumber).padStart(4, '0'),\n    date,\n    time,\n    items: [...cart],\n    total,\n    payment,\n    employee: currentEmployee\n  };\n  \n  transactions.push(transaction);\n  saveDatabase();\n}\n\nfunction loadDatabase() {\n  \/\/ Calculate stats\n  const totalOrders = transactions.length;\n  const totalRevenue = transactions.reduce((sum, t) => sum + t.total, 0);\n  const cashOrders = transactions.filter(t => t.payment === 'cash').length;\n  const digitalOrders = transactions.filter(t => t.payment === 'paytm').length;\n  \n  \/\/ Update stats display\n  databaseStats.innerHTML = `\n    <div class=\"stat-card\">\n      <div class=\"value\">${totalOrders}<\/div>\n      <div class=\"label\">Total Orders<\/div>\n    <\/div>\n    <div class=\"stat-card\">\n      <div class=\"value\">${formatINR(totalRevenue)}<\/div>\n      <div class=\"label\">Total Revenue<\/div>\n    <\/div>\n    <div class=\"stat-card\">\n      <div class=\"value\">${cashOrders}<\/div>\n      <div class=\"label\">Cash Orders<\/div>\n    <\/div>\n    <div class=\"stat-card\">\n      <div class=\"value\">${digitalOrders}<\/div>\n      <div class=\"label\">Digital Orders<\/div>\n    <\/div>\n  `;\n  \n  \/\/ Update table\n  databaseTableBody.innerHTML = '';\n  transactions.slice().reverse().forEach(transaction => {\n    const row = document.createElement('tr');\n    row.innerHTML = `\n      <td>${transaction.orderNumber}<\/td>\n      <td>${transaction.date}<\/td>\n      <td>${transaction.time}<\/td>\n      <td>${transaction.items.map(item => `${item.name} (x${item.qty})`).join(', ')}<\/td>\n      <td>${formatINR(transaction.total)}<\/td>\n      <td>${transaction.payment.toUpperCase()}<\/td>\n      <td>${transaction.employee}<\/td>\n    `;\n    databaseTableBody.appendChild(row);\n  });\n}\n\nfunction exportAllData() {\n  if (transactions.length === 0) {\n    alert('No data to export');\n    return;\n  }\n  \n  \/\/ Create CSV content\n  let csvContent = 'Order #,Date,Time,Items,Total,Payment,Employee\\n';\n  \n  transactions.forEach(transaction => {\n    const itemsString = transaction.items.map(item => `${item.name} (x${item.qty})`).join('; ');\n    csvContent += `\"${transaction.orderNumber}\",\"${transaction.date}\",\"${transaction.time}\",\"${itemsString}\",\"${transaction.total}\",\"${transaction.payment}\",\"${transaction.employee}\"\\n`;\n  });\n  \n  \/\/ Create and download file\n  const blob = new Blob([csvContent], { type: 'text\/csv;charset=utf-8;' });\n  const url = URL.createObjectURL(blob);\n  const a = document.createElement('a');\n  a.href = url;\n  a.download = `gurman_sales_${new Date().toISOString().split('T')[0]}.csv`;\n  document.body.appendChild(a);\n  a.click();\n  document.body.removeChild(a);\n  URL.revokeObjectURL(url);\n}\n\nfunction printDatabase() {\n  \/\/ Save database before printing\n  saveDatabase();\n  \n  \/\/ Open print dialog for the database modal\n  window.print();\n}\n\n\/\/ --------- Rendering ---------\nfunction renderProducts(list = products){\n  listEl.innerHTML='';\n  const frag = document.createDocumentFragment();\n  list.forEach((p, index)=>{\n    const card = document.createElement('div'); \n    card.className='card';\n    card.setAttribute('data-index', index);\n    card.innerHTML = `\n      <div class=\"quick-add\">+<\/div>\n      <img decoding=\"async\" loading=\"lazy\" src=\"${p.image}\" alt=\"${p.name}\" onerror=\"this.src='data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjEyMCIgdmlld0JveD0iMCAwIDIwMCAxMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHdpZHRoPSIyMDAiIGhlaWdodD0iMTIwIiBmaWxsPSIjRjVGNUY1Ii8+CjxwYXRoIGQ9Ik04MCA1MEg2MFY3MEg4MFY1MFoiIGZpbGw9IiNEOEQ4RDgiLz4KPHBhdGggZD0iTTcwIDYwSDUwVjcwSDcwVjYwWiIgZmlsbD0iI0Q4RDhEOCIvPgo8L3N2Zz4K'\">\n      <h3>${p.name}<\/h3>\n      <p>${formatINR(p.price)}<\/p>\n      <button data-index=\"${index}\">Add to Cart<\/button>`;\n    frag.appendChild(card);\n  });\n  listEl.appendChild(frag);\n}\n\nfunction renderCart(){\n  cartItemsEl.innerHTML='';\n  \n  if (cart.length === 0) {\n    cartItemsEl.innerHTML = `\n      <div class=\"empty-cart\">\n        <p>Your cart is empty<\/p>\n        <p class=\"small\">Add items from the menu<\/p>\n      <\/div>`;\n  } else {\n    const frag=document.createDocumentFragment();\n    cart.forEach(item=>{\n      const div=document.createElement('div');\n      div.className='cart-item';\n      div.innerHTML = `\n        <img decoding=\"async\" src=\"${item.image}\" alt=\"${item.name}\" onerror=\"this.src='data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNTYiIHZpZXdCb3g9IjAgMCA1NiA1NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjU2IiBoZWlnaHQ9IjU2IiBmaWxsPSIjRjVGNUY1Ii8+CjxwYXRoIGQ9Ik0yOCAyOEgyNFYzMkgyOFYyOFoiIGZpbGw9IiNEOEQ4RDgiLz4KPHBhdGggZD0iTTMyIDI4SDI0VjMySDMyVjI4WiIgZmlsbD0iI0Q4RDhEOCIvPgo8L3N2Zz4K'\">\n        <div style=\"flex:1\">\n          <div style=\"font-weight:600\">${item.name}<\/div>\n          <div class=\"small\">${formatINR(item.price)} each<\/div>\n        <\/div>\n        <div class=\"qty-btns\">\n          <button data-action=\"dec\" data-name=\"${item.name}\">\u2212<\/button>\n          <input type=\"number\" class=\"qty-input\" value=\"${item.qty}\" min=\"0\" max=\"99\" data-name=\"${item.name}\" inputmode=\"numeric\">\n          <button data-action=\"inc\" data-name=\"${item.name}\">+<\/button>\n          <button data-action=\"rem\" data-name=\"${item.name}\" title=\"Remove\" style=\"margin-left:6px;background:#ff6b6b;color:#fff;border-radius:6px;padding:6px\">\u2715<\/button>\n        <\/div>`;\n      frag.appendChild(div);\n    });\n    cartItemsEl.appendChild(frag);\n    \n    \/\/ Add event listeners for quantity inputs\n    const qtyInputs = cartItemsEl.querySelectorAll('.qty-input');\n    qtyInputs.forEach(input => {\n      input.addEventListener('change', (e) => {\n        const name = e.target.dataset.name;\n        const newQty = parseInt(e.target.value);\n        updateQuantityManually(name, newQty);\n      });\n      \n      input.addEventListener('blur', (e) => {\n        const name = e.target.dataset.name;\n        const newQty = parseInt(e.target.value);\n        if (isNaN(newQty) || newQty < 0) {\n          e.target.value = '0';\n          updateQuantityManually(name, 0);\n        }\n      });\n    });\n  }\n  \n  cartTotalEl.textContent = 'Total ' + formatINR(getTotalAmount());\n  itemCountEl.textContent = getTotalQuantity();\n  completeOrderBtn.disabled = getTotalQuantity() === 0;\n  printReceiptBtn.disabled = getTotalQuantity() === 0;\n}\n\n\/\/ --------- Actions ---------\nfunction addToCart(index){\n  if (!isLoggedIn) {\n    alert('Please log in to add items to cart');\n    return;\n  }\n  const p = products[index];\n  if(!p) return;\n  const existing = cart.find(i=>i.name===p.name);\n  if(existing) existing.qty++;\n  else cart.push({...p, qty:1});\n  renderCart();\n  resetLogoutTimer();\n  showAddedFeedback(p.name);\n  highlightProduct(index); \/\/ Add highlight effect\n}\n\nfunction changeQty(name, delta){\n  if (!isLoggedIn) return;\n  const it = cart.find(x=>x.name===name); \n  if(!it) return;\n  it.qty += delta; \n  if(it.qty<=0) cart = cart.filter(x=>x.name!==name);\n  renderCart();\n  resetLogoutTimer();\n}\n\nfunction removeItem(name){ \n  if (!isLoggedIn) return;\n  cart = cart.filter(x=>x.name!==name); \n  renderCart(); \n  resetLogoutTimer();\n}\n\nfunction clearCart(){ \n  cart=[]; \n  renderCart(); \n  receiptSection.style.display='none'; \n}\n\nfunction resetCart() {\n  if (cart.length === 0) {\n    alert('Cart is already empty!');\n    return;\n  }\n  \n  if (confirm('Are you sure you want to reset the cart? All items will be removed.')) {\n    clearCart();\n    alert('Cart has been reset successfully!');\n  }\n}\n\nfunction getCurrentDateTime(){ \n  const now=new Date(); \n  return { \n    date: now.toLocaleDateString('en-IN'), \n    time: now.toLocaleTimeString('en-IN',{hour:'2-digit',minute:'2-digit'}) \n  }; \n}\n\nfunction buildReceiptText(){\n  const {date,time} = getCurrentDateTime();\n  const payment = document.querySelector('input[name=\"payment\"]:checked').value.toUpperCase();\n  let lines = [];\n  lines.push('GURMAN BAKE STUDIO');\n  lines.push('FSSAI: 22125020001544');\n  lines.push('Order #: ' + String(orderNumber).padStart(4,'0'));\n  lines.push('Date: ' + date + '  Time: ' + time);\n  lines.push('Payment: ' + payment);\n  lines.push('Employee: ' + currentEmployee);\n  lines.push('------------------------------');\n  cart.forEach(it=> lines.push(`${it.name} x${it.qty}  ${formatINR(it.price*it.qty)}`));\n  lines.push('------------------------------');\n  lines.push('TOTAL: ' + formatINR(getTotalAmount()));\n  lines.push('Thank you!');\n  lines.push('\ud83c\udf10 gurmanbakestudio.com | \ud83d\udcde 9888190913');\n  return lines.join('\\n');\n}\n\nfunction buildFormalWhatsAppMessage(){\n  const {date,time} = getCurrentDateTime();\n  const payment = document.querySelector('input[name=\"payment\"]:checked').value.toUpperCase();\n  let message = [];\n  message.push(`*GURMAN BAKE STUDIO*`);\n  message.push(`FSSAI: 22125020001544`);\n  message.push(``);\n  message.push(`*Order Confirmation*`);\n  message.push(`Order #: ${String(orderNumber).padStart(4,'0')}`);\n  message.push(`Date: ${date}`);\n  message.push(`Time: ${time}`);\n  message.push(`Payment Method: ${payment}`);\n  message.push(`Served by: ${currentEmployee}`);\n  message.push(``);\n  message.push(`*Order Details:*`);\n  cart.forEach(it=> message.push(`\u2022 ${it.name} x${it.qty} - ${formatINR(it.price*it.qty)}`));\n  message.push(``);\n  message.push(`*Total Amount: ${formatINR(getTotalAmount())}*`);\n  message.push(``);\n  message.push(`Thank you for your order!`);\n  message.push(`We appreciate your business.`);\n  message.push(``);\n  message.push(`For any queries, contact us at:`);\n  message.push(`\ud83d\udcde 9888190913`);\n  message.push(`\ud83c\udf10 gurmanbakestudio.com`);\n  return message.join('\\n');\n}\n\nfunction showReceipt(){\n  if(getTotalQuantity()===0) return;\n  const txt = buildReceiptText();\n  receiptEl.textContent = txt;\n  receiptSection.style.display='block';\n  \n  \/\/ Scroll to receipt section\n  receiptSection.scrollIntoView({behavior:'smooth'});\n}\n\nfunction generateReceipt(){\n  if(getTotalQuantity()===0) return;\n  \n  \/\/ Save transaction to database\n  saveTransaction();\n  \n  \/\/ Show receipt\n  showReceipt();\n  \n  \/\/ Increment order number\n  orderNumber++;\n  localStorage.setItem('pos_order_number', String(orderNumber));\n}\n\n\/\/ Print receipt\nfunction printReceipt(){\n  if(getTotalQuantity()===0) return;\n  \n  \/\/ Save transaction to database\n  saveTransaction();\n  \n  \/\/ Show receipt\n  showReceipt();\n  \n  \/\/ Auto-download receipt\n  downloadReceipt();\n  \n  \/\/ Increment order number\n  orderNumber++;\n  localStorage.setItem('pos_order_number', String(orderNumber));\n  \n  \/\/ Clear cart after printing\n  clearCart();\n}\n\n\/\/ Download as .txt and as .html (open in new tab)\nfunction downloadReceipt(){\n  if(getTotalQuantity()===0) return;\n  const txt = buildReceiptText();\n  const blob = new Blob([txt], {type:'text\/plain'});\n  const url = URL.createObjectURL(blob);\n  const a = document.createElement('a'); \n  a.href=url; \n  a.download = `receipt_${Date.now()}.txt`; \n  document.body.appendChild(a); \n  a.click(); \n  a.remove(); \n  URL.revokeObjectURL(url);\n  const html = `<html><head><meta charset=\"utf-8\"><title>Receipt<\/title><\/head><body><pre style=\"font-family:monospace\">${escapeHtml(txt)}<\/pre><\/body><\/html>`;\n  const blob2 = new Blob([html], {type:'text\/html'});\n  const url2 = URL.createObjectURL(blob2);\n  window.open(url2, '_blank');\n}\n\nfunction escapeHtml(str){ \n  return str.replace(\/&\/g,'&amp;').replace(\/<\/g,'&lt;').replace(\/>\/g,'&gt;'); \n}\n\nfunction sendViaWhatsApp(){\n  if(getTotalQuantity()===0) return alert('Add items to cart first');\n  const numRaw = whatsappInput.value.trim();\n  if(!numRaw) return alert('Enter customer WhatsApp number including country code (e.g. 919888190913)');\n  \n  \/\/ Enhanced WhatsApp number validation\n  const digits = numRaw.replace(\/\\D\/g,'');\n  \n  \/\/ Check if number starts with country code, if not assume it's Indian number\n  let finalNumber = digits;\n  if (digits.length === 10) {\n    \/\/ Indian number without country code\n    finalNumber = '91' + digits;\n  } else if (digits.startsWith('0')) {\n    \/\/ Number starting with 0, remove it and add 91\n    finalNumber = '91' + digits.substring(1);\n  } else if (digits.length >= 8 && digits.length <= 15) {\n    \/\/ Valid international number\n    finalNumber = digits;\n  } else {\n    return alert('Please enter a valid phone number (8-15 digits)');\n  }\n  \n  const txt = buildFormalWhatsAppMessage();\n  const encoded = encodeURIComponent(txt);\n  const url = `https:\/\/wa.me\/${finalNumber}?text=${encoded}`;\n  \n  \/\/ Try to open in new tab, fallback to current tab\n  const newWindow = window.open(url, '_blank');\n  if (!newWindow || newWindow.closed || typeof newWindow.closed == 'undefined') {\n    window.location.href = url;\n  }\n}\n\n\/\/ Close receipt section\nfunction closeReceipt() {\n  receiptSection.style.display = 'none';\n  whatsappInput.value = '';\n}\n\n\/\/ --------- Events (delegation) ---------\n\/\/ Click on entire card or button to add to cart\ndocument.addEventListener('click', (e)=>{\n  const target = e.target;\n  \n  \/\/ Click on card (but not the button inside)\n  if(target.matches('.card') && !target.matches('button')) {\n    const index = Number(target.getAttribute('data-index'));\n    addToCart(index);\n  }\n  \n  \/\/ Click on card button\n  if(target.matches('.card button')){ \n    addToCart(Number(target.dataset.index)); \n  }\n  \n  \/\/ Cart quantity buttons\n  if(target.matches('[data-action]')){\n    const action = target.dataset.action;\n    const name = target.dataset.name;\n    if(action==='dec') changeQty(name, -1);\n    if(action==='inc') changeQty(name, +1);\n    if(action==='rem') removeItem(name);\n  }\n});\n\ncompleteOrderBtn.addEventListener('click', ()=>{\n  if(getTotalQuantity()===0) return;\n  generateReceipt();\n});\n\nprintReceiptBtn.addEventListener('click', ()=>{\n  if(getTotalQuantity()===0) return;\n  printReceipt();\n});\n\nsendWhatsappBtn.addEventListener('click', sendViaWhatsApp);\n\ncloseReceiptBtn.addEventListener('click', closeReceipt);\n\nresetCartBtn.addEventListener('click', resetCart); \/\/ New reset cart event listener\n\n\/\/ Authentication events\nloginBtn.addEventListener('click', () => {\n  loginModal.style.display = 'flex';\n  usernameInput.focus();\n});\n\nlogoutBtn.addEventListener('click', logout);\n\nsubmitLoginBtn.addEventListener('click', () => {\n  login(usernameInput.value, passwordInput.value);\n});\n\n\/\/ Database events\ndatabaseBtn.addEventListener('click', () => {\n  loadDatabase();\n  databaseModal.style.display = 'flex';\n});\n\ncloseDbBtn.addEventListener('click', () => {\n  databaseModal.style.display = 'none';\n});\n\nexportAllBtn.addEventListener('click', exportAllData);\n\nprintDbBtn.addEventListener('click', printDatabase);\n\n\/\/ Close modal when clicking outside\nloginModal.addEventListener('click', (e) => {\n  if (e.target === loginModal) {\n    loginModal.style.display = 'none';\n    loginError.style.display = 'none';\n  }\n});\n\ndatabaseModal.addEventListener('click', (e) => {\n  if (e.target === databaseModal) {\n    databaseModal.style.display = 'none';\n  }\n});\n\n\/\/ Login on enter key\npasswordInput.addEventListener('keypress', (e) => {\n  if (e.key === 'Enter') {\n    login(usernameInput.value, passwordInput.value);\n  }\n});\n\n\/\/ Suggestions: debounce search\nfunction showSuggestions(q){\n  const val = q.trim().toLowerCase();\n  if(!val){ suggestions.style.display='none'; renderProducts(); return; }\n  const matches = products.filter(p=>p.name.toLowerCase().includes(val));\n  if(matches.length===0){ suggestions.style.display='none'; renderProducts(); return; }\n  suggestions.innerHTML = matches.map(m=>`<div class=\"suggestion-item\" data-name=\"${escapeHtml(m.name)}\"><img decoding=\"async\" src=\"${m.image}\" onerror=\"this.src='data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIHZpZXdCb3g9IjAgMCA0NiA0NiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjQ2IiBoZWlnaHQ9IjQ2IiBmaWxsPSIjRjVGNUY1Ii8+CjxwYXRoIGQ9Ik0yMyAyM0gyMFYyNkgyM1YyM1oiIGZpbGw9IiNEOEQ4RDgiLz4KPHBhdGggZD0iTTI2IDIzSDIwVjI2SDI2VjIzWiIgZmlsbD0iI0Q4RDhEOCIvPgo8L3N2Zz4+'\"><div><div style=\"font-weight:600\">${escapeHtml(m.name)}<\/div><div class=\"small\">${formatINR(m.price)}<\/div><\/div><\/div>`).join('');\n  suggestions.style.display='block';\n}\nsearchInput.addEventListener('input', debounce(e=>showSuggestions(e.target.value), 180));\n\n\/\/ click suggestion - FIXED: Reset to show all products after selection\nsuggestions.addEventListener('click', (e)=>{ \n  const it = e.target.closest('.suggestion-item'); \n  if(!it) return; \n  const name = it.dataset.name; \n  const match = products.find(p=>p.name===name); \n  if(match) {\n    \/\/ Find the index of the matched product\n    const index = products.findIndex(p => p.name === name);\n    \/\/ Add the product to cart\n    addToCart(index);\n    \/\/ Reset to show all products\n    renderProducts();\n  }\n  suggestions.style.display='none'; \n  searchInput.value=''; \n  document.querySelector('.products-section').scrollIntoView({behavior:'smooth'}); \n});\n\n\/\/ hide suggestions when clicking outside search bar\ndocument.addEventListener('click', (e)=>{ \n  if(!e.target.closest('.search-bar')) suggestions.style.display='none'; \n});\n\n\/\/ init\ncheckLoginStatus();\nrenderProducts(); \nrenderCart();\n\n\/\/ Accessibility: keyboard enter on search to focus first match\nsearchInput.addEventListener('keydown', (e)=>{ \n  if(e.key==='Enter'){ \n    const q=e.target.value.trim().toLowerCase(); \n    const m = products.find(p=>p.name.toLowerCase().includes(q)); \n    if(m){ \n      \/\/ Find the index of the matched product\n      const index = products.findIndex(p => p.name === m.name);\n      \/\/ Add the product to cart\n      addToCart(index);\n      \/\/ Reset to show all products\n      renderProducts();\n      searchInput.value=''; \n      suggestions.style.display='none'; \n    } \n  } \n});\n\n\/\/ keep order number persistent\nwindow.addEventListener('beforeunload', ()=>{ \n  saveDatabase();\n});\n\n\/\/ Reset logout timer on user activity\ndocument.addEventListener('click', resetLogoutTimer);\ndocument.addEventListener('keydown', resetLogoutTimer);\ndocument.addEventListener('mousemove', resetLogoutTimer);\n\n\/\/ Handle page visibility changes (tab switching)\ndocument.addEventListener('visibilitychange', () => {\n  if (!document.hidden && isLoggedIn) {\n    resetLogoutTimer();\n  }\n});\n\n\/\/ iOS specific optimizations\nif (\/iPad|iPhone|iPod\/.test(navigator.userAgent)) {\n  document.body.classList.add('ios-device');\n  \n  \/\/ Prevent elastic scrolling on body\n  document.addEventListener('touchmove', function(e) {\n    if (e.target === document.documentElement || e.target === document.body) {\n      e.preventDefault();\n    }\n  }, { passive: false });\n}\n<\/script>\n\n<!-- Footer Section -->\n<footer style=\"\n  background: #f9f9fb;\n  border-top: 1px solid #e5e5ea;\n  box-shadow: 0 -4px 20px rgba(0,0,0,0.06);\n  padding: 60px 20px;\n  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif;\n  color: #1d1d1f;\n  border-radius: 24px;\n\">\n  <div style=\"max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px;\">\n\n    <!-- Left Section: Production & Marketing -->\n    <div style=\"flex: 1; min-width: 240px;\">\n      <h3 style=\"font-weight: 700; font-size: 1.2rem; margin-bottom: 12px; letter-spacing: -0.01em; color:#1d1d1f;\">\n        Production & Marketing\n      <\/h3>\n      <p style=\"font-size: 0.95rem; color: #4b4b4f; line-height: 1.7;\">\n        <strong>Gurman Marketing Pvt. Ltd.<\/strong><br>\n        Jalandhar, Punjab, India \ud83c\uddee\ud83c\uddf3\n      <\/p>\n      <hr style=\"border:none; height:1px; background:#e5e5ea; margin:16px 0;\">\n      <p style=\"font-size: 0.9rem; color:#6e6e73; margin:4px 0;\">\ud83d\udcde +91 98881 90913<\/p>\n      <p style=\"font-size: 0.9rem; color:#6e6e73;\">\u2709\ufe0f info@gurmanbakestudio.com<\/p>\n    <\/div>\n\n    <!-- Right Section: About the Creator -->\n    <div style=\"flex: 1; min-width: 240px; text-align: right; padding-left: 20px;\">\n      <h3 style=\"font-weight: 700; font-size: 1.2rem; margin-bottom: 12px; letter-spacing: -0.01em;\">\n        About the Creator\n      <\/h3>\n      <p style=\"font-size: 0.95rem; color: #4b4b4f; line-height: 1.7; margin-bottom: 16px;\">\n        Gurmanpreet Singh, MS, Ph.D (Germany), focuses on Quality, Production, and Digital Marketing. Learn more at \n        <a href=\"https:\/\/adsbox.in\" style=\"color:#007aff; text-decoration:none;\" \n           onmouseover=\"this.style.color='#0056cc'\" \n           onmouseout=\"this.style.color='#007aff'\">adsbox.in<\/a>.\n      <\/p>\n      <hr style=\"border:none; height:1px; background:#e5e5ea; margin:16px 0;\">\n      <p style=\"font-size: 0.85rem; color:#6e6e73;\">\n        Designed & developed with precision in Jalandhar, India \ud83c\uddee\ud83c\uddf3\n      <\/p>\n      <p style=\"font-size: 0.85rem; font-weight:600; color:#86868b; margin-top:4px;\">\n        \u00a9 2025 Gurman Marketing. All rights reserved.\n      <\/p>\n    <\/div>\n\n  <\/div>\n<\/footer>\n\n\n<!-- Load GA script asynchronously -->\n<script async src=\"https:\/\/www.googletagmanager.com\/gtag\/js?id=G-6S0PW76231\"><\/script>\n\n<!-- Secret Content (Hidden) -->\n<div id=\"hiddenContent\" style=\"display:none;\"><\/div>\n\n<script>\n(function () {\n  \/\/ ========== 1. Hidden Secret Message ==========\n  const secret = \"Hello, this is secret content.\";\n  \/\/ Optionally store in memory, but don't display\n  \/\/ document.getElementById(\"hiddenContent\").innerText = secret;\n\n  \/\/ ========== 2. Disable Right Click & Copy ==========\n  const blockEvent = (e, msg) => {\n    e.preventDefault();\n    console.warn(msg || \"Action blocked.\");\n  };\n\n  document.addEventListener(\"contextmenu\", e => blockEvent(e, \"Right-click disabled.\"));\n  document.addEventListener(\"copy\", e => blockEvent(e, \"Copying disabled.\"));\n\n  \/\/ ========== 3. Disable Text Selection Globally ==========\n  document.addEventListener(\"DOMContentLoaded\", () => {\n    const style = document.createElement(\"style\");\n    style.textContent = `\n      * {\n        user-select: none !important;\n        -webkit-user-select: none !important;\n        -moz-user-select: none !important;\n        -ms-user-select: none !important;\n      }\n    `;\n    document.head.appendChild(style);\n  });\n\n  \/\/ ========== 4. Block Common DevTools Shortcuts ==========\n  document.addEventListener(\"keydown\", e => {\n    const key = e.key.toUpperCase();\n    if (\n      e.key === \"F12\" ||\n      (e.ctrlKey && e.shiftKey && [\"I\", \"J\", \"C\"].includes(key)) ||\n      (e.ctrlKey && [\"U\", \"S\"].includes(key))\n    ) {\n      blockEvent(e, \"DevTools or source view blocked.\");\n    }\n  });\n\n  \/\/ ========== 5. Detect Open DevTools ==========\n  const detector = new Image();\n  let devToolsDetected = false;\n\n  Object.defineProperty(detector, \"id\", {\n    get() {\n      devToolsDetected = true;\n      throw new Error(\"DevTools Detected\");\n    }\n  });\n\n  setInterval(() => {\n    devToolsDetected = false;\n    console.dir(detector);\n    if (devToolsDetected) {\n      console.error(\"DevTools is open! Blocking access...\");\n      \/\/ Optionally blank or redirect:\n      \/\/ window.location.replace(\"about:blank\");\n    }\n  }, 1000);\n\n  \/\/ ========== 6. Block PrintScreen Key ==========\n  window.addEventListener(\"keyup\", e => {\n    if (e.key === \"PrintScreen\") {\n      navigator.clipboard.writeText(\"Screenshot blocked.\");\n      console.warn(\"Screenshot attempt detected and blocked.\");\n    }\n  });\n\n})();\n<\/script>\n\n\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n  try {\n    if (!sessionStorage.getItem(\"refreshedOnce\")) {\n      sessionStorage.setItem(\"refreshedOnce\", \"true\");\n      \/\/ Refresh the page immediately\n      window.location.reload();\n    }\n  } catch (e) {\n    console.warn(\"Session storage unavailable. Skipping auto-refresh.\");\n  }\n});\n<\/script>\n<script>(function(){\n  const paramName = \"page_id\";\n  const paramValue = \"812\";\n  \n  const url = new URL(window.location.href);\n  if (url.searchParams.get(paramName) === paramValue) {\n    url.searchParams.delete(paramName);\n    \/\/ Use history API to update URL without reload\n    window.history.replaceState(history.state, \"\", url.pathname + url.search + url.hash);\n  }\n})();\n<\/script>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-812","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=\/wp\/v2\/pages\/812","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=812"}],"version-history":[{"count":23,"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=\/wp\/v2\/pages\/812\/revisions"}],"predecessor-version":[{"id":845,"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=\/wp\/v2\/pages\/812\/revisions\/845"}],"wp:attachment":[{"href":"https:\/\/www.gurmanbakestudio.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=812"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}