
:root{
  --bg:#f6f7fb;
  --card:#ffffff;
  --txt:#111827;
  --muted:#6b7280;
  --accent:#1b5e20;
  --danger:#b00020;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--txt);font-family:system-ui,-apple-system,'Segoe UI',Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans Arabic','Noto Kufi Arabic',sans-serif}
.app{display:flex;flex-direction:column;min-height:100vh}
.topbar{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--card);box-shadow:0 2px 8px rgba(0,0,0,.04)}
.logo{height:42px}
.brand-title{font-weight:800;font-size:18px}
.brand-tagline{font-size:12px;color:var(--muted)}

.content{flex:1;display:flex;align-items:center;justify-content:center;padding:12px}
.result{display:flex;gap:12px;align-items:center;justify-content:center;background:var(--card);border-radius:20px;padding:16px;box-shadow:0 8px 28px rgba(0,0,0,.08);width:100%;max-width:860px}
.product-image{width:38vw;max-width:280px;min-width:160px;aspect-ratio:1;border-radius:16px;background:#f0f3f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.product-image img{max-width:100%;max-height:100%;object-fit:contain}
.product-info{flex:1;display:flex;flex-direction:column;gap:8px}
.pname{font-size:5vw;line-height:1.1;font-weight:800}
.pbarcode{color:var(--muted);font-weight:600}
.price-wrap{display:flex;align-items:baseline;gap:12px}
.price{font-size:9vw;line-height:1;font-weight:900;color:var(--accent)}
.old-price{text-decoration:line-through;color:var(--muted);font-size:5vw}

.footer{padding:8px;text-align:center;color:var(--muted);font-size:14px}

#scanInput{position:fixed;opacity:.001;pointer-events:none}

.ads{display:grid;place-items:center;width:100%;max-width:900px;aspect-ratio:16/9;background:#e8f5e9;border-radius:20px;box-shadow:0 8px 28px rgba(0,0,0,.06);overflow:hidden}
.ads img, .ads svg{width:100%;height:100%;object-fit:cover}

.hidden{display:none}

@media (max-width:700px){
  .pname{font-size:26px}
  .price{font-size:46px}
  .old-price{font-size:22px}
  .product-image{width:45vw}
}


/* Centered logo only */
.topbar { justify-content: center; }
.topbar .brand { display: none; }
.logo { height: 56px; } /* كبر/صغر حسب مزاجك */


.brand-center{display:flex;flex-direction:column;align-items:center;gap:4px}
.topbar{justify-content:center}
.brand-tagline{font-size:12px;color:var(--muted)}
