/* ===== dr_vans_html (HTML form, scoped) =====
   Loaded eagerly from anvil.yaml native_deps.head_html, which is also what styles the designer
   canvas.

   Two shapes, on purpose. A rule that already names .dr-van-section as an ancestor is left
   exactly as it was: wrapping it would drop it from (0,2,0) to (0,1,0) and hand the tie to the
   dependency's own .px-card / .px-table-wrap rules, which ensure_theme_injected() appends to the
   head at runtime, i.e. after this link. A rule that does NOT name the root (.dr-van-multiples, .dr-van-card and friends)
   is :where(.dr-van-section)-scoped, which adds zero specificity and so cannot change which rule
   wins, and stops the class leaking to the rest of the app.

   The root rule stays a bare class so it outranks the scoped reset. No keyframes here (drivers
   declares none anywhere), no designer gate (nothing in drivers hides content until JavaScript
   runs), and no percentage height: .dr-van-plot is a px min-height and every ApexCharts height in
   this form is a number. */

.dr-van-section { display:grid; gap:1.25rem; min-width:0; }
.dr-van-section .px-card { min-width:0; }
.dr-van-section .twocol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; min-width:0; }
.dr-van-section .px-table-wrap { max-width:100%; }
.dr-van-section th, .dr-van-section td { white-space:nowrap; }
.dr-van-section button { background:none; border:0; color:var(--px-text-primary); font:inherit; cursor:pointer; padding:.4rem; }
.dr-van-section .dr-van-link { text-decoration:underline; text-underline-offset:3px; }
.dr-van-section summary { cursor:pointer; color:var(--px-text-secondary); padding:.6rem 0; font-size:.8rem; }
.dr-van-section .dr-van-heat td { padding:2px; text-align:center; }
.dr-van-section .dr-van-heat th { min-width:110px; }
.dr-van-section .dr-van-heat button { width:100%; min-width:88px; min-height:44px; border-radius:4px; color:var(--px-text-primary); }
:where(.dr-van-section) .dr-van-multiples { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:1rem; min-width:0; }
:where(.dr-van-section) .dr-van-card { border:1px solid var(--px-border); border-radius:8px; padding:.8rem; min-width:0; }
:where(.dr-van-section) .dr-van-card h3 { margin:0 0 .5rem; font-size:.85rem; font-weight:600; }
:where(.dr-van-section) .dr-van-mini { margin:.45rem 0; }
:where(.dr-van-section) .dr-van-mini-label { display:flex; justify-content:space-between; gap:.5rem; font-size:.72rem; color:var(--px-text-secondary); }
:where(.dr-van-section) .dr-van-plot { min-height:110px; }
:where(.dr-van-section) .dr-van-none { color:var(--px-text-muted); font-size:.75rem; margin:.6rem 0; }
:where(.dr-van-section) .dr-van-figures { display:grid; grid-template-columns:auto auto; gap:.18rem .7rem; font-size:.75rem; margin-top:.7rem; }
:where(.dr-van-section) .dr-van-figures dt { color:var(--px-text-secondary); }
:where(.dr-van-section) .dr-van-figures dd { margin:0; text-align:right; }
:where(.dr-van-section) .dr-van-subtotal { font-size:.78rem; color:var(--px-text-secondary); margin:.6rem 0 0; line-height:1.6; }
:where(.dr-van-section) .dr-van-note { font-size:.72rem; color:var(--px-text-muted); margin:.6rem 0 0; line-height:1.6; }
:where(.dr-van-section) #dr-van-table table { min-width:1180px; }
@media(max-width:640px) { .dr-van-section .twocol { grid-template-columns:minmax(0,1fr); gap:1rem; } .dr-van-section { grid-template-columns:minmax(0,1fr); gap:1rem; } .dr-van-section .dr-van-usage { min-width:420px; } .dr-van-section button { min-height:44px; } :where(.dr-van-section) .dr-van-multiples { grid-template-columns:minmax(0,1fr); } }
@media(forced-colors:active), print { .dr-van-section .dr-van-heat button { border:1px solid currentColor; } :where(.dr-van-section) .dr-van-plot { display:none; } }