:root{
  --green:#0b6b39;
  --dark:#064826;
  --gold:#d4af37;
  --muted:#f7faf6;
  --accent:#25D366;
  --discount:#e60023;
  --card-shadow: 0 8px 26px rgba(0,0,0,0.06);
  --rounded: 10px;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;padding:0;font-family:"Noto Nastaliq Urdu","Noto Sans",system-ui,sans-serif;direction:rtl;text-align:right;background:var(--muted);color:#111}
.topbar{background:linear-gradient(90deg,var(--green),var(--dark));padding:14px 12px;position:sticky;top:0;z-index:200}
.topbar-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:center}
.title{font-size:22px;color:#fff;font-weight:900}

/* ticker */
.ticker{background:#fff7e6;color:var(--dark);font-weight:700;border-bottom:3px solid var(--gold);padding:6px 0;overflow:hidden}
.ticker-track{display:flex;gap:40px;align-items:center;white-space:nowrap;will-change:transform}
.ticker-item{flex:0 0 auto;padding:0 8px;font-weight:700;color:var(--dark)}
@keyframes ticker-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.ticker-track.scrolling{animation:ticker-scroll 24s linear infinite}
@media (prefers-reduced-motion: reduce){ .ticker-track.scrolling{animation:none} .ticker-item{white-space:normal} }

/* hero */
.hero-min{position:relative;display:flex;align-items:center;justify-content:center;height:160px;background:linear-gradient(90deg,var(--green),#2a8a57);color:#fff}
.hero-img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;opacity:0.15}
.hero-title{position:relative;font-size:34px;font-weight:900;z-index:2}

/* categories */
.catbar{background:transparent;padding:10px 6px;border-bottom:1px solid rgba(0,0,0,0.04)}
.cat-scroll{display:flex;gap:8px;overflow:auto;padding:6px;white-space:nowrap}
.cat-btn{background:#fff;border:1px solid rgba(0,0,0,0.06);padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:700;min-width:120px}
.cat-btn.active{box-shadow:0 6px 18px rgba(11,107,57,0.12);border-color:rgba(0,0,0,0.06)}

/* items */
.main{max-width:1200px;margin:18px auto;padding:0 12px}
.items-grid{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.item-card{width:210px;background:#fff;border-radius:var(--rounded);box-shadow:var(--card-shadow);padding:10px;text-align:right;position:relative;border:1px solid rgba(0,0,0,0.04)}
.item-card img{display:block;width:100%;height:150px;object-fit:cover;border-radius:8px;margin-bottom:8px}
.item-card img.placeholder{background:#f2f2f2;display:flex;align-items:center;justify-content:center;color:#888;font-size:0.9rem;height:150px}
.item-card h4{margin:6px 0 4px;font-size:1rem;white-space:normal;word-break:break-word;line-height:1.2;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.price-row{display:flex;gap:8px;align-items:center;justify-content:center}
.old-price{text-decoration:line-through;color:#999;font-size:0.95rem}
.new-price{color:var(--green);font-weight:900;font-size:1.05rem}
.unit-label{font-size:0.85rem;color:#666;margin-top:6px;text-align:center}
.discount-tag{position:absolute;left:10px;top:10px;background:var(--discount);color:#fff;padding:4px 6px;border-radius:6px;font-weight:800;font-size:0.72rem}
.qty-input{width:72px;padding:6px;border-radius:6px;border:1px solid #ccc;text-align:center}
.add-btn{background:var(--green);color:#fff;border:none;padding:8px 10px;border-radius:8px;cursor:pointer}

/* cart & modal & footer */
.cart-panel{position:fixed;right:18px;bottom:18px;width:320px;border-radius:12px;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,0.12);z-index:300;overflow:hidden;transition:transform .28s ease,opacity .28s ease}
.cart-panel.minimized{transform:translateY(60%);opacity:0.95;width:120px}
.cart-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:linear-gradient(90deg,var(--green),var(--dark));color:#fff;font-weight:800}
.cart-body{padding:10px}
.cart-list{max-height:220px;overflow:auto;margin-bottom:8px;text-align:right}
.cart-summary{font-weight:800;text-align:left;margin-bottom:8px}
.cart-actions{display:flex;gap:8px;flex-direction:column;margin-top:8px}
.primary{background:var(--accent);color:#fff;border:none;padding:10px;border-radius:8px;cursor:pointer;font-weight:800}
.small{background:#f2f2f2;border:1px solid #ddd;padding:8px;border-radius:8px;cursor:pointer}
.modal{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.45);display:flex;align-items:center;justify-content:center;z-index:900}
.modal-card{width:420px;max-width:96%;background:#fff;border-radius:10px;padding:12px;text-align:right;direction:rtl}
.modal-h{display:flex;justify-content:space-between;align-items:center}
.modal-body input{width:100%;padding:8px;margin-top:8px;border-radius:8px;border:1px solid #ccc}
.site-footer{background:var(--dark);color:#fff;padding:18px 12px;margin-top:22px;text-align:center}
.site-footer a{color:#fff;text-decoration:underline}
.hidden{display:none}
@media (max-width:900px){
  .item-card{width:46%}
  .cart-panel.minimized{transform:translateY(70%);width:110px}
  .cart-panel{right:8px;left:8px;width:auto;bottom:12px}
}
