/* BAKORA v4 web - the shared chrome (top bar, flash boxes, footer caption, the gate and token pages), measured from
   the running Streamlit app (ui/theme.top_nav and its CSS) on 8641 at 1440 px, 2026-10-11. Loaded after bakora.css;
   the bar's markup is .bknav (bakora.css's old .topnav rules no longer match it). */

/* ---- the bar: fixed, 0.35rem 2.5rem 0 padding, a 1400 px row of seven columns with 0.5rem gaps ---- */
/* 100vw: the bar spans the window over the page's scrollbar, as Streamlit's does over its scrolling main section */
.bknav { position: fixed; top: 0; left: 0; width: 100vw; z-index: 1000; background: var(--bg);
  border-bottom: 1px solid var(--border); padding: 4.9px 35px 0; }
.bknav-in { max-width: 1400px; margin: 0 auto; display: grid; align-items: center; column-gap: 7px;
  /* the Streamlit columns' measured widths at 1440 px (st.columns shares, gap="small") */
  grid-template-columns: 228.9fr 164.7fr 223.1fr 237.7fr 179.3fr 208.5fr 85.9fr; }
/* the wordmark is Inter: ui/theme's .nav-mark rule sets the div, but the text is its <span>, which .stApp * makes Inter */
.bknav-brand { font: 700 20px var(--font); color: var(--ink); letter-spacing: -0.3px; white-space: nowrap;
  display: flex; align-items: center; height: 37.8px; padding-bottom: 3px; min-width: 0; overflow: hidden; cursor: default; }
.bknav .nav-item { position: relative; text-align: center; min-width: 0; }
.bknav .nav-item > a, .bknav .nav-item > button { display: flex; align-items: center; justify-content: center; width: 100%;
  height: 37.8px; padding: 0 2.8px; margin: 0; border: 0; border-bottom: 3px solid transparent; background: transparent;
  font: 400 14px var(--display); color: var(--ink); text-decoration: none; cursor: pointer; white-space: nowrap; }   /* the label <p> draws 400 (measured on 8641) */
.bknav .nav-item > a:hover, .bknav .nav-item > button:hover { color: var(--ink); background: transparent; }
.bknav .nav-item.active > a, .bknav .nav-item.active > button { border-bottom-color: var(--ink); }
.bknav .nav-item > button:focus-visible, .bknav .nav-item > a:focus-visible { outline: 2px solid rgba(51,51,51,.25); outline-offset: -2px; }
.bknav-label { display: inline-flex; align-items: center; }
/* the menus' chevron as Streamlit lays it (measured on 8641): the label, a 1.75 px gap, a 17.5 px icon box (1.75 px down) with
   the 12 px icon 4.5 px in, and the group's -4.375 px right margin - so the label sits 2.3 px right of a plainly centred pair */
.bknav-chev { width: 12px; height: 12px; margin: 1.75px -3.375px 0 2.25px; flex: none; }   /* + the button's 4 px gap = 6.25 */
/* the hamburger: three 17x2 bars drawn (ui/theme: ::before plus two box-shadows) */
.bknav-lines { display: block; width: 17px; height: 2px; background: currentColor; box-shadow: 0 -5px 0 currentColor, 0 5px 0 currentColor; }
/* the Kuzunik mark before its label: 12x16, 0.3rem from the word, -0.22em (the bar's ::before) */
.bknav-kz { width: 12px; height: 16px; object-fit: contain; margin-right: 4.2px; vertical-align: -0.22em; flex: none; }

/* ---- an open menu (st.popover): 190 px, under its trigger's left edge, rows 28 px on a 42 px pitch ---- */
.bknav-panel { display: none; position: absolute; top: 33.6px; left: -0.7px; min-width: 190px; z-index: 1001;
  flex-direction: column; gap: 14px; padding: 5.6px 4.9px; background: var(--white); border: 0.8px solid var(--white);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16); text-align: left; }
.bknav .nav-item.is-open > .bknav-panel { display: flex; }
.bknav-row { display: flex; align-items: center; height: 28px; padding: 4.2px 7px; font: 400 14px/22.4px var(--font);
  color: var(--ink); text-decoration: none; white-space: nowrap; }
.bknav-row:hover { background: var(--tint); color: var(--ink-soft); }
.bknav-row:focus { outline: none; }    /* a focused row draws nothing (Streamlit's popover rows, measured 2026-10-12) */
.bknav-row.current { letter-spacing: 0.3px; }          /* the current page's row (Streamlit's primary row) */
.bknav-row .lock-mark { vertical-align: -0.14em !important; margin-right: 2.1px; flex: none; }
.bknav-row.phone { display: none; }

/* ---- narrower windows: the wordmark steps down (ui/theme 1040 / 940 px rules) ---- */
@media (max-width: 1040px) { .bknav-brand { font-size: 17px; letter-spacing: -0.4px; } }
@media (max-width: 940px) { .bknav { padding-left: 14px; padding-right: 14px; } .bknav-brand { font-size: 15px; letter-spacing: -0.5px; } }
/* Phone (Streamlit's own column breakpoint, 640 px). Deliberate difference: Streamlit keeps the whole bar and it runs
   off the screen; here the hamburger lists every page instead. */
@media (max-width: 640px) {
  .bknav-in { grid-template-columns: auto 1fr; }
  .bknav .nav-item:not(.menu-burger) { display: none; }
  .bknav .nav-item.menu-burger { justify-self: end; width: 48px; }
  .bknav-row.phone { display: flex; }
  .bknav-panel { max-height: calc(100vh - 60px); overflow-y: auto; }
}

/* ---- st.info / st.success / st.warning / st.error (measured on 8641: st.error and st.warning 2026-10-11) ---- */
.bk-flash { padding: 14px; margin: 0 0 1rem; font-size: 14px; line-height: 21px; }
.bk-flash.k-info { background: rgba(28, 131, 255, 0.1); color: rgb(0, 84, 163); }
.bk-flash.k-success { background: rgba(33, 195, 84, 0.1); color: rgb(21, 130, 55); }   /* re-measured 2026-10-12 */
.bk-flash.k-warning { background: rgba(255, 255, 18, 0.1); color: rgb(146, 108, 5); }
.bk-flash.k-error { background: rgba(255, 43, 43, 0.1); color: rgb(189, 64, 67); }

/* ---- the footer caption: Streamlit's caption box is 33.6 px (its 14 px bottom margin inside, pulled back after) ---- */
.bk-foot { display: flow-root; margin: 0 0 -14px; }
.bk-foot > .caption { margin: 0 0 14px; }

/* ---- the gate and the token-link pages: no bar, so the title sits at 72.8 px (measured on ?confirm=) ---- */
.block.bare { padding-top: 72.8px; }
.bk-tokbtn { width: auto; margin: 0 0 1rem; }
.gate-row { display: grid; grid-template-columns: 3fr 1fr; gap: 0 1rem; align-items: end; margin: 0 0 1rem; }
.gate-row .btn { width: 100%; }