/* Burdogz storefront: compact food cards and product sheets inspired by the owner's reference. */
:root { --brand:#790f2b; --brand-dark:#520a1d; --cream:#fbf8f3; --text:#292329; --muted:#81777a; --surface:#f5f3f1; }
body { background:#fffdfa; color:var(--text); font-family:'Poppins','Cairo',sans-serif; padding-bottom:110px; }
[hidden] { display:none!important; }
button, input, select, textarea { font-family:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
button { touch-action:manipulation; }
:focus-visible { outline:3px solid #ba7911; outline-offset:3px; }
.skip-link { position:fixed; top:-100px; left:16px; z-index:100; background:var(--brand); color:white; padding:12px 18px; }
.skip-link:focus { top:8px; }
header { max-width:1120px; margin:auto; padding:18px 24px; min-height:88px; border:0; }
header .logo { height:52px; }
header .menu-btn { width:44px; height:44px; padding:0; border-radius:15px; background:#f2ecee; font-size:24px; }
header .lang-btn { border-radius:15px; padding:10px 16px; background:#f2ecee; color:var(--brand); font-size:12px; }
.cashback-band { background:#f4e8ec; color:var(--brand); font-size:12px; padding:10px 16px; letter-spacing:0; }
.closed-banner { font-size:12px; background:var(--brand); }
.active-strip { font-size:12px; }
.promo-wrap { max-width:960px; padding:20px 24px 0; }
.promo-frame { position:relative; overflow:hidden; border-radius:22px; background:#990000; }
.promo-banner { height:auto; border-radius:0; box-shadow:none; transform-origin:50% 50%; animation:banner-zoom 8s ease-in-out infinite alternate; animation-play-state:paused; }
.promo-frame[data-playing="true"] .promo-banner { animation-play-state:running; }
@keyframes banner-zoom { from { transform:scale(1); } to { transform:scale(1.035); } }
.banner-motion { position:absolute; bottom:8px; right:8px; width:40px; height:40px; display:grid; place-items:center; border:1px solid #ffffff60; border-radius:50%; background:#480817cc; color:#fff7e8; cursor:pointer; }
.banner-motion .play-icon { display:none; }
.banner-motion[data-paused="true"] .pause-icon { display:none; }
.banner-motion[data-paused="true"] .play-icon { display:block; }
.mode-wrap { padding:22px 20px 10px; scroll-margin-top:80px; }
.mode-toggle { border:0; border-radius:30px; background:#f0ebeb; padding:5px; box-shadow:none; }
.mode-toggle button { font-size:12px; padding:10px 30px; border-radius:24px; color:#85757b; }
.mode-toggle button.on { background:var(--brand); color:white; }
.menu-search-wrap { max-width:1120px; margin:10px auto 20px; padding:0 24px; }
.menu-search { display:flex; align-items:center; gap:10px; padding:0 16px; background:var(--surface); border:1px solid #eee8e8; border-radius:18px; min-height:52px; color:var(--muted); }
.menu-search:focus-within { border-color:#b98292; }
.menu-search input { width:100%; min-width:0; border:0; background:transparent; padding:14px 0; font-size:16px; color:var(--text); outline:none; }
.menu-search input::-webkit-search-cancel-button { -webkit-appearance:none; }
.menu-search svg { flex-shrink:0; }
.menu-search button { background:none; color:var(--brand); border:0; width:36px; height:36px; cursor:pointer; flex-shrink:0; }
.search-empty { padding:36px 0; text-align:center; font-size:14px; color:var(--muted); }
nav.cats { max-width:1072px; margin:0 auto; padding:12px 0; gap:8px; justify-content:flex-start; background:#fffdfa; backdrop-filter:none; -webkit-backdrop-filter:none; border:0; scroll-behavior:auto; }
nav.cats button { padding:12px 18px; border-radius:24px; font-size:12px; color:#6d6166; border:0; background:#f3f0ef; box-shadow:none; transition:background .15s; }
nav.cats button.active { background:var(--brand); box-shadow:none; color:white; }
main#menu { max-width:1120px; padding:0 24px 32px; }
h2.cat-title { margin:28px 0 16px; font-size:22px; font-weight:700; letter-spacing:-.5px; color:var(--text); text-transform:none; }
h2.cat-title::before, h2.cat-title::after { display:none; }
.menu-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.item { border-radius:22px; border:1px solid #f0ebea; box-shadow:none; background:var(--surface); display:grid; grid-template-columns:150px minmax(0,1fr); padding:12px; gap:14px; align-items:center; transition:border-color .15s; }
.item { position:relative; }
.item-open { position:absolute; inset:0; z-index:1; width:100%; height:100%; border:0; border-radius:inherit; background:transparent; cursor:pointer; }
.item-open:focus-visible { outline-offset:-3px; }
.item .p-add, .item .p-qty { position:relative; bottom:auto; inset-inline-end:auto; z-index:2; }
.simple-product-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; }
.simple-product-price { font-size:20px; font-weight:600; color:var(--brand); }
.simple-product-row .qty-ctrl button { width:38px; height:38px; }
.simple-product-row .qty-ctrl button:disabled { opacity:.35; cursor:default; }
.item:hover { transform:none; box-shadow:none; }
.item .photo { width:100%; height:150px; border:0; border-radius:16px; background:transparent; cursor:pointer; padding:0; }
.item .photo img { width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; }
.item .info { min-width:0; padding:6px 4px 6px 0; display:flex; flex-direction:column; align-self:stretch; justify-content:center; }
.item .name { font-size:15px; line-height:1.45; font-weight:600; }
.item .desc { font-size:11px; line-height:1.65; color:var(--muted); margin-top:6px; margin-bottom:0; -webkit-line-clamp:2; }
.item-bottom { display:flex; justify-content:space-between; align-items:center; gap:6px; margin-top:12px; flex-wrap:wrap; }
.item .price { font-size:13px; margin:0; padding:0; font-weight:600; color:var(--text); }
.p-add { position:static; width:34px; height:34px; border-radius:11px; background:var(--brand); box-shadow:none; font-weight:400; font-size:23px; flex-shrink:0; }
.p-qty { position:static; border-radius:11px; padding:2px; box-shadow:none; font-size:12px; gap:0; background:var(--brand); }
.p-qty button { width:30px; height:32px; }
.p-qty b { min-width:17px; text-align:center; }
.cart-bar { background:var(--brand); border-radius:18px; padding:17px 22px; font-size:13px; box-shadow:0 8px 25px #3c051926; border:0; bottom:max(20px,env(safe-area-inset-bottom)); }
.cart-bar b { font-size:14px; }
.mobile-nav { display:none; }
.sheet { background:#23151d80; }
.sheet .panel { background:#fffdfa; padding:30px 24px; overscroll-behavior:contain; }
.sheet-close { background:#f0e8ea; color:var(--brand); width:38px; height:38px; }
.panel h3 { font-size:23px; letter-spacing:-.5px; color:var(--text); padding-inline-end:30px; }
.primary-btn { background:var(--brand); box-shadow:none; border-radius:14px; font-size:14px; padding:16px; }
.primary-btn:hover:not(:disabled) { background:#951b3b; }
.panel input,.panel textarea,.panel select { border:1px solid #e9e2e3; border-radius:12px; background:#faf7f6; font-size:16px; }
.panel label { color:#62545b; font-weight:500; margin-top:18px; }
.totals { background:var(--surface); border-radius:18px; padding:20px; margin-top:20px; font-size:12px; }
.totals>div { padding:6px 0; }
.totals .grand { border-top:1px solid #e3dadd; padding-top:14px; margin-top:9px; font-size:16px; }
.cart-line { display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:8px 12px; font-size:12px; padding:14px; border:0; border-radius:18px; background:var(--surface); margin-bottom:12px; }
.cart-thumb { width:64px; height:64px; background:transparent; grid-row:span 2; }
.cart-item-name { grid-column:2 / 4; line-height:1.6; font-weight:500; }
.cart-item-price { grid-column:2; color:var(--brand); font-weight:600; }
.cart-line .qty-ctrl { grid-column:3; gap:8px; }
.qty-ctrl button, .add-btn { border-radius:9px; width:32px; height:32px; background:var(--brand); }
.product-hero { background:linear-gradient(145deg,#9f2040,#610b22); border-radius:22px 22px 44% 16px; margin:6px -8px 22px; padding:16px; }
.product-hero .picker-img { width:100%; height:240px; max-height:none; object-fit:contain; margin:0 auto; }
.panel .product-title { padding:0; margin-bottom:10px; }
.product-description { font-size:12px; line-height:1.85; color:var(--muted); margin-bottom:20px; }
.product-choose { font-weight:600; font-size:13px; margin:8px 0; }
.v-row { font-size:12px; padding:16px 0; flex-wrap:wrap; gap:10px; }
.v-name { font-size:13px; min-width:90px; }
.v-price { min-width:72px; font-size:12px; }
.product-submit { position:sticky; bottom:0; }
.empty-cart { padding:32px 12px; text-align:center; color:var(--brand); }
.empty-cart h3 { padding:20px 0; }
footer { font-size:11px; padding:30px 24px 20px; }
[dir="rtl"] body { font-family:'Cairo',Tahoma,sans-serif; }
[dir="rtl"] .item .info { padding:6px 0 6px 4px; }
@media(hover:hover) and (pointer:fine) { .item:hover { border-color:#d7b8c2; } nav.cats button:hover:not(.active) { background:#ebe2e5; } }
@media(min-width:768px) { .sheet .panel { width:min(560px,calc(100vw - 48px)); max-width:560px; border-radius:26px; } }
@media(max-width:1120px) { nav.cats { margin-inline:24px; } }
@media(max-width:900px) { .item { grid-template-columns:116px minmax(0,1fr); gap:10px; } .item .photo { height:126px; } }
@media(max-width:700px) {
  body { padding-bottom:180px; }
  header { padding:13px 20px; min-height:80px; }
  header .logo { height:48px; }
  .promo-wrap { padding:14px 20px 0; }
  .promo-frame { border-radius:20px; }
  .mode-wrap { padding:18px 20px 8px; }
  .menu-search-wrap { margin:12px 0 8px; padding:0 20px; }
  nav.cats { margin:0; padding:12px 20px; gap:8px; }
  nav.cats button { font-size:11px; padding:11px 16px; }
  main#menu { padding:0 20px 20px; }
  h2.cat-title { font-size:20px; margin:22px 0 14px; }
  .menu-grid { grid-template-columns:1fr; gap:12px; }
  .item { grid-template-columns:116px minmax(0,1fr); padding:12px; gap:14px; border-radius:20px; }
  .item .photo { height:126px; }
  .item .info { padding:2px 0; }
  .item .name { font-size:13px; }
  .item .desc { font-size:10px; line-height:1.65; margin-top:5px; }
  .item-bottom { margin-top:9px; }
  .item .price { font-size:12px; }
  .mobile-nav { position:fixed; bottom:0; inset-inline:0; z-index:29; display:flex; justify-content:space-around; background:#fffdfa; border-top:1px solid #eee5e8; padding:10px 12px max(10px,env(safe-area-inset-bottom)); border-radius:24px 24px 0 0; box-shadow:0 -5px 24px #31101b08; }
  .mobile-nav button { display:flex; flex:1; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:#87767e; background:none; border:0; font-size:10px; min-height:44px; cursor:pointer; }
  .mobile-nav #nav-menu { color:var(--brand); }
  .nav-cart-icon { position:relative; display:flex; }
  #nav-cart-count { position:absolute; top:-8px; inset-inline-end:-12px; background:var(--brand); color:white; border:2px solid #fffdfa; border-radius:12px; font-size:9px; min-width:19px; height:19px; line-height:15px; padding-inline:3px; }
  .cart-bar { bottom:calc(82px + env(safe-area-inset-bottom)); left:20px; right:20px; border-radius:16px; padding:15px 18px; }
  .sheet .panel { padding:28px 20px max(24px,env(safe-area-inset-bottom)); border-radius:26px 26px 0 0; }
  .panel h3 { font-size:21px; }
  .product-hero .picker-img { height:220px; }
  .cart-line { padding:12px; grid-template-columns:56px minmax(0,1fr) auto; gap:8px 10px; }
  .cart-thumb { width:56px; height:56px; }
}
@media(max-width:360px) { .item { grid-template-columns:90px minmax(0,1fr); gap:10px; padding:10px; } .item .photo { height:118px; } main#menu, .menu-search-wrap { padding-inline:16px; } .item .name { font-size:12px; } .item .price { font-size:11px; } }
@media(prefers-reduced-motion:reduce) { *, *::before, *::after { transition:none!important; animation:none!important; } .promo-banner { transform:none; } .banner-motion { display:none; } }