/* kv_cookie_banner_shared.css — the DPDP cookie banner's SIZE and SPACING on narrow screens (E-3, 2026-09-13).
   Emitted by incfiles/_cookie_banner.php itself (guarded, once per request) so EVERY page that renders the banner —
   Bootstrap/Metronic shell pages via footerbase AND the bespoke pages (login.php, index_bento.php, index_signed_in.php,
   signup.php) styled by kv_cookie_banner_lite.css — gets one geometry instead of two that drift. It is emitted right
   before the banner markup, i.e. after the theme bundle and after the lite CSS, so it wins on order; the id selector
   wins on specificity against Bootstrap's !important utilities (.p-3, .gap-3).

   Measured before (deployed 2026-09-13): 277 px = 49 % of a 320×568 screen (login), 250 px on shell pages; 210 / 202 px
   at 375; the three buttons wrapped onto TWO rows at 320. After: 188 px (33 %) / 177 px at 320, 171 / 177 at 375, one
   button row at every width. Floor accepted by bc: ~188 px at 320 — less means cutting text, which is not allowed.

   HARD RULE (DPDP, consent never weakened): nothing here removes, shortens, hides or de-emphasises a word, the Cookie
   Policy link, or any of the three buttons. Layout only. The 22vh cap on the TEXT block is a safety net for long
   translations: the text scrolls inside the banner, the buttons and title stay outside the scroll region by
   construction (the buttons are a sibling of the text block, not a child).

   Position and stacking are NOT here — they belong to assets/css/kv_bottomnav_safe.css. Do not add a fourth home. */

/* Immunisation, every width (2026-09-13): page stylesheets may style a bare `.card` (index_bento's kv_index_v2.css
   pads .card 22 px / 16 px narrow) and that reached into the banner's own .card, inflating it by ~32 px on that page.
   The banner's spacing lives on .card-body; its outer .card is always 0. Bootstrap's .card has no padding, so this is
   a no-op on shell pages (measured). The banner may inherit a page's typography (root font-size) — that is correct
   and deliberately NOT pinned here; identical pixel heights across pages is not the goal, geometry no page can reach
   into is. */
#kvCookieBanner .card { padding: 0; }

@media (max-width: 575.98px) {
  #kvCookieBanner { padding: 8px !important; }
  #kvCookieBanner .card-body { padding: 10px 12px !important; gap: 8px !important; }
  #kvCookieBanner .card-body > .me-lg-3 { max-height: 22vh; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-right: 4px; }
  #kvCookieBanner .fw-bold { line-height: 1.2; }
  #kvCookieBanner .small { font-size: 12.5px !important; line-height: 1.35 !important; }
  #kvCookieBanner .btn { min-height: 36px !important; padding: 6px 10px !important; font-size: 13px !important; }
  #kvCookieBanner .d-flex.gap-2 { gap: 6px !important; flex-wrap: nowrap !important; width: 100%; }
  #kvCookieBanner .d-flex.gap-2 .btn { flex: 1 1 0; white-space: nowrap; }
}