/* SDG recommendations in the dock (goes.js): on the dark dock panel, in its own colours (white text, quiet white pills,
   the beige of Fit for the dog's size). The card shows one suggestion as a row; the bag a strip of up to three that
   scrolls sideways, so the bag's lines keep their room. Every rule starts at .sdg-goes, above the theme's button rules. */
.sdg-dock__cextra:empty{display:none}
.sdg-goes{margin:12px 0 0;padding:12px 0 0;border-top:1px solid rgba(255,255,255,.14);color:var(--sdg-dock-text,#fff);font-size:13px;line-height:1.3;text-align:left}
.sdg-goes .sdg-goes__title{margin:0 0 8px;padding:0;color:inherit;font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.06em;line-height:1.2;text-transform:uppercase;opacity:.78}
.sdg-goes .sdg-goes__list{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.sdg-goes .sdg-goes__item{display:flex;align-items:center;gap:10px;min-width:0;margin:0;padding:0;list-style:none}
.sdg-goes .sdg-goes__img{flex:0 0 52px;width:52px;height:52px;border-radius:10px;background:#fff center/cover no-repeat}
.sdg-goes .sdg-goes__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px}
.sdg-goes .sdg-goes__name{overflow:hidden;color:inherit;font-weight:600;text-decoration:none;white-space:nowrap;text-overflow:ellipsis}
.sdg-goes .sdg-goes__name:hover{color:inherit;text-decoration:underline}
.sdg-goes .sdg-goes__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:12px}
.sdg-goes .sdg-goes__meta>span:not(.sdg-goes__fit):not(.sdg-goes__price){opacity:.78}
.sdg-goes .sdg-goes__fit{padding:3px 9px;border-radius:999px;background:#cab29f;color:#191919;font-weight:700;line-height:1.2}
.sdg-goes .sdg-goes__price{font-weight:700}
.sdg-goes .sdg-goes__price del{color:rgba(255,255,255,.62);font-weight:500;opacity:1} /* the theme colours del dark: on the dark panel it must stay readable */
.sdg-goes .sdg-goes__price .is-sale{color:#ff6b6a}
.sdg-goes .sdg-goes__add{all:unset;box-sizing:border-box;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:64px;min-height:40px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.14);color:var(--sdg-dock-text,#fff);font-size:13px;font-weight:700;line-height:1;white-space:nowrap;text-decoration:none;cursor:pointer;transition:background-color .15s}
.sdg-goes .sdg-goes__add:hover,.sdg-goes .sdg-goes__add:focus{background:rgba(255,255,255,.24);color:var(--sdg-dock-text,#fff)}
.sdg-goes .sdg-goes__add:focus-visible{outline:2px solid #fff;outline-offset:2px}
.sdg-goes .sdg-goes__add.is-busy{opacity:.7;cursor:default}
.sdg-goes .sdg-goes__add.is-done{background:#cab29f;color:#191919;cursor:default}
.sdg-goes .sdg-goes__err{flex-basis:100%;margin:4px 0 0;color:#ff8a89;font-size:12px}
.sdg-goes .sdg-goes__item:has(.sdg-goes__err){flex-wrap:wrap}

/* the bag: a strip that scrolls sideways (finger, trackpad), one card a little narrower than the panel */
.sdg-goes--bag{flex:0 0 auto;margin:0;padding:10px 0 0}
.sdg-goes--bag .sdg-goes__list{flex-direction:row;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.sdg-goes--bag .sdg-goes__list::-webkit-scrollbar{display:none}
.sdg-goes--bag .sdg-goes__item{flex:0 0 min(300px,86%);scroll-snap-align:start;padding:8px;border-radius:14px;background:rgba(255,255,255,.07)}
.sdg-goes--bag .sdg-goes__item:only-child{flex-basis:100%}
@media (prefers-reduced-motion:reduce){.sdg-goes *{transition:none!important}}