/* Bunklow Share button and share panel (Randy, Nov 1 2026, about 11:49 AM PT: "Can she easily share on her SM??").
   Share is a Liquid Glass button (LOCKS 1.4, style #6): dark navy translucent pill, soft light edge, gentle sheen,
   quiet depth shadow, white Fredoka text. Never orange. Uses the --bk-glass-* settings from /brand/bk-glass-v1.css,
   with the same values as fallbacks (as bk-listing-mic-v1.css does).
   Added to every company page and every company listing page at build time by tools/stamp-build.mjs, with
   /brand/bk-share-v1.js. Nothing else on those pages is restyled: the script puts the button in a small row beside
   "Claim this page", "See all of ... homes" and "Ask about this home", and the row keeps the margins and height of
   the item it holds. */
@font-face{font-family:Fredoka;src:url(/brand/fonts/Fredoka.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}

/* The row that holds an existing item and the Share button */
.bk-share-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.bk-share-row--center{justify-content:center}
.bk-share-row--tight{gap:6px}
.bk-mic-row.bk-share-row--tight{gap:6px}
.bk-share-row--split{justify-content:space-between}
.bk-share-row>.bk-share-anchor{flex:0 0 auto;max-width:100%}
.bk-share-row--center>.bk-share-anchor{margin:0!important}

/* The button */
.bk-share-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;box-sizing:border-box;flex:0 0 auto;
  min-height:36px;min-width:36px;margin:0;padding:0 16px;border-radius:999px;cursor:pointer;color:#fff;
  font-family:Fredoka,ui-rounded,system-ui,sans-serif;font-size:15px;font-weight:600;line-height:1.1;text-align:center;text-decoration:none;text-shadow:0 1px 1px rgba(2,8,24,.35);
  background:var(--bk-glass-bg,linear-gradient(180deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.02) 48%,rgba(255,255,255,0) 52%),linear-gradient(180deg,rgba(22,42,80,.9) 0%,rgba(26,46,86,.9) 46%,rgba(44,66,108,.92) 100%));
  border:1px solid var(--bk-glass-line,rgba(206,217,240,.52));
  box-shadow:var(--bk-glass-shadow,inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(8,16,40,.28),0 6px 14px -6px rgba(2,8,24,.6));
  -webkit-backdrop-filter:var(--bk-glass-blur,blur(8px) saturate(1.3));backdrop-filter:var(--bk-glass-blur,blur(8px) saturate(1.3));
  -webkit-tap-highlight-color:transparent}
.bk-share-btn:hover{filter:brightness(1.14);border-color:var(--bk-glass-line-hover,rgba(232,240,255,.78))}
.bk-share-btn:active{transform:scale(.96)}
.bk-share-btn:focus-visible,.bk-share-item:focus-visible{outline:3px solid #1d4ed8;outline-offset:2px}
.bk-share-btn svg{width:18px;height:18px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
/* Phones and tablets: a real tap target */
@media (max-width:900px){.bk-share-btn{min-height:44px;min-width:44px}}
/* Beside "Claim this page" and "Ask about this home" the button is as tall as they are */
.bk-share-row--center>.bk-share-btn,.bk-mic-row>.bk-share-btn{min-height:48px}
.bk-share-row--center>.bk-share-btn--icon,.bk-mic-row>.bk-share-btn--icon{width:48px}
/* Round icon only version, used when the label would not fit beside the item. The word Share stays for screen readers. */
.bk-share-btn--icon{width:44px;padding:0;gap:0}
.bk-share-btn--icon .bk-share-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (min-width:901px){.bk-share-btn--icon{width:36px}}

/* The panel (computers and any browser without a phone share sheet) */
.bk-share-panel{position:fixed;z-index:2000;box-sizing:border-box;width:300px;max-width:calc(100vw - 24px);margin:0;padding:14px;border-radius:22px;
  color:#fff;font-family:Fredoka,ui-rounded,system-ui,sans-serif;text-align:left;
  background:var(--bk-glass-bg,linear-gradient(180deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.02) 48%,rgba(255,255,255,0) 52%),linear-gradient(180deg,rgba(22,42,80,.9) 0%,rgba(26,46,86,.9) 46%,rgba(44,66,108,.92) 100%)),#162a50;
  border:1px solid var(--bk-glass-line,rgba(206,217,240,.52));
  box-shadow:var(--bk-glass-shadow,inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(8,16,40,.28),0 6px 14px -6px rgba(2,8,24,.6)),0 18px 40px -12px rgba(2,8,24,.55);
  -webkit-backdrop-filter:var(--bk-glass-blur,blur(8px) saturate(1.3));backdrop-filter:var(--bk-glass-blur,blur(8px) saturate(1.3))}
.bk-share-panel[hidden]{display:none}
.bk-share-title{margin:0 2px 10px;color:#fff;font-size:16px;font-weight:600;line-height:1.3}
.bk-share-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bk-share-item{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:44px;margin:0;padding:6px 10px;border-radius:999px;cursor:pointer;
  color:#fff;font-family:Fredoka,ui-rounded,system-ui,sans-serif;font-size:15px;font-weight:500;line-height:1.15;text-align:center;text-decoration:none;
  background:rgba(255,255,255,.08);border:1px solid rgba(206,217,240,.34);-webkit-tap-highlight-color:transparent}
button.bk-share-item{appearance:none;-webkit-appearance:none}
.bk-share-item:hover{background:rgba(255,255,255,.16);border-color:var(--bk-glass-line-hover,rgba(232,240,255,.78))}
.bk-share-item:active{transform:scale(.97)}
.bk-share-status{min-height:1.2em;margin:10px 2px 0;color:#d6e4fb;font-size:14px;line-height:1.3}
/* On phone sized screens the panel is a sheet at the bottom */
@media (max-width:480px){.bk-share-panel{left:12px!important;right:12px!important;top:auto!important;bottom:12px!important;width:auto;max-width:none}}
@media (prefers-reduced-motion:no-preference){.bk-share-btn,.bk-share-item{transition:transform .15s ease-out,filter .15s,border-color .15s,background-color .15s}}
@media print{.bk-share-btn,.bk-share-panel{display:none!important}}
