/* Keep catalog photos integrated with the page, without opaque rectangular surfaces. */
html body.oppo-redesign .floating-actions .floating-cart{position:relative;display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:1px solid #ffffff30;border-radius:50%;background:#183b56;color:#fff9eb;box-shadow:0 3px 10px #11121422;cursor:pointer}
html body.oppo-redesign .floating-cart svg{display:block;width:21px;height:21px;flex:none}
html body.oppo-redesign .floating-cart>span{display:none}
html body.oppo-redesign .floating-cart b{position:absolute;top:-4px;right:-5px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:2px solid #fff9eb;border-radius:20px;background:#ed0038;color:#fff;font:700 10px/1 Arial,sans-serif;box-sizing:content-box}
html body.oppo-redesign .floating-cart:focus-visible{outline:2px solid #ed0038;outline-offset:3px}
html body.oppo-redesign #catalogo #catalogGrid .catalog-card,
html body.oppo-redesign #featuredGrid .product-card{
 animation:none!important;opacity:1!important;transform:none!important;filter:none!important;will-change:auto!important;isolation:auto!important;
}
html body.oppo-redesign #catalogo #catalogGrid .catalog-card .catalog-image-wrap,
html body.oppo-redesign #featuredGrid .product-card .featured-image-wrap{
 background:transparent!important;mix-blend-mode:normal!important;isolation:auto!important;filter:none!important;transform:none!important;will-change:auto!important;
}
html body.oppo-redesign #productDetailModal .product-detail-dialog .catalog-image-wrap{
 background:transparent!important;mix-blend-mode:normal!important;isolation:auto!important;filter:none!important;
}
html body.oppo-redesign #catalogo #catalogGrid .catalog-card .catalog-image-wrap img,
html body.oppo-redesign #featuredGrid .product-card .featured-image-wrap img,
html body.oppo-redesign #productDetailModal .product-detail-dialog .catalog-image-wrap img{
 background:transparent!important;mix-blend-mode:multiply!important;filter:none!important;transform:none!important;z-index:auto!important;border:0!important;box-shadow:none!important;
}
html body.oppo-redesign .search-preview,
html body.oppo-redesign #productDetailModal .product-detail-dialog,
html body.oppo-redesign #cartDrawer .preview-cart-item,
html body.oppo-redesign #cartDrawer .cart-suggestion{
 background:#fff9eb!important;
}
html body.oppo-redesign .search-result img,
html body.oppo-redesign #cartDrawer .preview-cart-item>img,
html body.oppo-redesign #cartDrawer .cart-suggestion>img{
 background:transparent!important;mix-blend-mode:multiply!important;border:0!important;border-radius:0!important;box-shadow:none!important;filter:none!important;
}
html body.oppo-redesign .bp-search .search-result:hover,
html body.oppo-redesign .bp-search .search-result[aria-selected=true]{background:#f0e8d8!important}
/* At least 16px prevents iOS focus zoom without disabling pinch-to-zoom. */
@media(max-width:900px),(pointer:coarse){
 html body.oppo-redesign input,
 html body.oppo-redesign select,
 html body.oppo-redesign textarea,
 html body.oppo-redesign .bp-header .bp-search input,
 html body.oppo-redesign #catalogo #searchInput,
 html body.oppo-redesign #catalogo .bp-filter-content select,
 html body.oppo-redesign #catalogo #requestForm input,
 html body.oppo-redesign #cartDrawer #checkoutForm :is(input,select,textarea),
 html body.oppo-redesign #trackingPanel #trackingForm input,
 html body.oppo-redesign .faq-panel .faq-input input{font-size:16px!important;line-height:1.4!important}
}
/* Background motion is unnecessary while a form or overlay has the user's attention. */
html.omk-page-hidden .brand-texture:before,html.omk-page-hidden .brand-texture:after,
html.omk-page-hidden #omakase-footer:before,
html body.oppo-redesign #omakase-footer.omk-offscreen:before,
body:has(#cartDrawer.bp-open) .brand-texture:before,body:has(#cartDrawer.bp-open) .brand-texture:after,
body:has(#productDetailModal.bp-detail-open) .brand-texture:before,body:has(#productDetailModal.bp-detail-open) .brand-texture:after,
body:has(#comboDialog[open]) .brand-texture:before,body:has(#comboDialog[open]) .brand-texture:after,
body:has(input:focus,textarea:focus,select:focus) .brand-texture:before,body:has(input:focus,textarea:focus,select:focus) .brand-texture:after{animation-play-state:paused!important}

/* Touch/hover transforms create isolated blend groups in WebKit. Keep photo surfaces flat. */
html body.oppo-redesign #catalogo #catalogGrid .catalog-card:is(:active,:hover,:focus,.has-product-tilt) .catalog-image-wrap.image-squareish,
html body.oppo-redesign #featuredGrid .product-card:is(:active,:hover,:focus,.has-product-tilt) .featured-image-wrap,
html body.oppo-redesign #productDetailModal #productDetailContent .detail-catalog-card,
html body.oppo-redesign #productDetailModal #productDetailContent .detail-catalog-card:is(:active,:hover,:focus){
 background:transparent!important;transform:none!important;filter:none!important;opacity:1!important;isolation:auto!important;animation:none!important;transition:none!important;will-change:auto!important;box-shadow:none!important;
}
html body.oppo-redesign #productDetailModal.bp-detail-open .product-detail-dialog{transform:none!important}
html body.oppo-redesign #productDetailModal #productDetailContent .catalog-image-wrap,
html body.oppo-redesign #productDetailModal #productDetailContent .featured-image-wrap{
 background:transparent!important;transform:none!important;filter:none!important;isolation:auto!important;mix-blend-mode:normal!important;will-change:auto!important;
}
html body.oppo-redesign #productDetailModal #productDetailContent img{
 background:transparent!important;mix-blend-mode:multiply!important;transform:none!important;filter:none!important;box-shadow:none!important;border:0!important;
}

html body.oppo-redesign #productDetailModal #productDetailContent{isolation:auto!important;transform:none!important;filter:none!important;background:transparent!important;will-change:auto!important}

html body.oppo-redesign #productDetailModal #productDetailContent .detail-catalog-card{contain:none!important}
html body.oppo-redesign #catalogo #catalogGrid .catalog-card img,
html body.oppo-redesign #productDetailModal #productDetailContent img{will-change:auto!important}

/* Blend the complete photo surface, not the decoded image layer, on mobile WebKit. */
html body.oppo-redesign #catalogo #catalogGrid .catalog-card .catalog-image-wrap,
html body.oppo-redesign #featuredGrid .product-card .featured-image-wrap{
 background:transparent!important;mix-blend-mode:multiply!important;overflow:visible!important;contain:none!important;isolation:auto!important;transform:none!important;filter:none!important;will-change:auto!important;
}
html body.oppo-redesign #catalogo #catalogGrid .catalog-card .catalog-image-wrap img,
html body.oppo-redesign #featuredGrid .product-card .featured-image-wrap img{
 mix-blend-mode:normal!important;background:transparent!important;opacity:1!important;will-change:auto!important;
}
/* One compact vertical column, kept clear of the mobile safe area. */
/* Give WebKit a painted cream backdrop inside the photo's own blend group.
   The outer multiply still lets the moving page background show through. */
@media(max-width:900px),(pointer:coarse){
 html body.oppo-redesign #catalogo #catalogGrid .catalog-card .catalog-image-wrap,
 html body.oppo-redesign #catalogo #catalogGrid .catalog-card:is(:active,:hover,:focus,.has-product-tilt) .catalog-image-wrap.image-squareish,
 html body.oppo-redesign #featuredGrid .product-card .featured-image-wrap,
 html body.oppo-redesign #featuredGrid .product-card:is(:active,:hover,:focus,.has-product-tilt) .featured-image-wrap{
  background:#fff9eb!important;isolation:isolate!important;
 }
 html body.oppo-redesign #catalogo #catalogGrid .catalog-card .catalog-image-wrap img,
 html body.oppo-redesign #featuredGrid .product-card .featured-image-wrap img{
  mix-blend-mode:multiply!important;
 }
}
html body.oppo-redesign:not(.admin-page) .floating-actions,
html body.oppo-redesign:not(.admin-page) .floating-actions.bp-covered{
 flex-direction:column!important;align-items:center!important;gap:9px!important;width:44px!important;right:max(12px,env(safe-area-inset-right))!important;bottom:calc(20px + env(safe-area-inset-bottom))!important;
}
html body.oppo-redesign .floating-actions .instagram{order:1}
html body.oppo-redesign .floating-actions .whatsapp{order:2}
html body.oppo-redesign .floating-actions .mascot-launcher{order:3}
html body.oppo-redesign .floating-actions .floating-cart{order:4}

/* Legacy 3D backface rules can isolate a card's blend backdrop in WebKit. */
html body.oppo-redesign #catalogo #catalogGrid .catalog-card,
html body.oppo-redesign #featuredGrid .product-card,
html body.oppo-redesign #productDetailModal #productDetailContent .detail-catalog-card{
 backface-visibility:visible!important;-webkit-backface-visibility:visible!important;perspective:none!important;transform-style:flat!important;contain:none!important;overflow:visible!important;
}
