/* ===== dr_drivers_html (HTML form, one leaf of the drivers section) =====
   Loaded eagerly from anvil.yaml native_deps.head_html. Anvil's server strips the text out of a
   template's <style> block, so every rule this form's block held lives here instead.

   SCOPING. Nine of the ten rules already name the form's own root, .dr-driver-section, as an
   ancestor. They are left exactly as they were: :where()-wrapping one of them would drop it from
   (0,2,0) to (0,1,0) and tie with the dependency's own .px-card / .px-table-wrap, and the head link
   loses a tie to a sheet the dependency injects at runtime. A rule that names the root cannot leak,
   which is the only thing :where() scoping buys. The root rule itself stays a bare class so it
   outranks the scoped reset.

   The single exception is .dr-driver-link inside the phone media query: the block wrote it WITHOUT
   the section prefix, so head-linked and unwrapped it would give every .dr-driver-link in the app a
   44px tap target. It is wrapped :where(.dr-driver-section), which keeps its (0,1,0) specificity and
   its place in the cascade while stopping it at this form.

   No @keyframes, no url(), no @font-face and no designer gate: this form hides nothing until
   JavaScript runs, and its one hidden-by-default state is <details>, which the browser owns.

   DESIGNER LIMIT: .px-card, .px-card-header, .px-card-body, .px-table and the --px-* colour tokens
   come from the dependency's runtime injection, and drivers.css styles .dr-info only under the
   shell and pop-up roots (.dr-dashboard, #dr-drill-overlay); the designer canvas has neither. Tree, names, selection and drag work
   on this canvas; the picture does not. */

.dr-driver-section { display:grid; gap:1.25rem; min-width:0; }
.dr-driver-section .px-card { min-width:0; }
.dr-driver-section .twocol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; min-width:0; }
.dr-driver-section .px-table-wrap { max-width:100%; }
.dr-driver-section th, .dr-driver-section td { white-space:nowrap; }
.dr-driver-section .dr-driver-link { border:0; padding:.3rem 0; background:none; color:var(--px-text-primary); text-decoration:underline; text-underline-offset:3px; font:inherit; cursor:pointer; }
.dr-driver-section .dr-driver-open { display:inline-block; margin-left:.35rem; padding:.1rem .45rem; border-radius:999px; background:var(--px-bg-elevated); color:var(--px-text-secondary); font-size:.72rem; }
.dr-driver-section summary { cursor:pointer; color:var(--px-text-secondary); padding:.6rem 0; font-size:.8rem; }
.dr-driver-section .dr-driver-group { text-align:center; border-bottom:1px solid var(--px-border); font-size:.74rem; color:var(--px-text-secondary); }
@media(max-width:640px) { .dr-driver-section .twocol { grid-template-columns:minmax(0,1fr); gap:1rem; } .dr-driver-section { grid-template-columns:minmax(0,1fr); gap:1rem; } .dr-driver-section .dr-driver-wide { min-width:1900px; } :where(.dr-driver-section) .dr-driver-link { min-height:44px; } }