/* v2.9.25.585 — RRH product cards on the MENU grid (Sohan approved 10/31/2026;
   BUILD-REFERENCE-2026-10-31/cards/rrh-card.css + screenshots/menu-desktop.png).
   Presentation only. Cards are still built by SR.renderCard (shared-v3.js) and the menu-v3.js
   wrappers, so the markup, data attributes, click handlers (modal, .sr-card-add-btn → SR.cart.add)
   and the cart (localStorage sr_cart_items) are untouched. Enqueued on the menu page only (never
   /kiosk/), after clean-v1.css. The 4×#sr-menu-grid prefix out-ranks clean-v1/shop-polish's 3×id
   :is() rules, so this file wins without touching them. Palette: greens + neutrals only. */

/* grid: 4 across on desktop, 3 on tablets, 2 on phones */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 16px !important; align-items: stretch !important; }
@media (max-width: 1024px) { html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 768px) { html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; } }

/* card shell: dark grey #3d433e, radius 10 */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card { background: #3d433e !important; background-image: none !important; border: 0 !important; border-radius: 10px !important; padding: 10px 10px 12px !important; display: flex !important; flex-direction: column !important; gap: 6px !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; position: relative !important; color: #fff !important; box-shadow: none !important; overflow: hidden !important; transition: box-shadow .15s, transform .15s !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card:hover { transform: translateY(-2px) !important; box-shadow: 0 0 0 2px #7ED957 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card-skeleton { background: #3d433e !important; border-radius: 10px !important; }

/* square photo: trimmed + padded on the CDN by rrh-cards-v1.js; contain on the right background as the fallback */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-img-wrap { order: 0 !important; position: relative !important; aspect-ratio: 1 / 1 !important; width: 100% !important; height: auto !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; border-radius: 6px !important; overflow: hidden !important; background: #fff !important; border: 0 !important; box-shadow: none !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card.sr-rc-dark .sr-card-img-wrap { background: #0f1311 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-img-wrap[data-sr-imgfail] { background: #182619 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: contain !important; padding: 0 !important; margin: 0 !important; transform: none !important; border-radius: 0 !important; }
/* the strain/THC chips move from the photo to the pills row (RRH layout) */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-ovl { display: none !important; }
/* deal chip on the photo (existing .sr-deal-ribbon button, same handler) */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-deal-ribbon { position: absolute !important; top: 18px !important; left: 18px !important; right: auto !important; bottom: auto !important; z-index: 2 !important; font: 700 10px/1 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important; letter-spacing: .08em !important; text-transform: uppercase !important; background: #7ED957 !important; color: #070908 !important; padding: 6px 8px !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important; max-width: calc(100% - 36px) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }

/* body children join the card's flex column so they can take the RRH order */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-body,
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-price-row { display: contents !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-brand { order: 1 !important; margin: 4px 0 0 !important; font: 500 11px/1.2 Poppins, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; color: #d3dad5 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; opacity: 1 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-name { order: 2 !important; margin: 0 !important; font: 500 14px/1.3 Poppins, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; color: #fff !important; min-height: 2.6em !important; max-height: none !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }

/* price block: "$24 $32" then "1/8oz · $27.12 with tax" */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-kiosk-price-wrap { order: 3 !important; flex: 0 0 auto !important; align-content: flex-start !important; height: auto !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: baseline !important; gap: 0 5px !important; min-width: 0 !important; margin: 0 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-kiosk-price-wrap::before { content: "" !important; order: 2 !important; flex-basis: 100% !important; height: 0 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-price { order: 0 !important; font: 700 15px/1.2 Poppins, sans-serif !important; color: #fff !important; white-space: nowrap !important; margin: 0 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-price-old { order: 1 !important; font: 500 12px/1 Poppins, sans-serif !important; color: #9aa49d !important; text-decoration: line-through !important; margin: 0 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-weight { order: 3 !important; font: 400 11px/1.4 Poppins, sans-serif !important; color: #c3cbc5 !important; text-transform: none !important; letter-spacing: 0 !important; opacity: 1 !important; margin: 0 !important; display: inline !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-weight::after { content: " ·" !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-kiosk-card-tax { order: 4 !important; display: inline !important; font: 400 11px/1.4 Poppins, sans-serif !important; color: #c3cbc5 !important; text-transform: none !important; margin: 0 !important; opacity: 1 !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-jean-ppg,
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-kiosk-card-effects { display: none !important; }

/* pills: green strain pill + black THC pill */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-meta { order: 4 !important; flex: 0 0 auto !important; display: flex !important; flex-wrap: wrap !important; gap: 4px !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-meta .sr-badge { flex: 0 0 auto !important; display: inline-block !important; font: 600 11px/1 Poppins, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; padding: 4px 7px !important; border-radius: 4px !important; border: 0 !important; background: #0b0d0c !important; color: #fff !important; white-space: nowrap !important; box-shadow: none !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-meta :is(.sr-badge-indica, .sr-badge-sativa, .sr-badge-hybrid) { background: #7ED957 !important; color: #0b0d0c !important; text-transform: lowercase !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-meta :is(.sr-badge-indica, .sr-badge-sativa, .sr-badge-hybrid)::first-letter { text-transform: uppercase !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-size { order: 4 !important; margin: 0 !important; }

/* other layers paint text with -webkit-text-fill-color (wins over color) — follow our colors instead */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card, html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card * { -webkit-text-fill-color: currentColor !important; }
/* clean-v1 draws the button label as ::after for its icon-only phone button; the real label shows here */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-add-btn::before, html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-add-btn::after { content: none !important; display: none !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-weight, html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-kiosk-card-tax { flex: 0 1 auto !important; width: auto !important; max-width: 100% !important; }

/* full-width green Add to cart (overrides the phone icon-only button) */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-add-btn { order: 5 !important; flex: 0 0 auto !important; width: 100% !important; min-width: 0 !important; height: 38px !important; margin: auto 0 0 !important; padding: 0 !important; border: 0 !important; border-radius: 6px !important; background: #7ED957 !important; background-image: none !important; color: #0b0d0c !important; font: 600 13px/38px Poppins, sans-serif !important; text-indent: 0 !important; text-transform: none !important; letter-spacing: 0 !important; display: block !important; text-align: center !important; box-shadow: none !important; cursor: pointer !important; overflow: hidden !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-add-btn:hover { background: #9be87a !important; color: #0b0d0c !important; }
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-add-btn svg { display: none !important; }
@media (max-width: 1024px) { html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-card-add-btn { height: 44px !important; line-height: 44px !important; } }

/* deal terms under the button (existing .sr-deal-line button = the RRH .promo slot) */
html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-deal-line { order: 6 !important; width: 100% !important; margin: 0 !important; padding: 6px 8px !important; border: 0 !important; border-radius: 6px !important; background: #E1FDD6 !important; color: #14622d !important; font: 500 11px/1.35 Poppins, sans-serif !important; text-align: left !important; white-space: normal !important; overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; text-overflow: clip !important; max-width: 100% !important; }
@media (max-width: 768px) { html:root body #sr-menu-grid#sr-menu-grid#sr-menu-grid#sr-menu-grid .sr-card .sr-deal-line { display: none !important; } }
