/* Loaded after existing mobile styles, which otherwise make every grocery button full width. */
#quick-grocery-dialog { box-sizing:border-box; width:min(92vw,560px)!important; max-width:calc(100vw - 16px)!important; max-height:90dvh; overflow:auto; }
#quick-grocery-dialog > section { box-sizing:border-box; padding:20px!important; min-width:0; }
#quick-grocery-dialog h2 { font-size:1.65rem; line-height:1.2; letter-spacing:normal; min-width:0; }
#quick-grocery-dialog #close-grocery-list { flex:0 0 auto; width:auto!important; white-space:nowrap; }
#quick-grocery-dialog .quick-grocery-row { display:flex; align-items:center; gap:10px; padding:8px; border:1px solid #dfe4d9; border-radius:7px; background:#fff; width:100%; min-width:0; box-sizing:border-box; }
#quick-grocery-dialog .quick-grocery-label { display:flex; align-items:center; gap:10px; flex:1 1 0; min-width:0; width:auto; max-width:100%; cursor:pointer; }
#quick-grocery-dialog .quick-grocery-label input { flex:0 0 24px; width:24px; height:24px; margin:0; }
#quick-grocery-dialog .quick-grocery-label span { min-width:0; overflow-wrap:anywhere; }
#quick-grocery-dialog .quick-grocery-checked { text-decoration:line-through; opacity:.65; }
#quick-grocery-dialog .quick-grocery-delete { display:inline-flex!important; align-items:center; justify-content:center; flex:0 0 auto; width:auto!important; min-width:72px; min-height:44px; padding:8px 12px; margin:0; color:#792a20; border:1px solid #b78980; visibility:visible; opacity:1; }
#quick-grocery-dialog button { min-height:44px; white-space:normal; overflow-wrap:anywhere; }
#quick-grocery-dialog button:focus-visible, #quick-grocery-dialog input:focus-visible { outline:3px solid #1b725c; outline-offset:2px; }
#quick-grocery-dialog button:disabled { opacity:.55; cursor:default; }
#quick-grocery-dialog #quick-grocery-input { width:auto; min-width:0!important; flex:1 1 160px!important; box-sizing:border-box; }
#quick-grocery-dialog #delete-checked-grocery-items { width:auto; max-width:100%; }
@media(max-width:400px) {
  #quick-grocery-dialog > section { padding:14px!important; }
  #quick-grocery-dialog h2 { font-size:1.3rem; overflow-wrap:anywhere; }
  #quick-grocery-dialog .quick-grocery-row { gap:8px; }
  #quick-grocery-dialog .quick-grocery-label { gap:8px; }
}

/* V223: shopping-list readability on small screens only. */
@media (max-width:720px) {
  #quick-grocery-dialog { font-size:17px; font-weight:600; line-height:1.5; }
  #quick-grocery-dialog .quick-grocery-label span { font-size:17px; font-weight:700; line-height:1.4; }
  #quick-grocery-dialog button, #quick-grocery-dialog #quick-grocery-input { font-size:16px; font-weight:700; line-height:1.4; }
  #quick-grocery-dialog h2 { font-size:1.5rem; font-weight:700; line-height:1.25; }
  #quick-grocery-dialog .quick-grocery-checked { opacity:.8; }
}
