/* Diamond Auto Glass — post-Duda interaction styles. * * The Duda runtime injected styled-components CSS for the FAQ accordion at * runtime; in a static export none of it exists, so without these rules every * FAQ description is fully visible and nothing opens/closes. This supplies the * collapsed default + open state that vg-interactions.js toggles (class-only: * the JS adds/removes .accordion-open, the CSS below drives everything). * * The drawer's own open-state CSS (layout-drawer[open] { transform: translate(0) } * etc.) IS already exported in Style/desktop.css — we only reinforce the overlay * pointer behaviour here. Prefixing with #dmRoot (the ) outranks any * class-only Duda rule. */ /* ---------- FAQ accordion ---------- */ /* The element that collapses is NOT [data-grab="accordion-item-desc"] — it's * desc's parent wrapper, which Duda exported with `overflow:hidden; max-height:0` * under a styled-components hash class (.dygwmn in this export, and it changes * on any re-export). Clamping the inner desc leaves that parent at zero height, * so the panel toggles its class but never actually shows. * * vg-interactions.js tags that wrapper with .vg-acc-panel, so these rules key * on a stable name instead of the hash. A large fixed max-height (not a * measurement) opens it; the JS never sets inline max-height, so this is the * single source of truth. */ #dmRoot [data-auto="runtime-accordion-widget"] [data-grab="accordion-item-container"] .vg-acc-panel { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; } #dmRoot [data-auto="runtime-accordion-widget"] [data-grab="accordion-item-container"].accordion-open .vg-acc-panel { max-height: 3000px; } /* ---------- Accordion icon: + to - ---------- */ /* Duda's accordion arrow is two bars, both with a base transform of * rotate(-90deg): .eODSZX (a tall bar turned flat) + .eyQoqK (a flat bar turned * upright) — together a "+". Laying .eyQoqK back to rotate(0) makes it flat too, * so the two overlap into a "-". (Rotating it to 90deg leaves it upright and * nothing appears to change.) */ #dmRoot [data-auto="runtime-accordion-widget"] [data-grab="accordion-item-container"] .eyQoqK { transition: transform 0.3s ease; } #dmRoot [data-auto="runtime-accordion-widget"] [data-grab="accordion-item-container"].accordion-open .eyQoqK { transform: rotate(0deg); } /* ---------- Mobile drawer: overlay ---------- */ #dmRoot.layout-drawer_open #layout-drawer-overlay { pointer-events: all; } /* ---------- Mobile drawer: logo (tray top) ---------- */ /* Duda's runtime rendered the white logo at the top of the tray; it's absent in a static export, so vg-interactions.js inserts .vg-drawer-logo-wrap as the drawer's first child. */ #dmRoot .layout-drawer>.vg-drawer-logo-wrap { display: flex; justify-content: center; align-items: center; padding: 1.2em 1em 0.6em; background: transparent; } #dmRoot .layout-drawer .vg-drawer-logo { max-width: 180px; width: auto; height: auto; display: block; } /* ---------- Mobile drawer: center the nav ---------- */ #dmRoot #hamburger-drawer .unifiednav, #dmRoot #hamburger-drawer nav, #dmRoot #hamburger-drawer ul, #dmRoot #hamburger-drawer [data-links-level] { text-align: center; } #dmRoot #hamburger-drawer .unifiednav__container, #dmRoot #hamburger-drawer nav>ul, #dmRoot #hamburger-drawer [data-auto="unifiednav"] ul { width: 100%; margin-left: auto; margin-right: auto; display: block; } #dmRoot #hamburger-drawer nav a, #dmRoot #hamburger-drawer .unifiednav a { width: 100%; text-align: center; }