/* Top picks box on the safari gear buying guides (category 68, safari-gear-clothing) and page 10537.
   Loaded by inc/top-picks.php only on those views. Kept out of style.css on purpose.
   Two markups share one look:
   1. New boxes:     div.top-picks-panel > div.top-picks-title + div.top-picks-row > span.top-picks-text + a.aff
   2. Linked legacy pick panels (pick-panel, quick-pick, picks-panel, lens-panel): their own classes stay as they are;
      a div.top-picks-title is added as the first child and each linked row wraps its text in span.top-picks-text.
   Square corners, savanna gold, Outfit labels, 44px tap targets. Without this file both fall back to the theme's ruled panel. */

/* Affiliate disclosure: darker text so it is clearly conspicuous. Size, rule and spacing unchanged. */
.bw-entry div.affiliate-disclosure.affiliate-disclosure{color:var(--bw-ink2)}

/* Panel: gold top rule. */
.bw-entry div.top-picks-panel.top-picks-panel,
.bw-entry div:has(> div.top-picks-title){border-top:3px solid var(--bw-lime)}
.bw-entry div.top-picks-title{border-bottom:1px solid var(--bw-line);font-weight:500}

/* Rows: text left, button right; the button drops under the text on narrow screens. */
.bw-entry div.top-picks-row,
.bw-entry div:has(> span.top-picks-text){display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px}
.bw-entry .top-picks-text{flex:1 1 320px;min-width:0}
.bw-entry .top-picks-text>strong:first-child{color:var(--bw-ink);font-family:'Outfit',sans-serif;font-weight:700}

/* "See on Amazon" button (only a direct child of the row; links inside the text keep the theme style). */
.bw-entry div.top-picks-row>a.aff,
.bw-entry div:has(> span.top-picks-text)>a.aff{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 20px;border-radius:0;background:var(--bw-lime);color:var(--bw-ink);font-family:'Outfit',sans-serif;font-size:16px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;transition:background .2s ease}
.bw-entry div.top-picks-row>a.aff:hover,
.bw-entry div:has(> span.top-picks-text)>a.aff:hover{background:var(--bw-lime2)}
.bw-entry div.top-picks-row>a.aff:focus-visible,
.bw-entry div:has(> span.top-picks-text)>a.aff:focus-visible{outline:2px solid var(--bw-ink);outline-offset:2px}
