/* Show me + facts (owner 2026-10-29, design 7 + 6, layout A; kg-themes.js). Loaded only where Admin › Map access ticks
   "Show me list and facts strip" – Public and Investor by default. */

/* ---- the facts strip under the top bar: the numbers that sell, each opens its question ---- */
#kgfacts { flex:0 0 auto; display:flex; align-items:stretch; background:#1f2d3a; border-top:1px solid rgba(255,255,255,.08); overflow-x:auto; scrollbar-width:none; }
#kgfacts::-webkit-scrollbar { display:none; }
#kgfacts .kf { flex:1 0 auto; display:flex; flex-direction:column; justify-content:center; gap:1px; padding:5px 16px; border:0; border-right:1px solid rgba(255,255,255,.08);
  background:none; color:#fff; text-align:left; font:inherit; cursor:pointer; min-height:40px; }
#kgfacts .kf:hover, #kgfacts .kf:focus-visible { background:rgba(255,255,255,.06); outline:none; }
#kgfacts .kf.on { background:rgba(250,193,28,.14); }
#kgfacts .kf b { font:700 15px/1.1 system-ui, sans-serif; color:#fac11c; white-space:nowrap; }
#kgfacts .kf span { font:12px/1.2 system-ui, sans-serif; color:#b8c5d1; white-space:nowrap; }
#kgfacts .kf.nolink { cursor:default; } #kgfacts .kf.nolink:hover { background:none; }
#kgfacts .kfx { flex:0 0 auto; border:0; background:none; color:#8fa1b1; font:16px/1 system-ui, sans-serif; padding:0 12px; cursor:pointer; }
#kgfacts .kfx:hover { color:#fff; }
/* folded: one small tab, the map keeps its full height */
#kgfacts.fold { background:none; border:0; height:0; overflow:visible; position:relative; z-index:20; }
#kgfacts.fold .kf { display:none; }
#kgfacts.fold .kfx { position:absolute; right:12px; top:0; padding:2px 10px 3px; border-radius:0 0 8px 8px; background:#1f2d3a; color:#fac11c; font:600 11.5px system-ui, sans-serif; }
body.touring #kgfacts, body.presenting #kgfacts, body.kiosk #kgfacts { display:none; }

/* ---- Show me: the questions as big buttons, in the answer panel's place, when nothing else is open ---- */
#kgshow { order:-2; width:350px; flex:0 0 350px; background:#fff; color:#17222c; border-right:1px solid #d9d5cc; display:flex; flex-direction:column;
  gap:10px; padding:14px 16px; overflow:auto; font:14px/1.45 system-ui, sans-serif; }
#kgshow[hidden] { display:none; }
#kgshow .qh { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
#kgshow h2 { font-size:19px; line-height:1.2; margin:0; }
#kgshow .qx { border:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 12H6M11 6l-6 6 6 6' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/60% no-repeat, #c9a43a; color:transparent; overflow:hidden; width:30px; height:30px; flex:0 0 30px; border-radius:50%; font-size:0; padding:0; display:inline-grid; place-items:center; cursor:pointer; box-shadow:0 1px 3px rgba(0,0,0,.25); }
#kgshow .qx:hover, #kgshow .qx:focus-visible { background-color:#a8851f; outline:2px solid #7a5600; outline-offset:2px; }
#kgshow .lede { margin:0; color:#5b6670; font-size:13px; }
#kgshow .kt { display:flex; align-items:center; gap:12px; width:100%; border:2px solid #ece8de; background:#fff; border-radius:10px; padding:10px 12px;
  cursor:pointer; text-align:left; font:inherit; color:#17222c; }
#kgshow .kt:hover, #kgshow .kt:focus-visible { border-color:#e0a91f; outline:none; background:#fffaf0; }
#kgshow .kt i { font-style:normal; flex:0 0 34px; width:34px; height:34px; border-radius:9px; display:grid; place-items:center; background:#17222c; color:#fac11c; font-size:17px; }
#kgshow .kt b { display:block; font-size:15px; }
#kgshow .kt small { display:block; font-size:12.5px; color:#6b7680; line-height:1.3; }
#kgshow .qf { display:flex; gap:8px; margin-top:auto; padding-top:4px; }
#kgshow .qf button { border:1px solid #d9d5cc; background:#fff; border-radius:8px; padding:7px 12px; cursor:pointer; font:600 13px system-ui, sans-serif; color:#17222c; }

/* ---- the answer panel's own footer: back to Show me, and Next (a mini tour without starting a tour) ---- */
#kgq .kgstep { display:flex; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid #e3e6ea; padding-top:10px; }
#kgq .kgstep span { font-size:12px; color:#6b7680; }
#kgq .kgstep button { border:1px solid #d9d5cc; background:#fff; border-radius:8px; padding:6px 11px; cursor:pointer; font:600 13px system-ui, sans-serif; color:#17222c; }
#kgq .kgstep .kgnext { background:#fac11c; border-color:#fac11c; }

@media (max-width:760px) {
  #kgfacts .kf { padding:4px 12px; min-height:36px; } #kgfacts .kf b { font-size:13.5px; } #kgfacts .kf span { font-size:10.5px; }
  #kgshow { display:none !important; }   /* (a phone keeps its Explore sheet) */
}
