/* JLCFDN — Hide Blocks qty controls when locked; show static qty text */

.wc-block-cart-item__quantity.jlcfdn-qty-locked-visible button,
.wc-block-cart-item__quantity.jlcfdn-qty-locked-visible input,
.wc-block-checkout-item__quantity.jlcfdn-qty-locked-visible button,
.wc-block-checkout-item__quantity.jlcfdn-qty-locked-visible input {
  display: none !important;
}

.wc-block-cart-item__quantity.jlcfdn-qty-locked-visible .jlcfdn-qty-static,
.wc-block-checkout-item__quantity.jlcfdn-qty-locked-visible .jlcfdn-qty-static {
  display: inline-block;
  font-weight: 600;
}

/* Remove control: always visible, with a clear label */
html body tr.wc-block-cart-items__row.jlcfdn-locked-item .jlcfdn-remove-badge,
html body .jlcfdn-locked-item .jlcfdn-remove-badge,
html body .jlcfdn-locked-item .wc-block-cart-item__remove-link.jlcfdn-remove-unhide {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  text-decoration: none;
}

/* Storefront/Blocks sometimes fades the remove control until hover. Force it visible. */
html body tr.wc-block-cart-items__row.jlcfdn-locked-item .wc-block-cart-item__remove-link,
html body tr.wc-block-cart-items__row.jlcfdn-locked-item .jlcfdn-remove-badge {
  opacity: 1 !important;
  visibility: visible !important;
  color: #000 !important;
}

html body tr.wc-block-cart-items__row.jlcfdn-locked-item .wc-block-cart-item__remove-link:hover,
html body tr.wc-block-cart-items__row.jlcfdn-locked-item .jlcfdn-remove-badge:hover {
  color: rgba(0,0,0,0.5) !important;
}

/* Place remove control beside the thumbnail with comfortable spacing.
   IMPORTANT: Keep the <td> as a table-cell (do NOT change its display), or
   Storefront + Blocks can cause the image column to overlap the product text.
   We flex the wrapper we inject inside the cell instead. */
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image {
  vertical-align: top;
  width: 120px; /* prevent product column overlap in some Storefront layouts */
}
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image > .jlcfdn-image-wrap {
  display: block;
}
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image > .jlcfdn-image-wrap > a { display: block; }

/* Put the remove control ABOVE the image to avoid column overlap issues while
   keeping it obvious and always visible. */
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image .jlcfdn-remove-badge {
  display: inline-flex !important;
  margin: 0 0 10px 0;
}

html body .jlcfdn-locked-item .jlcfdn-remove-badge .jlcfdn-remove-x {
  font-weight: 800;
  line-height: 1;
  font-size: 18px;
}

html body .jlcfdn-locked-item .jlcfdn-remove-badge .jlcfdn-remove-label {
  font-size: 12px;
  line-height: 1.1;
  text-decoration: underline;
}

/* Ensure thumbnail remains visible when we add the remove control to the image cell. */
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image img {
  display: block;
  max-width: 80px;
  height: auto;
}
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image .jlcfdn-remove-badge,
html body tr.wc-block-cart-items__row.jlcfdn-locked-item > td.wc-block-cart-item__image .wc-block-cart-item__remove-link.jlcfdn-remove-badge {
  flex: 0 0 auto;
  padding: 8px 10px !important;
  border-radius: 6px;
}
/* Add a little breathing room between the × and the label. */
html body .jlcfdn-locked-item .jlcfdn-remove-badge .jlcfdn-remove-x {
  margin-right: 4px;
}
