/* SG Organic colorful feature icon system — v1.9.10.25
 * Feature/module icons only. Utility icons (arrows, chevrons, close, share,
 * search, plus/minus, quantity controls) remain unchanged.
 *
 * IMPORTANT: one source of truth for feature icon sizing.
 * Default artwork size is 64px. Only explicitly compact/inline contexts are smaller.
 */

.sgo-feature-icon{
  display:block;
  width:64px !important;
  height:64px !important;
  min-width:0;
  min-height:0;
  max-width:64px !important;
  max-height:64px !important;
  object-fit:contain;
  transform-origin:50% 55%;
  will-change:transform;
  pointer-events:none;
  user-select:none;
}

/* Explicit size modifiers — use only when a feature icon genuinely needs to be compact. */
.sgo-feature-icon.is-sm{width:32px !important;height:32px !important;max-width:32px !important;max-height:32px !important}
.sgo-feature-icon.is-md{width:40px !important;height:40px !important;max-width:40px !important;max-height:40px !important}
.sgo-feature-icon.is-lg{width:52px !important;height:52px !important;max-width:52px !important;max-height:52px !important}
.sgo-feature-icon.is-xl{width:64px !important;height:64px !important;max-width:64px !important;max-height:64px !important}

.sgo-feature-icon-wrap{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

/* Signed-out My Account hero */
.sgo-pa-guest-icon{
  width:84px !important;
  height:84px !important;
  border-radius:24px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.sgo-pa-guest-icon .sgo-feature-icon{
  width:64px !important;
  height:64px !important;
  max-width:64px !important;
  max-height:64px !important;
}

/* Account summary cards */
.sgo-pa-stat-icon{
  width:56px !important;
  height:56px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.sgo-pa-stat-icon .sgo-feature-icon{
  width:48px !important;
  height:48px !important;
  max-width:48px !important;
  max-height:48px !important;
}

/* Main account shortcuts — requested 64px artwork */
.sgo-pa-shortcut-icon{
  width:64px !important;
  height:64px !important;
  min-width:64px !important;
  min-height:64px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.sgo-pa-shortcut-icon .sgo-feature-icon{
  width:64px !important;
  height:64px !important;
  max-width:64px !important;
  max-height:64px !important;
}

/* My Purchases states */
.sgo-pa-big-icon{
  width:64px !important;
  height:64px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.sgo-pa-big-icon .sgo-feature-icon{
  width:56px !important;
  height:56px !important;
  max-width:56px !important;
  max-height:56px !important;
}

/* Smaller account feature actions */
.sgo-pa-profile-settings .sgo-feature-icon{width:36px !important;height:36px !important;max-width:36px !important;max-height:36px !important}
.sgo-pa-vendor-dashboard .sgo-feature-icon{width:34px !important;height:34px !important;max-width:34px !important;max-height:34px !important}

/* Cart feature icons */
.sgo-cart-row-icon .sgo-feature-icon,
.sgo-cart-emoji .sgo-feature-icon{
  width:44px !important;
  height:44px !important;
  max-width:44px !important;
  max-height:44px !important;
}
.sgo-cart-shipping-icon{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.sgo-cart-shipping-icon .sgo-feature-icon{
  width:52px !important;
  height:52px !important;
  max-width:52px !important;
  max-height:52px !important;
}

/* Checkout feature icons */
.sgo-co-emoji{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
}
.sgo-co-emoji .sgo-feature-icon{width:46px !important;height:46px !important;max-width:46px !important;max-height:46px !important}
.sgo-co-emoji.is-inline .sgo-feature-icon{width:34px !important;height:34px !important;max-width:34px !important;max-height:34px !important}
.sgo-co-rate__icon .sgo-feature-icon{width:52px !important;height:52px !important;max-width:52px !important;max-height:52px !important}
.sgo-co-package__head .sgo-feature-icon{width:46px !important;height:46px !important;max-width:46px !important;max-height:46px !important}
.sgo-co-vendor__head .sgo-feature-icon{width:40px !important;height:40px !important;max-width:40px !important;max-height:40px !important}
.sgo-co-card__head .sgo-feature-icon,
.sgo-co-payment-head .sgo-feature-icon{width:46px !important;height:46px !important;max-width:46px !important;max-height:46px !important}

/* Semantic motion — feature icons only, never utility icons. */
@media (hover:hover) and (pointer:fine){
  .sgo-pa-shortcut:hover .sgo-feature-icon--profile,.sgo-pa-stat:hover .sgo-feature-icon--profile,.sgo-pa-profile-settings:hover .sgo-feature-icon--profile{animation:sgo-fi-lift .28s ease-out}
  .sgo-pa-shortcut:hover .sgo-feature-icon--addresses,.sgo-pa-stat:hover .sgo-feature-icon--addresses{animation:sgo-fi-pin .38s cubic-bezier(.2,.8,.2,1)}
  .sgo-pa-shortcut:hover .sgo-feature-icon--payments{animation:sgo-fi-slide .30s ease-out}
  .sgo-pa-shortcut:hover .sgo-feature-icon--wallet,.sgo-pa-stat:hover .sgo-feature-icon--wallet{animation:sgo-fi-wallet .34s cubic-bezier(.2,.8,.2,1)}
  .sgo-pa-shortcut:hover .sgo-feature-icon--coupons,.sgo-pa-stat:hover .sgo-feature-icon--coupons,.sgo-cart-voucher-row:hover .sgo-feature-icon--coupons,.sgo-co-wallet:hover .sgo-feature-icon--coupons{animation:sgo-fi-wiggle .34s ease-out}
  .sgo-pa-shortcut:hover .sgo-feature-icon--reviews,.sgo-pa-purchase-tile:hover .sgo-feature-icon--reviews{animation:sgo-fi-pop .30s ease-out}
  .sgo-pa-shortcut:hover .sgo-feature-icon--wishlist,.sgo-pa-stat:hover .sgo-feature-icon--wishlist{animation:sgo-fi-heart .42s ease-out}
  .sgo-pa-shortcut:hover .sgo-feature-icon--orders,.sgo-pa-stat:hover .sgo-feature-icon--orders,.sgo-pa-purchase-tile:hover .sgo-feature-icon--orders{animation:sgo-fi-lift .28s ease-out}
  .sgo-pa-purchase-tile:hover .sgo-feature-icon--pending{animation:sgo-fi-receipt .32s ease-out}
  .sgo-pa-purchase-tile:hover .sgo-feature-icon--processing{animation:sgo-fi-truck .34s cubic-bezier(.2,.8,.2,1)}
  .sgo-pa-purchase-tile:hover .sgo-feature-icon--delivered{animation:sgo-fi-drop .34s ease-out}
  .sgo-pa-vendor-dashboard:hover .sgo-feature-icon--shop{animation:sgo-fi-shop .34s ease-out}
  .sgo-cart-shared-copy:hover .sgo-feature-icon--shared-delivery,.sgo-cart-shared-group-head:hover .sgo-feature-icon--shared-delivery,.sgo-cart-delivery-badge:hover .sgo-feature-icon--shared-delivery,.sgo-co-package:hover .sgo-feature-icon--shared-delivery{animation:sgo-fi-truck .34s cubic-bezier(.2,.8,.2,1)}
  .sgo-cart-shipping-option:hover .sgo-feature-icon--shared-delivery,.sgo-co-shipping-option:hover .sgo-feature-icon--shared-delivery{animation:sgo-fi-truck .34s cubic-bezier(.2,.8,.2,1)}
  .sgo-cart-shipping-option:hover .sgo-feature-icon--shop,.sgo-co-shipping-option:hover .sgo-feature-icon--shop{animation:sgo-fi-shop .34s ease-out}
  .sgo-co-payment-head:hover .sgo-feature-icon--payments{animation:sgo-fi-slide .30s ease-out}
  .sgo-co-card:hover .sgo-feature-icon--orders{animation:sgo-fi-receipt .32s ease-out}
  .sgo-co-vendor__head:hover .sgo-feature-icon--shop{animation:sgo-fi-shop .34s ease-out}
  .sgo-co-package:hover .sgo-feature-icon--gift{animation:sgo-fi-gift .34s ease-out}
  .sgo-co-rate:hover .sgo-feature-icon--home{animation:sgo-fi-home .32s ease-out}
  .sgo-co-rate:hover .sgo-feature-icon--shop{animation:sgo-fi-shop .34s ease-out}
  .sgo-co-package:hover .sgo-feature-icon--vendor-delivery{animation:sgo-fi-truck .34s cubic-bezier(.2,.8,.2,1)}
  .sgo-co-card:hover .sgo-feature-icon--coupons{animation:sgo-fi-wiggle .34s ease-out}
}

@keyframes sgo-fi-lift{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(-3px) scale(1.06)}}
@keyframes sgo-fi-pin{0%,100%{transform:translateY(0)}45%{transform:translateY(-4px)}70%{transform:translateY(1px)}}
@keyframes sgo-fi-slide{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@keyframes sgo-fi-wallet{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-2px) rotate(-3deg) scale(1.05)}}
@keyframes sgo-fi-wiggle{0%,100%{transform:rotate(0)}35%{transform:rotate(-5deg)}70%{transform:rotate(4deg)}}
@keyframes sgo-fi-pop{0%,100%{transform:scale(1)}45%{transform:scale(1.16)}75%{transform:scale(1.06)}}
@keyframes sgo-fi-heart{0%,100%{transform:scale(1)}35%{transform:scale(1.14)}65%{transform:scale(1.06)}}
@keyframes sgo-fi-receipt{0%,100%{transform:translateY(0)}45%{transform:translateY(-3px) scale(1.03)}}
@keyframes sgo-fi-truck{0%,100%{transform:translateX(0)}45%{transform:translateX(5px)}70%{transform:translateX(3px)}}
@keyframes sgo-fi-drop{0%{transform:translateY(-2px)}55%{transform:translateY(2px) scale(.98)}100%{transform:translateY(0)}}
@keyframes sgo-fi-shop{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(-2px) scale(1.05)}}
@keyframes sgo-fi-home{0%,100%{transform:translateY(0) scale(1)}45%{transform:translateY(-2px) scale(1.06)}}
@keyframes sgo-fi-gift{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-3px) rotate(-3deg)}70%{transform:translateY(-1px) rotate(2deg)}}

/* Keep mobile feature icons substantial without exceeding the 64px cap. */
@media(max-width:767px){
  .sgo-pa-guest-icon{width:76px !important;height:76px !important;border-radius:22px !important}
  .sgo-pa-guest-icon .sgo-feature-icon{width:60px !important;height:60px !important;max-width:60px !important;max-height:60px !important}
  .sgo-pa-stat-icon{width:44px !important;height:44px !important}
  .sgo-pa-stat-icon .sgo-feature-icon{width:40px !important;height:40px !important;max-width:40px !important;max-height:40px !important}
  .sgo-pa-shortcut-icon,.sgo-pa-shortcut-icon .sgo-feature-icon{width:64px !important;height:64px !important;max-width:64px !important;max-height:64px !important}
  .sgo-pa-big-icon{width:58px !important;height:58px !important}
  .sgo-pa-big-icon .sgo-feature-icon{width:52px !important;height:52px !important;max-width:52px !important;max-height:52px !important}
  .sgo-cart-shipping-icon .sgo-feature-icon{width:48px !important;height:48px !important;max-width:48px !important;max-height:48px !important}
  .sgo-cart-row-icon .sgo-feature-icon,.sgo-cart-emoji .sgo-feature-icon{width:40px !important;height:40px !important;max-width:40px !important;max-height:40px !important}
  .sgo-co-emoji .sgo-feature-icon{width:42px !important;height:42px !important;max-width:42px !important;max-height:42px !important}
}

@media (prefers-reduced-motion:reduce){
  .sgo-feature-icon{animation:none !important;transition:none !important;transform:none !important}
}
