/**
 * Additional cart dropdown fixes with maximum specificity
 */
/* In your theme's CSS file */
/* In your theme's CSS file */
@media (max-width: 1023px) {
  /* Hide desktop cart on mobile */
  .lg\:tw-hidden + .lg\:tw-flex .cart--cart-block {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  /* Hide mobile cart on desktop */
  .mobile-cart-wrapper .cart--cart-block {
    display: none !important;
  }
}
/* Ensure cart block is above other elements */
body header .region-top-bar-left {
  position: static !important;
}

/* Set parent containers to allow proper stacking context */
body header .region-top-bar-left > * {
  position: relative !important;
  z-index: 999 !important;
}

/* Make cart dropdown container correctly positioned */
body .cart--cart-block {
  position: relative !important;
  z-index: 1000 !important;
}

/* Ensure cart button is clickable and above all overlays */
body .cart-block--link__expand {
  position: relative !important;
  z-index: 1001 !important;
  pointer-events: auto !important;
}

/* Fix for cart dropdown positioning - JS will handle exact positioning */
body .cart-block--contents {
  position: absolute !important;
  width: 280px !important;
  min-width: 200px !important;
  max-width: 90vw !important;
  border-radius: 0.375rem !important;
  display: none !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Only show dropdown when it has the expanded class */
body .cart-block--contents.cart-block--contents__expanded {
  display: block !important;
  z-index: 1002 !important;
  pointer-events: auto !important;
}

/* Explicit color rules for cart icon */
body .cart--cart-block .cart-block--summary__icon svg {
  fill: none !important;
}

/* Light mode - explicit dark color */
html:not(.tw-dark) .cart--cart-block .cart-block--summary__icon svg,
html:not([data-theme="dark"]) .cart--cart-block .cart-block--summary__icon svg {
  stroke: #1a202c !important;
  color: #1a202c !important;
}

/* Dark mode - explicit white color */
html.tw-dark .cart--cart-block .cart-block--summary__icon svg,
html[data-theme="dark"] .cart--cart-block .cart-block--summary__icon svg {
  stroke: #ffffff !important;
  color: #ffffff !important;
}