/* Be Crime Wise guides and contact pages (England & Wales and Scotland): Design.md look (v137, 7 November 2026). Loaded last, after /bw-design.css. APPEARANCE ONLY. */

:root{ --ink:var(--d-text); --ink-soft:var(--d-text-2); --paper:var(--d-canvas); --paper-raised:var(--d-panel); --brass:var(--d-accent); --brass-dark:var(--d-accent);
  --slate:var(--d-text-2); --rule:var(--d-line); --rule-strong:var(--d-line-input); --focus:var(--d-accent); --font-serif:var(--d-display); --font-sans:var(--d-body); }
html body main > .faq-item{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-radius:8px !important; box-shadow:none !important; }
html body .faq-item h3{ color:var(--d-text) !important; }
html body .faq-item p{ color:var(--d-text-2) !important; }
html body main > p.intro{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-left:1px solid var(--d-accent) !important; border-radius:8px !important; color:var(--d-text) !important; }
html body .official-sources{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-left:1px solid var(--d-accent) !important; border-radius:8px !important; }
html body .official-sources a{ color:var(--d-text) !important; }
html body .chat-cta{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-top:1px solid var(--d-accent) !important; border-radius:8px !important; box-shadow:none !important; }
/* related guides: one framed grid split by hairlines */
html body .related-grid{ gap:1px !important; background:var(--d-line); border:1px solid var(--d-line); border-radius:8px; overflow:hidden; }
html body .related-grid > a{ background:var(--d-panel) !important; border:0 !important; border-radius:0 !important; color:var(--d-text) !important; box-shadow:none !important; transform:none !important; }
html body .related-grid > a:hover{ background:var(--d-hover) !important; }
/* jurisdiction switcher and tool box on the guide pages */
html body details.juris-dd > summary.juris{ background:transparent !important; color:var(--d-text) !important; border:1px solid var(--d-line-input) !important; border-radius:6px !important; }
html body .juris-pop{ background:var(--d-panel) !important; border:1px solid var(--d-line-input) !important; border-top:1px solid var(--d-accent) !important; border-radius:8px !important; box-shadow:none !important; color:var(--d-text) !important; }
html body .juris-pop :is(.juris-pop-h, p){ color:var(--d-text-2) !important; }
html body .juris-pop .juris-opt{ color:var(--d-text) !important; background:transparent !important; border-radius:6px; }
html body .juris-pop .juris-opt:hover{ background:var(--d-hover) !important; }
html body .juris-pop .juris-opt.current{ background:var(--d-accent-tint) !important; }
html body .tool-cta{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-top:1px solid var(--d-accent) !important; border-radius:8px !important; box-shadow:none !important; }
html body .tool-cta :is(p){ color:var(--d-text-2) !important; }
html body .tool-cta :is(h2, h3, strong){ color:var(--d-text) !important; }
/* hub pages: question lists, stages and topic grids */
html body details.qlist{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-radius:8px !important; box-shadow:none !important; }
html body details.qlist > summary{ color:var(--d-text) !important; }
html body details.qlist li, html body details.qlist a{ color:var(--d-text) !important; }
html body .stage{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-left:1px solid var(--d-accent) !important; border-radius:8px !important; box-shadow:none !important; }
html body .stage h3{ color:var(--d-text) !important; }
html body .stage :is(p, li){ color:var(--d-text-2) !important; }
html body .stage .lbl{ color:var(--d-accent) !important; }
html body .stage a{ color:var(--d-text) !important; }
html body .hub-grid{ gap:1px !important; background:var(--d-line); border:1px solid var(--d-line); border-radius:8px; overflow:hidden; }
html body .hub-grid > a{ background:var(--d-panel) !important; border:0 !important; border-radius:0 !important; color:var(--d-text) !important; box-shadow:none !important; transform:none !important; }
html body .hub-grid > a:hover{ background:var(--d-hover) !important; }
html body table.glance{ background:var(--d-panel) !important; border:1px solid var(--d-line) !important; border-radius:8px; }
html body table.glance :is(tr, td, th){ background:transparent !important; color:var(--d-text) !important; }
html body table.glance td:first-child{ color:var(--d-text-2) !important; }
/* status badges with a dot (recent changes) */
html body .change .status{ display:inline-flex; align-items:center; gap:6px; background:var(--d-green-tint) !important; color:var(--d-green) !important; border:1px solid var(--d-green-edge) !important; border-radius:999px !important; font-family:var(--d-body); font-weight:500; padding:2px 10px 2px 8px; }
html body .change .status.soon{ background:var(--d-accent-tint) !important; color:var(--d-accent) !important; border-color:var(--d-accent-edge) !important; }
html body .change .status::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none; }