/* ── FaqsV1 — DoorTek FAQ panel ──────────────────────────────────────────
   Fixed sitewide look, independent of the placement's data-colors scope:
   dark navy section, white "light box" cards, light-blue active/hover item.
   Colors are explicit (not theme tokens) on purpose — the theme scopes tie
   the section, cards, and active state to a single palette, so a scope swap
   can't give "dark section + light cards + blue active" at once. Fixing the
   values here keeps the panel identical everywhere FaqsV1 renders. */

/* ── Section: dark navy background ───────────────────────────────────── */

.faq.v1 {
    background-color: #0c2340;
    color: #f5fbff;
}

.faq.v1 header :is(h1, h2, h3, h4, h5, h6) {
    color: #c8e524;
}

/* ── Collapsed cards: white "light box" with dark text ───────────────── */

.faq.v1 .faq-list-item.bg-bx {
    background-color: #ffffff;
    color: #0c2340;
}

.faq.v1 .faq-list-idx,
.faq.v1 .faq-list-num .flr_hd {
    color: rgba(12, 35, 64, 0.15);
}

/* ── Active / hover: light blue with white text ──────────────────────── */

.faq.v1 details[open].faq-list-item.bg-bx,
.faq.v1 .faq-list-item.bg-bx:is(:hover, :focus-visible) {
    background-color: #00b4e6;
    color: #ffffff;
}

.faq.v1 details[open] .faq-list-idx,
.faq.v1 .faq-list-item:is(:hover, :focus-visible) .faq-list-idx {
    color: rgba(255, 255, 255, 0.6);
}

.faq.v1 details[open] .faq-list-num .flr_hd,
.faq.v1 .faq-list-item:is(:hover, :focus-visible) .faq-list-num .flr_hd {
    color: rgba(255, 255, 255, 0.5);
}

/* Close ("x") toggle on the active card — muted disc, white strokes */

.faq.v1 .tb-close circle {
    fill: rgba(255, 255, 255, 0.25);
}

.faq.v1 .tb-close line {
    stroke: #ffffff;
}

/* The garage-door flair icon ships with a hard-coded green fill; recolor it so
   it tracks the faded index numbers — muted on the white cards, light when active. */
.faq.v1 .faq-list-num .flr_hd :is(svg, path) {
    fill: rgba(12, 35, 64, 0.15);
}

.faq.v1 details[open] .faq-list-num .flr_hd :is(svg, path),
.faq.v1 .faq-list-item:is(:hover, :focus-visible) .faq-list-num .flr_hd :is(svg, path) {
    fill: rgba(255, 255, 255, 0.5);
}