/* Huỳnh Long POS 1.8.2 visual system for the phone weo app.
   Keep the native app's warm clay body, espresso header, moss actions and clear ink. */
:root{
  --hl182-clay:#c49a73;
  --hl182-clay-light:#d5b18c;
  --hl182-clay-deep:#b98961;
  --hl182-espresso:#4a3024;
  --hl182-espresso-dark:#302319;
  --hl182-moss:#425a3d;
  --hl182-moss-dark:#30452e;
  --hl182-cream:#f8edda;
  --hl182-ink:#302319;
  --hl182-muted:#584330;
}

@media(max-width:760px){
  html{background:var(--hl182-clay);scroll-padding-top:64px}
  body:has(#admin-dashboard),body:has(.site-header){
    background:var(--hl182-clay)!important;
    color:var(--hl182-ink)!important;
    font-family:Arial,sans-serif;
  }

  /* Native POS header and compact account/settings row. */
  body:has(#admin-dashboard) .admin-topbar{
    min-height:54px!important;height:auto!important;padding:7px 12px!important;
    background:var(--hl182-espresso)!important;border-bottom:2px solid var(--hl182-moss)!important;
    box-shadow:0 3px 9px #30231935;
  }
  body:has(#admin-dashboard) .admin-brand{gap:8px!important}
  body:has(#admin-dashboard) .admin-mark{width:34px!important;height:34px!important;flex-basis:34px!important;background:var(--hl182-moss)!important;border:1px solid #d3b27e!important;border-radius:50%!important;color:var(--hl182-cream)!important;font-size:15px!important}
  body:has(#admin-dashboard) .admin-brand b{color:var(--hl182-cream)!important;font-size:12px!important;letter-spacing:1px!important}
  body:has(#admin-dashboard) .admin-brand small{color:#e3c69e!important}
  body:has(#admin-dashboard) .admin-top-actions{gap:5px!important}
  body:has(#admin-dashboard) .admin-top-actions button{min-height:32px!important;border-color:#a78562!important;border-radius:8px!important;background:#63452f!important;color:var(--hl182-cream)!important}
  body:has(#admin-dashboard) .admin-shell{width:100%!important;max-width:none!important;margin:0!important;padding:10px 10px 90px!important}
  body:has(#admin-dashboard) .admin-welcome{display:flex!important;align-items:center!important;flex-direction:row!important;gap:8px!important;margin:0 0 10px!important;padding:0 2px!important}
  body:has(#admin-dashboard) .admin-welcome h1{margin:3px 0!important;color:var(--hl182-espresso-dark)!important;font:700 20px/1.15 Arial,sans-serif!important}
  body:has(#admin-dashboard) .admin-welcome .admin-kicker{color:var(--hl182-moss-dark)!important}
  body:has(#admin-dashboard) .admin-welcome p{color:#493624!important;font-size:11px!important;line-height:1.35!important}
  body:has(#admin-dashboard) #admin-refresh{min-height:34px!important;margin-left:auto;padding:6px 8px!important;border:1px solid #9e774e!important;border-radius:8px!important;background:var(--hl182-espresso)!important;color:var(--hl182-cream)!important;font-size:10px!important}
  body:has(#admin-dashboard) .admin-tabs{display:none!important}

  /* Same four destinations and persistent bottom navigation as the POS app. */
  .app-bottom-nav,.customer-app-nav{
    background:var(--hl182-espresso)!important;border-top:2px solid var(--hl182-moss)!important;
    box-shadow:0 -5px 16px #30231935!important;
  }
  .app-bottom-nav button,.customer-app-nav button{color:#f0dfc6!important;border-radius:9px!important;font-weight:700!important}
  .app-bottom-nav button>span,.customer-app-nav button>span{color:#e8d3b2!important}
  .app-bottom-nav button.active,.customer-app-nav button.active{background:var(--hl182-moss)!important;color:#fff8e9!important;box-shadow:inset 0 0 0 1px #78916c}
  .app-bottom-nav button.active>span,.app-bottom-nav button.active small,.customer-app-nav button.active>span,.customer-app-nav button.active small{color:#fff8e9!important}
  .app-nav-icon-wrap b,.customer-cart-icon b{border-color:var(--hl182-espresso)!important;background:#d7ad62!important;color:#302319!important}

  /* Main work areas follow the app's warm clay/caramel surfaces, never white. */
  body:has(#admin-dashboard) .admin-panel,
  body:has(#admin-dashboard) .workflow-panel,
  body:has(#admin-dashboard) .pos-panel{
    background:var(--hl182-clay-light)!important;border:1px solid #9d7652!important;
    border-radius:12px!important;box-shadow:0 3px 10px #52361f18;
  }
  body:has(#admin-dashboard) .admin-panel{margin-bottom:12px!important;padding:14px!important}
  body:has(#admin-dashboard) :is(.admin-panel h2,.panel-heading h2,.pos-topline h2,.admin-form h3){color:var(--hl182-espresso-dark)!important}
  body:has(#admin-dashboard) :is(.admin-panel p,.workflow-step p,.workflow-intro,.admin-empty-note){color:#493624!important}
  body:has(#admin-dashboard) :is(.admin-kicker,.panel-heading .admin-kicker,.pos-topline .admin-kicker){color:var(--hl182-moss-dark)!important}
  body:has(#admin-dashboard) .count-pill{background:#ead7b8!important;color:#39291e!important;border:1px solid #a98660}
  body:has(#admin-dashboard) .workflow-steps{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  body:has(#admin-dashboard) .workflow-step{min-height:170px!important;padding:11px!important;background:var(--hl182-cream)!important;border:1px solid #a27e59!important;border-top:3px solid var(--hl182-moss)!important;border-radius:10px!important;box-shadow:0 2px 7px #49301a20!important}
  body:has(#admin-dashboard) .workflow-step h3{margin:8px 0 5px!important;color:var(--hl182-espresso)!important;font:700 14px Arial,sans-serif!important}
  body:has(#admin-dashboard) .workflow-step>strong{color:var(--hl182-espresso-dark)!important;font-size:15px!important}
  body:has(#admin-dashboard) .workflow-step p{font-size:10px!important;line-height:1.4!important}
  body:has(#admin-dashboard) .workflow-step button{background:var(--hl182-moss)!important;border-color:var(--hl182-moss-dark)!important;color:#fff8e9!important}

  /* Compact POS counter: four visible products per swipe page. */
  body:has(#admin-dashboard) .pos-panel{padding:11px!important;gap:8px!important}
  body:has(#admin-dashboard) .pos-topline{border-color:#95704d!important}
  body:has(#admin-dashboard) .pos-topline button{background:var(--hl182-espresso)!important;border-color:var(--hl182-espresso)!important;color:var(--hl182-cream)!important}
  body:has(#admin-dashboard) .pos-toolbar label{color:var(--hl182-espresso-dark)!important}
  body:has(#admin-dashboard) .pos-toolbar :is(input,select){background:var(--hl182-cream)!important;border-color:#9c7652!important;color:var(--hl182-ink)!important}
  body:has(#admin-dashboard) .pos-menu-viewport{background:var(--hl182-clay-deep)!important;border-color:#8b6848!important}
  body:has(#admin-dashboard) .pos-page{gap:7px!important;padding:7px!important}
  body:has(#admin-dashboard) .pos-tile{background:#d9b894!important;border-color:#8d6949!important;border-radius:9px!important;box-shadow:0 2px 5px #402b1c25!important}
  body:has(#admin-dashboard) .pos-tile-copy h3{color:var(--hl182-espresso-dark)!important}
  body:has(#admin-dashboard) .pos-tile-copy>span{color:var(--hl182-moss-dark)!important}
  body:has(#admin-dashboard) .pos-tile-copy>strong{color:#56371f!important}
  body:has(#admin-dashboard) .pos-tile-copy button,body:has(#admin-dashboard) .pos-bottom-bar button{background:var(--hl182-moss)!important;border-color:var(--hl182-moss-dark)!important;color:#fff8e9!important}
  body:has(#admin-dashboard) .pos-bottom-bar{background:#e6caa5!important;border-color:#9b774f!important}

  /* Forms, alerts and tables use readable dark ink on tan cards. */
  body:has(#admin-dashboard) :is(.admin-form,.app-more-dialog,.temporary-access-card,.pos-dialog){background:#d9b894!important;color:var(--hl182-ink)!important;border-color:#98724f!important}
  body:has(#admin-dashboard) .admin-form label{color:#3d2b1e!important}
  body:has(#admin-dashboard) .admin-form :is(input,select,textarea),body:has(#admin-dashboard) .pos-dialog :is(input,select,textarea){background:var(--hl182-cream)!important;color:var(--hl182-ink)!important;border-color:#9b7652!important}
  body:has(#admin-dashboard) :is(th,td,td small){color:#3e2c20!important}
  body:has(#admin-dashboard) th{border-color:#a98761!important}
  body:has(#admin-dashboard) td{border-color:#b18d66!important}
  body:has(#admin-dashboard) .admin-primary{background:var(--hl182-moss)!important;color:#fff8e9!important;border:1px solid var(--hl182-moss-dark)!important}
  body:has(#admin-dashboard) .admin-secondary,body:has(#admin-dashboard) .table-action,body:has(#admin-dashboard) .order-save{background:var(--hl182-espresso)!important;color:var(--hl182-cream)!important;border-color:#38251b!important}
  body:has(#admin-dashboard) .app-more-dialog{background:var(--hl182-clay-light)!important}
  body:has(#admin-dashboard) .app-more-grid button{background:var(--hl182-cream)!important;border-color:#9d7652!important;color:var(--hl182-ink)!important}
  body:has(#admin-dashboard) .app-more-grid button>span{color:var(--hl182-moss-dark)!important}

  /* Customer storefront retains its own menu and purchase flow, inside the same POS palette. */
  body:has(.site-header) .site-header{background:var(--hl182-espresso)!important;border-bottom:2px solid var(--hl182-moss)!important}
  body:has(.site-header) .header-inner{min-height:56px!important;height:56px!important;padding-inline:10px!important}
  body:has(.site-header) .brand :is(strong,small){color:var(--hl182-cream)!important}
  body:has(.site-header) .brand-symbol{background:var(--hl182-moss)!important;border-color:#d2b27c!important;color:var(--hl182-cream)!important}
  body:has(.site-header) .menu-section{background:var(--hl182-clay)!important;color:var(--hl182-ink)!important}
  body:has(.site-header) .menu-heading h2{color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) .menu-heading h2 em{color:var(--hl182-moss-dark)!important}
  body:has(.site-header) .menu-category-rail{background:var(--hl182-espresso)!important;border-color:var(--hl182-moss)!important}
  body:has(.site-header) .product-category-heading{color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) .product-category-products>.product-card{background:#d9b894!important;border-color:#98714d!important;box-shadow:0 4px 10px #45301f24!important}
  body:has(.site-header) .product-category-products .product-card :is(h3,p,.product-title-row h3,.product-category,.product-detail-trigger){color:var(--hl182-espresso-dark)!important;opacity:1!important}
  body:has(.site-header) .product-category-products .product-card .product-price{color:#50341e!important;font-weight:800!important}
  body:has(.site-header) :is(.product-category-products .product-card .buy-now-button,.product-category-products .product-card .add-to-cart-button,.product-category-products .product-card .detail-add-button,.product-category-products .product-card .detail-buy-button,.checkout-button,.profile-save-button){background:var(--hl182-moss)!important;border-color:var(--hl182-moss-dark)!important;color:#fff8e9!important}
  body:has(.site-header) :is(.cart-panel,.checkout-dialog,.account-dialog,.product-detail-dialog){background:var(--hl182-clay-light)!important;color:var(--hl182-ink)!important}
  body:has(.site-header) :is(.cart-panel h3,.checkout-dialog h2,.account-dialog h2,.product-detail-dialog h2){color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) :is(.cart-panel input,.checkout-dialog input,.checkout-dialog select,.checkout-dialog textarea,.account-dialog input,.account-dialog select){background:var(--hl182-cream)!important;color:var(--hl182-ink)!important}
  body:has(.site-header) .quick-cart-dock{background:var(--hl182-moss)!important;border-color:var(--hl182-cream)!important;color:#fff8e9!important}
}

@media(max-width:390px){
  body:has(#admin-dashboard) .admin-welcome h1{font-size:18px!important}
  body:has(#admin-dashboard) .workflow-step{min-height:158px!important;padding:9px!important}
  body:has(#admin-dashboard) .workflow-step p{font-size:9px!important}
}

/* Login and dialogs use the same native palette too. */
@media(max-width:760px){
  body:has(#admin-dashboard) .admin-login-card{
    width:calc(100% - 24px)!important;max-width:480px!important;margin:24px auto!important;
    padding:22px 18px!important;background:var(--hl182-clay-light)!important;
    color:var(--hl182-ink)!important;border:1px solid #98724f!important;border-radius:16px!important;
    box-shadow:0 8px 24px #30231924!important;
  }
  body:has(#admin-dashboard) .admin-login-card :is(h1,h2){color:var(--hl182-espresso-dark)!important}
  body:has(#admin-dashboard) .admin-login-card :is(p,small,.admin-kicker){color:#493624!important;opacity:1!important}
  body:has(#admin-dashboard) .admin-login-form label{color:var(--hl182-espresso-dark)!important;font-weight:700!important}
  body:has(#admin-dashboard) .admin-login-form :is(input,select,textarea){
    min-height:46px!important;background:var(--hl182-cream)!important;color:var(--hl182-ink)!important;
    border:1px solid #9c7652!important;border-radius:9px!important;
  }
  body:has(#admin-dashboard) .admin-login-form .admin-primary{
    min-height:46px!important;background:var(--hl182-moss)!important;color:#fff8e9!important;
    border:1px solid var(--hl182-moss-dark)!important;border-radius:9px!important;font-weight:800!important;
  }
  body:has(#admin-dashboard) .admin-credentials-dialog{
    max-width:calc(100vw - 20px)!important;background:var(--hl182-clay-light)!important;color:var(--hl182-ink)!important;
    border:1px solid #98724f!important;border-radius:14px!important;
  }
}

/* Mooile storefront mirrors the POS menu: four dishes per swipe, in a 2 × 2 page. */
body .product-menu-page{display:contents}
@media(max-width:700px){
  body:has(.site-header) .product-category-heading::after{content:"Vuốt ngang để xem 4 món tiếp theo"!important;color:var(--hl182-moss-dark)!important;font-size:11px!important;font-weight:800!important}
  body:has(.site-header) .product-category-products{
    display:flex!important;flex-flow:row nowrap!important;align-items:stretch!important;gap:12px!important;
    width:auto!important;margin:0 -16px 16px!important;padding:8px 7vw 14px!important;
    overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;
    scroll-padding-inline:7vw!important;overscroll-behavior-x:contain!important;-webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;scrollbar-width:none!important
  }
  body:has(.site-header) .product-category-products::-webkit-scrollbar{display:none!important}
  body:has(.site-header) .product-category-products>.product-menu-page{
    display:grid!important;flex:0 0 86vw!important;width:86vw!important;min-width:86vw!important;max-width:86vw!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(310px,1fr))!important;
    gap:9px!important;align-content:stretch!important;scroll-snap-align:center!important;scroll-snap-stop:always!important
  }
  body:has(.site-header) .product-menu-page>.product-card{
    display:flex!important;flex:initial!important;flex-direction:column!important;width:auto!important;min-width:0!important;
    max-width:none!important;min-height:0!important;height:100%!important;margin:0!important;overflow:hidden!important;
    border:1px solid #98714d!important;border-radius:12px!important;background:#d9b894!important;
    box-shadow:0 4px 10px #45301f24!important
  }
  body:has(.site-header) .product-menu-page>.product-card>.product-art{
    display:block!important;flex:0 0 auto!important;width:100%!important;height:auto!important;min-height:0!important;
    aspect-ratio:1.18!important;overflow:hidden!important
  }
  body:has(.site-header) .product-menu-page>.product-card>.product-art img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
  body:has(.site-header) .product-menu-page>.product-card>.product-info{
    display:flex!important;flex:1 1 auto!important;flex-direction:column!important;gap:3px!important;min-width:0!important;
    padding:7px!important;background:#d9b894!important;color:var(--hl182-espresso-dark)!important
  }
  body:has(.site-header) .product-menu-page .product-card .product-category{font-size:8px!important;color:var(--hl182-moss-dark)!important;font-weight:800!important}
  body:has(.site-header) .product-menu-page .product-title-row{display:block!important;min-width:0!important}
  body:has(.site-header) .product-menu-page .product-title-row h3{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;margin:0!important;font-size:14px!important;line-height:1.15!important;color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) .product-menu-page .product-price{display:block!important;margin-top:2px!important;font-size:12px!important;line-height:1.1!important;color:#50341e!important;font-weight:850!important}
  body:has(.site-header) .product-menu-page .product-desc{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;margin:1px 0!important;font-size:10px!important;line-height:1.25!important;color:#493624!important}
  body:has(.site-header) .product-menu-page .product-detail-trigger{margin:1px 0!important;padding:2px 0!important;font-size:9px!important;line-height:1.15!important;color:var(--hl182-moss-dark)!important}
  body:has(.site-header) .product-menu-page .product-controls{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:3px!important;margin-top:2px!important}
  body:has(.site-header) .product-menu-page .product-controls select{width:100%!important;min-width:0!important;height:32px!important;min-height:32px!important;padding:2px 5px!important;font-size:10px!important}
  body:has(.site-header) .product-menu-page .quantity-control{min-height:30px!important;height:30px!important;margin:1px 0!important}
  body:has(.site-header) .product-menu-page .quantity-control button{min-width:30px!important;min-height:30px!important;height:30px!important;padding:0!important}
  body:has(.site-header) .product-menu-page .quantity-control input{min-width:0!important;height:30px!important;padding:0!important;font-size:12px!important}
  body:has(.site-header) .product-menu-page .product-purchase-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:4px!important;margin-top:auto!important}
  body:has(.site-header) .product-menu-page .product-purchase-actions button{min-width:0!important;min-height:34px!important;height:auto!important;padding:4px 2px!important;font-size:8px!important;line-height:1.05!important;white-space:normal!important}
  body:has(.site-header) .product-menu-page .product-purchase-actions button span{font-size:9px!important}
}

/* HL POS phone menu: one fixed work screen with four products visible, paged horizontally. */
@media(max-width:700px){
  html,body:has(.site-header){height:100%;min-height:0;overflow:hidden!important;overscroll-behavior:none}
  body:has(.site-header){height:100dvh!important;min-height:100dvh!important;padding:0!important}
  body:has(.site-header) :is(.hero,.benefits,.story-section,.contact-section,.site-footer,.floating-contact){display:none!important}
  body:has(.site-header) .site-header{position:fixed!important;inset:0 0 auto!important;height:54px!important;min-height:54px!important;z-index:150!important}
  body:has(.site-header) .header-inner{height:54px!important;min-height:54px!important}
  body:has(.site-header) #thuc-don.menu-section{position:fixed!important;inset:54px 0 calc(64px + env(safe-area-inset-bottom))!important;width:100%!important;height:auto!important;min-height:0!important;margin:0!important;padding:6px 10px 5px!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;scroll-margin:0!important}
  body:has(.site-header) #thuc-don .qr-table-banner{flex:none!important;min-height:30px!important;margin:0 0 4px!important;padding:4px 8px!important;font-size:10px!important}
  body:has(.site-header) #thuc-don .menu-heading{flex:none!important;min-height:36px!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:7px!important;margin:0 0 5px!important;padding:0!important}
  body:has(.site-header) #thuc-don .menu-heading .eyebrow{display:none!important}
  body:has(.site-header) #thuc-don .menu-heading h2{margin:0!important;font-size:20px!important;line-height:1.1!important;white-space:nowrap!important}
  body:has(.site-header) #thuc-don .menu-search{flex:1 1 auto!important;width:auto!important;max-width:48%!important;min-width:90px!important;height:32px!important;min-height:32px!important;margin:0!important;padding:0 7px!important}
  body:has(.site-header) #thuc-don .menu-search input{height:28px!important;font-size:12px!important}
  body:has(.site-header) #thuc-don .menu-category-rail{position:relative!important;inset:auto!important;z-index:2!important;flex:none!important;min-height:44px!important;height:44px!important;margin:0 -10px 4px!important;padding:3px 10px!important;display:flex!important;align-items:center!important;overflow:hidden!important}
  body:has(.site-header) #thuc-don .mobile-category-picker{display:block!important;width:100%!important;min-height:36px!important;height:36px!important}
  body:has(.site-header) #thuc-don .mobile-category-summary{display:none!important}
  body:has(.site-header) #thuc-don .mobile-category-picker select{width:100%!important;height:36px!important;min-height:36px!important;padding:4px 32px 4px 10px!important;font-size:12px!important}
  body:has(.site-header) #thuc-don .install-app-trigger{display:none!important}
  body:has(.site-header) #thuc-don .menu-layout,body:has(.site-header) #thuc-don .menu-main{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;min-width:0!important;min-height:0!important;width:100%!important;overflow:hidden!important}
  body:has(.site-header) #thuc-don .featured-menu{display:none!important}
  body:has(.site-header) #thuc-don #product-grid{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;min-width:0!important;min-height:0!important;width:100%!important;margin:0!important;padding:0!important;overflow:hidden!important}
  body:has(.site-header) #thuc-don .product-menu-app-page{display:flex!important;flex:1 1 auto!important;flex-direction:column!important;min-width:0!important;min-height:0!important;width:100%!important;height:100%!important;overflow:hidden!important}
  body:has(.site-header) #thuc-don .product-category-heading{flex:none!important;display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:29px!important;height:29px!important;margin:0!important;padding:2px 3px!important;border-bottom:1px solid #805a38!important;color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) #thuc-don .product-category-heading h3{margin:0!important;color:var(--hl182-espresso-dark)!important;font-size:14px!important;line-height:1!important}
  body:has(.site-header) #thuc-don .product-category-heading span{font-size:10px!important;color:var(--hl182-moss-dark)!important;font-weight:800!important}
  body:has(.site-header) #thuc-don .product-category-heading::after{content:"Vuốt ngang · 4 món mỗi trang"!important;margin-left:auto!important;padding-left:8px!important;color:var(--hl182-moss-dark)!important;font-size:9px!important;font-weight:800!important;white-space:nowrap!important}
  body:has(.site-header) #thuc-don .product-category-products{display:flex!important;flex:1 1 auto!important;flex-flow:row nowrap!important;align-items:stretch!important;gap:0!important;width:100%!important;height:calc(100% - 29px)!important;min-height:0!important;margin:0!important;padding:5px 0 0!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory!important;scroll-padding:0!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x!important;scrollbar-width:none!important}
  body:has(.site-header) #thuc-don .product-category-products::-webkit-scrollbar{display:none!important}
  body:has(.site-header) #thuc-don .product-category-products>.product-menu-page{display:grid!important;flex:0 0 100%!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;gap:6px!important;width:100%!important;min-width:100%!important;height:100%!important;min-height:0!important;padding:0 1px 2px!important;overflow:hidden!important;scroll-snap-align:start!important;scroll-snap-stop:always!important}
  body:has(.site-header) #thuc-don .product-menu-page>.product-card{display:flex!important;flex-direction:column!important;min-width:0!important;min-height:0!important;width:100%!important;height:100%!important;margin:0!important;overflow:hidden!important;border:1px solid #896747!important;border-radius:9px!important;background:#d9b894!important;box-shadow:0 2px 5px #45301f25!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-card>.product-art{display:block!important;flex:1 1 54%!important;width:100%!important;min-height:0!important;height:auto!important;aspect-ratio:auto!important;overflow:hidden!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-card>.product-art img{display:block!important;width:100%!important;height:100%!important;min-height:0!important;object-fit:cover!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-card>.product-info{display:flex!important;flex:0 0 46%!important;flex-direction:column!important;gap:2px!important;min-width:0!important;min-height:0!important;padding:5px!important;overflow:hidden!important;background:#d9b894!important;color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-card .product-category,body:has(.site-header) #thuc-don .product-menu-page .product-card .product-desc,body:has(.site-header) #thuc-don .product-menu-page .product-card .product-detail-trigger,body:has(.site-header) #thuc-don .product-menu-page .product-card .product-controls,body:has(.site-header) #thuc-don .product-menu-page .product-card .quantity-control,body:has(.site-header) #thuc-don .product-menu-page .product-card .product-purchase-actions{display:none!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-title-row{display:flex!important;flex-direction:column!important;gap:1px!important;min-width:0!important;margin:0!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-title-row h3{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;overflow:hidden!important;margin:0!important;font-size:12px!important;line-height:1.1!important;color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) #thuc-don .product-menu-page .product-price{display:block!important;margin:0!important;font-size:11px!important;line-height:1.1!important;color:#50341e!important;font-weight:850!important}
  body:has(.site-header) #thuc-don .mobile-product-select{display:flex!important;align-items:center!important;justify-content:center!important;gap:4px!important;width:100%!important;min-width:0!important;min-height:26px!important;height:26px!important;margin:auto 0 0!important;padding:3px!important;border:1px solid var(--hl182-moss-dark)!important;border-radius:6px!important;background:var(--hl182-moss)!important;color:#fff8e9!important;font-size:9px!important;font-weight:800!important;line-height:1!important}
  body:has(.site-header) #thuc-don .mobile-product-select span{font-size:12px!important}
  body:has(.site-header) #thuc-don .no-products{display:grid!important;flex:1!important;place-items:center!important;padding:15px!important;color:var(--hl182-espresso-dark)!important}
  body:has(.site-header) .customer-app-nav{position:fixed!important;z-index:200!important;inset:auto 0 0!important;height:calc(64px + env(safe-area-inset-bottom))!important;padding:4px 8px calc(4px + env(safe-area-inset-bottom))!important}
}