/* Speech bubble — shared two-click delete
   confirmation for cart item removal and address deletion
   (assets/js/confirm-bubble.js). Appended as a child of the trigger
   itself, which just needs to already be a positioning context. */
.confirm-bubble {
  position: absolute;
  z-index: 15; /* above the sticky header (10/11, header.css), below the menu overlay (20, menu.css) */
  right: 100%;
  bottom: 50%; /* bubble's own bottom edge sits at the trigger's vertical center */
  margin-right: 0.5rem;
  width: 6.3125rem; /* shape resizes, text stays full size */
  height: 6.3rem; /* 100.8px */
  display: flex;
  align-items: center;
  justify-content: center;
  /* only ever built once the image is confirmed loaded (confirm-bubble.js),
     so this fades in a complete, already-paintable bubble — never an empty
     shape with the image popping in separately after */
  animation: confirm-bubble-fade-in 0.25s ease backwards;
}

/* top-layer variant (confirm-bubble.js) for triggers inside the header
   popovers, which would otherwise crop it. Position comes from JS since
   it's detached from its trigger; the rest cancels the UA popover chrome
   (centring inset/margin, border, padding, canvas background). */
.confirm-bubble--floating {
  position: fixed;
  inset: auto;
  margin: 0;
  border: 0;
  padding: 0;
  background: none;
  overflow: visible;
}

@keyframes confirm-bubble-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.confirm-bubble__shape {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.confirm-bubble__text {
  position: relative;
  width: 100%;
  padding: 1.125rem 1rem 1.5rem;
  font-size: var(--text-caption); /* 13px */
  line-height: 1.1;
  text-align: center;
}

.confirm-bubble__cta {
  font-weight: var(--weight-medium);
}