/* HUDCO COMMON ACCORDION — DBIM compliant, page agnostic.
   Default: numbered FAQ. Plain: data-accordion-style="plain".
   Load after page-specific stylesheet; no UiWIN-specific selectors. */
[data-hudco-accordion] {
    counter-reset: hudco-faq;
    display: grid;
    gap: 12px;
    font-family: var(--font-family-primary);
    color: var(--text-primary);
}
[data-hudco-accordion] > details {
    counter-increment: hudco-faq;
    min-width: 0;
    margin: 0;
    border: 1px solid var(--border-light);
    border-radius: 4px;
    background: var(--surface-primary);
    overflow: hidden;
}
[data-hudco-accordion] > details > summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    column-gap: 16px;
    align-items: center;
    padding: 14px 20px;
    min-height: 64px;
    margin: 0;
    color: var(--text-primary);
    background: var(--surface-primary);
    list-style: none;
    cursor: pointer;
    font-family: var(--font-family-primary);
    font-size: var(--fs-desktop-p1);
    font-weight: var(--font-regular);
    line-height: var(--lh-body);
}
[data-hudco-accordion] > details > summary::-webkit-details-marker { display: none; }
[data-hudco-accordion] > details > summary::marker { content: ''; }
[data-hudco-accordion] > details > summary > span {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 12px;
    align-items: baseline;
    min-width: 0;
    font: inherit;
    color: inherit;
}
[data-hudco-accordion]:not([data-accordion-style="plain"]) > details > summary > span::before {
    content: 'Q' counter(hudco-faq);
    grid-column: 1;
    color: var(--brand-900);
    font: inherit;
    font-weight: var(--font-semibold);
    white-space: nowrap;
}
/* Suppress legacy numbers and SVGs when older markup is reused. */
[data-hudco-accordion] > details > summary > span > b,
[data-hudco-accordion] > details > summary > svg { display: none !important; }
[data-hudco-accordion] > details > summary::before { content: none !important; }
[data-hudco-accordion] > details > summary::after {
    content: '+';
    grid-column: 2;
    justify-self: end;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--brand-100);
    color: var(--brand-900);
    font-size: var(--fs-desktop-h3);
    font-weight: var(--font-regular);
    line-height: 1;
}
[data-hudco-accordion] > details[open] > summary::after { content: '−'; }
[data-hudco-accordion] > details > summary:focus-visible { outline: 3px solid var(--brand-700); outline-offset: -3px; }
[data-hudco-accordion] > details > .hudco-accordion-answer {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 12px;
    align-items: start;
    padding: 0 20px 20px;
    background: var(--surface-primary);
    font-family: var(--font-family-primary);
    font-size: var(--fs-desktop-p1);
    font-weight: var(--font-regular);
    line-height: var(--lh-body);
    color: var(--text-primary);
}
[data-hudco-accordion]:not([data-accordion-style="plain"]) > details > .hudco-accordion-answer::before {
    content: 'A.';
    grid-column: 1;
    grid-row: 1;
    color: var(--brand-900);
    font: inherit;
    font-weight: var(--font-semibold);
}
[data-hudco-accordion] > details > .hudco-accordion-answer > * {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    margin: 0;
    font: inherit;
    color: inherit;
    text-align: start;
}
/* List text aligns with question text; markers sit in the label gutter. */
[data-hudco-accordion] > details > .hudco-accordion-answer > ul {
    list-style-type: disc;
    list-style-position: outside;
    padding: 0;
    margin: 0;
}
[data-hudco-accordion] > details > .hudco-accordion-answer > ol {
    list-style-type: decimal;
    list-style-position: outside;
    padding: 0;
    margin: 0;
}
[data-hudco-accordion] > details > .hudco-accordion-answer > :is(ul, ol) > li {
    display: list-item;
    list-style: inherit;
    padding: 0;
    margin-left: 0;
    font: inherit;
    line-height: var(--lh-body);
}
[data-hudco-accordion] > details > .hudco-accordion-answer > :is(ul, ol) > li::marker {
    color: var(--brand-900);
}
/* Protect the markers from broad page CSS resetting list styling. */
[data-hudco-accordion] > details > .hudco-accordion-answer > ul > li { list-style-type: disc; }
[data-hudco-accordion] > details > .hudco-accordion-answer > ol > li { list-style-type: decimal; }
[data-hudco-accordion] > details > .hudco-accordion-answer li + li { margin-top: 6px; }
/* Plain mode for non-FAQ expandable content. */
[data-hudco-accordion][data-accordion-style="plain"] > details > summary > span { display: block; }
[data-hudco-accordion][data-accordion-style="plain"] > details > .hudco-accordion-answer { display: block; }
[data-hudco-accordion][data-accordion-style="plain"] > details > .hudco-accordion-answer > * { margin: 0; }
@media (min-width: 768px) and (max-width: 1023px) {
    [data-hudco-accordion] > details > summary,
    [data-hudco-accordion] > details > .hudco-accordion-answer { font-size: 15px; }
}
@media (max-width: 767px) {
    [data-hudco-accordion] > details > summary {
        grid-template-columns: minmax(0, 1fr) 34px;
        column-gap: 10px;
        padding: 12px 14px;
        font-size: var(--fs-mobile-p1);
    }
    [data-hudco-accordion] > details > summary > span,
    [data-hudco-accordion] > details > .hudco-accordion-answer {
        grid-template-columns: 34px minmax(0,1fr);
        column-gap: 10px;
    }
    [data-hudco-accordion] > details > summary::after {
        width: 34px; height: 34px; font-size: var(--fs-mobile-h3);
    }
    [data-hudco-accordion] > details > .hudco-accordion-answer {
        padding: 0 14px 16px;
        font-size: var(--fs-mobile-p1);
    }
}