/* d2.css - build d2: shortlist hearts, compare ticks, compare bar, toast */
.pl-card, .hp-card{ position:relative; }
.d2-act{ position:absolute; top:10px; left:10px; right:10px; display:flex; justify-content:space-between; gap:6px; pointer-events:none; z-index:2; }
.d2-act .d2-btn{ pointer-events:auto; }
.d2-btn{ display:inline-flex; align-items:center; gap:5px; background:rgba(255,255,255,.94); color:#2b2519; border:1px solid rgba(0,0,0,.12); border-radius:999px;
  padding:5px 11px; font:600 12px 'Jost',sans-serif; cursor:pointer; user-select:none; box-shadow:0 1px 4px rgba(0,0,0,.15); line-height:1.2; }
.d2-btn:hover, .d2-btn:focus{ background:#fff; outline:none; box-shadow:0 2px 8px rgba(0,0,0,.22); }
.d2-btn:focus-visible{ outline:2px solid var(--gold,#B8893A); outline-offset:2px; }
.d2-heart{ margin-left:auto; padding:5px 9px; order:2; }
.d2-heart .d2-ico{ font-size:17px; line-height:1; color:#8C3A2E; }
.d2-heart.on{ background:#fff; border-color:#8C3A2E; }
.d2-heart.busy{ opacity:.55; pointer-events:none; }
.d2-cmp{ order:1; }
.d2-cmp .d2-ico{ font-size:13px; }
.d2-cmp.on{ background:var(--maroon,#8C3A2E); color:#fff; border-color:var(--maroon,#8C3A2E); }
/* on the listing page the buttons sit in the text flow */
.d2-host{ margin:-4px 0 14px; }
.d2-act.d2-inline{ position:static; display:flex; justify-content:flex-start; gap:8px; pointer-events:auto; }
.d2-inline .d2-btn{ box-shadow:none; background:#fff; padding:7px 14px; font-size:13px; }
.d2-inline .d2-heart{ margin-left:0; order:0; }
.d2-inline .d2-cmp{ order:1; }
/* compact views hide the overlay buttons except the heart */
#plSplit[data-view=list] .d2-act, #plSplit[data-view=gallery] .d2-act{ top:6px; left:auto; right:8px; justify-content:flex-end; }
#plSplit[data-view=list] .d2-cmp, #plSplit[data-view=gallery] .d2-cmp .d2-lbl{ display:none; }
#plSplit[data-view=list] .d2-heart{ padding:3px 7px; }
.d2-bar{ position:fixed; left:50%; bottom:16px; transform:translate(-50%,140%); transition:transform .22s ease; z-index:60; display:flex; align-items:center; gap:12px;
  background:#2b2519; color:#fff; border-radius:999px; padding:9px 12px 9px 20px; box-shadow:0 8px 28px rgba(0,0,0,.3); font:500 13.5px 'Jost',sans-serif; max-width:calc(100vw - 24px); }
.d2-bar.show{ transform:translate(-50%,0); }
.d2-bar-go{ background:var(--gold,#B8893A); color:#fff; text-decoration:none; font-weight:700; padding:7px 16px; border-radius:999px; white-space:nowrap; }
.d2-bar-go.off{ opacity:.45; pointer-events:none; }
.d2-bar-x{ background:transparent; border:0; color:#E4CFA3; font:600 13px 'Jost',sans-serif; cursor:pointer; text-decoration:underline; padding:4px 6px; }
.d2-toast{ position:fixed; left:50%; bottom:76px; transform:translate(-50%,20px); opacity:0; pointer-events:none; transition:opacity .2s, transform .2s; z-index:61;
  background:#fff; color:#241E14; border:1px solid var(--line,#E7DFC9); border-left:4px solid var(--maroon,#8C3A2E); border-radius:8px; padding:11px 16px; font:500 13.5px 'Jost',sans-serif;
  box-shadow:0 8px 24px rgba(0,0,0,.18); max-width:calc(100vw - 24px); }
.d2-toast.show{ opacity:1; transform:translate(-50%,0); pointer-events:auto; }
.d2-toast a{ color:var(--maroon,#8C3A2E); font-weight:700; margin-left:4px; }
@media (max-width:520px){ .d2-bar{ gap:8px; padding-left:14px; font-size:12.5px; } .d2-btn{ padding:5px 9px; } }
@media (prefers-reduced-motion:reduce){ .d2-bar, .d2-toast{ transition:none; } }