/* bw_productcompare — compare bar, toast and the /vergelijken comparison table.
   The tile button circle itself is styled by the theme (brand.css, shared with the
   wishlist button); here we only add compare-specific pieces. */

/* notification toast (added / removed / max) — light box like live, with a view link */
.bw-compare-toast {
  position: fixed; top: 90px; left: 50%; z-index: 1060;
  transform: translate(-50%, -12px); opacity: 0;
  transition: opacity .25s ease, transform .25s ease;
  display: flex; align-items: center; gap: .85rem; max-width: 92vw;
  background: #fff; color: var(--tb-dark, #30373E);
  border: 1px solid #ececec; border-left: 4px solid var(--tb-gold, #DAA14C);
  padding: .85rem 1.1rem; border-radius: 6px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .14);
}
.bw-compare-toast.is-shown { opacity: 1; transform: translate(-50%, 0); }
.bw-compare-toast__msg { font-size: .92rem; }
.bw-compare-toast__link { color: var(--tb-gold, #DAA14C); font-weight: 700; text-decoration: none; white-space: nowrap; }
.bw-compare-toast__link:hover { text-decoration: underline; }
.bw-compare-toast__close {
  background: transparent; border: 0; font-size: 1.3rem; line-height: 1;
  color: #b5b5b5; cursor: pointer; padding: 0 .15rem; margin-left: .15rem;
}
.bw-compare-toast__close:hover { color: var(--tb-dark, #30373E); }

/* comparison page */
.bw-compare__scroll { overflow-x: auto; }
.bw-compare__table { width: 100%; border-collapse: collapse; min-width: 640px; }
.bw-compare__table th,
.bw-compare__table td {
  border: 1px solid #ececec; padding: 1rem; text-align: left; vertical-align: top;
}
.bw-compare__rowhead { width: 180px; background: #fafafa; font-weight: 700; color: var(--tb-dark, #30373E); }
.bw-compare__col { position: relative; text-align: center; width: auto; }
.bw-compare__remove {
  position: absolute; top: .35rem; right: .5rem; border: 0; background: transparent;
  font-size: 1.4rem; line-height: 1; color: #b5b5b5; cursor: pointer;
}
.bw-compare__remove:hover { color: var(--tb-dark, #30373E); }
.bw-compare__media { display: block; }
.bw-compare__media img { max-width: 160px; height: auto; margin: 0 auto .75rem; }
.bw-compare__name { display: block; font-weight: 700; color: var(--tb-dark, #30373E); text-decoration: none; margin-bottom: .35rem; }
.bw-compare__name:hover { color: var(--tb-gold, #DAA14C); }
.bw-compare__price { font-size: 1.15rem; font-weight: 800; color: var(--tb-gold, #DAA14C); margin-bottom: .75rem; }
.bw-compare__cell { text-align: center; }
.bw-compare__empty { padding: 2rem 0; color: #777; }
