/* 954446 Buttons and Bows (Joanne) - per-store EPIC overrides.
   Tickets 01M4FT67EK3448JM1EJ3P4PPJC / 01M4G6HC1M9M2N0P2B2E1CSJK6 (2026-10-09). Opinion fixes, store-only.
   Source: support-triage tasks/epic-outreach/stores/954446-live-patch-20261009/store_css.py */

/* 1. Mouse/PC: no hover icons and no grey tint over product pictures (she dislikes the three icons).
   With the panel gone the picture's own link is reachable, so clicking a picture opens the product.
   Touch devices keep the v69 corner buttons (not matched by this query). */
@media (hover:hover) and (pointer:fine){
  .mk-product-item .product-hover-action,
  .mk-product-item:hover .product-hover-action{display:none!important}
  .mk-product-item .mk-product-item-info .mk-product-image:before{content:none!important}
}

/* 2. Phones/tablets (<=920px, the bundle's own auto-hide gate): keep the menu bar on screen while
   scrolling down, instead of sliding it away until the shopper scrolls up. */
@media (max-width:920px){
  .epic-header.eh-unpinned{transform:none!important}
}

/* 3. Product cards: hide the category name above the product title (her old design hid it too). */
.mk-product-item .mk-product-category{display:none!important}

/* ---- 2026-10-09 r4 additions (ticket 01M4G6HC1M9M2N0P2B2E1CSJK6, her 15:35Z asks). Opinion fixes, store-only. ---- */

/* 5. Product page share row: keep Facebook, Instagram, WhatsApp, Messenger, Pinterest and the Share button. */
.epic-product .share-option a[data-share-target="linkedin"],
.epic-product .share-option a[data-share-target="twitter"],
.epic-product .share-option a[data-share-target="reddit"]{display:none!important}

/* 6. Product page on phones/tablets (<=900px = where the bundle stacks the page to one column):
   title + price above the picture, buying area straight after the picture, share row under Add to Cart,
   short description hidden (the full description still shows in the Description tab below).
   Gallery and buy columns become display:contents so their children can be ordered in one column;
   unknown children default to order 20 (after everything named here), never to the top. */
@media (max-width:900px){
  .epic-pd{display:flex!important;flex-direction:column;align-items:stretch;gap:var(--epic-space-4,16px);min-width:0;max-width:100%}
  .epic-pd>.epic-pd__gallery,.epic-pd>.epic-pd__buy{display:contents!important}
  .epic-pd>*,.epic-pd__gallery>*,.epic-pd__buy>*{order:20}  /* incl. blocks a script moves into .epic-pd (e.g. epic_assurance_list) */
  .epic-pd__head{order:1}
  .epic-pd__price-block{order:2}
  .epic-pd #main_product_image_placeholder{order:3;margin:0 auto}
  .epic-pd .product-thumb{order:4;min-width:0;max-width:100%}  /* the gallery's min-width:0 used to contain the long thumb strip */
  .epic-pd__meta{order:5}
  .epic-pd__variants{order:6}
  .epic-pd__purchase{order:7}
  .epic-pd .share-option{order:8}
  /* 4-class selector (0,4,0): the bundle's `.product-details .description{all:revert!important}` (0,2,0) beats a 1-class rule */
  .epic-pd .epic-pd__buy>.description.epic-pd__abstract{display:none!important}
}

/* 7. Touch screens (2026-10-11, ticket 01M4FT67EK3448JM1EJ3P4PPJC): cart/wishlist row anchored to the bottom of the
   white card and centred, instead of over the photo. The variants badge sits in the same panel, so it becomes a small
   caption line above the buttons. Extra card padding keeps the row clear of the price. */
@media (hover:none),(pointer:coarse){
  .mk-product-item{position:relative;padding-bottom:84px!important}
  .mk-product-item .mk-product-item-info{position:static!important}
  .mk-product-item .product-hover-action,.mk-product-item:hover .product-hover-action{top:auto!important;left:0!important;right:0!important;bottom:10px!important;justify-content:center!important;flex-wrap:wrap!important;align-content:center!important;align-items:center!important}
  .mk-product-item .product-hover-action .product-hover-action-variants{position:static!important;inset:auto!important;transform:none!important;flex:0 0 100%;order:-1;text-align:center;margin:0 0 6px!important;background:none!important;color:inherit!important}
}
