/* Accordion — i2t3 component styles
 * Bootstrap covers most of the accordion styling. Tweak the i2t3 specifics here.
 */

.i2t3-accordion-section { position: relative; }

.i2t3-accordion-section .accordion-button {
    font-weight: 600;
}
.i2t3-accordion-section .accordion-button:not(.collapsed) {
    background-color: rgba(var(--bs-primary-rgb, 13, 110, 253), 0.08);
    color: var(--i2t3-primary, #0d6efd);
}
/* Card-like separated items for non-flush variants only. The flush variant must
 * keep Bootstrap's borderless, edge-to-edge look (otherwise it looks like simple). */
.i2t3-accordion-section .accordion:not(.accordion-flush) .accordion-item + .accordion-item {
    margin-top: 0.5rem;
}
.i2t3-accordion-section .accordion:not(.accordion-flush) .accordion-item {
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 6px;
    overflow: hidden;
}

/* faq variant: a +/- indicator instead of the default chevron (mirrors the
 * Bootstrap "faq-accordion" look, adapted to the BS5 accordion markup) so
 * it is visibly distinct from "simple" (chevron) and "flush" (borderless). */
.i2t3-accordion-section .faq-accordion .accordion-button::after {
    background-image: none;
    content: "+";
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1;
    text-align: center;
    transform: none;
}
.i2t3-accordion-section .faq-accordion .accordion-button:not(.collapsed)::after {
    content: "\2212"; /* minus sign */
}

/* simple variant (variation 0): mirror the original "custom-accordion" look —
 * brand-coloured headline + muted answer body (ported from _accordion.scss
 * lines 43-52 onto the native BS5 .accordion-item markup). */
.i2t3-accordion-section .accordion:not(.accordion-flush):not(.faq-accordion) .accordion-button .h3,
.i2t3-accordion-section .accordion:not(.accordion-flush):not(.faq-accordion) .accordion-button .h5 {
    color: var(--i2t3-accordion-accent, var(--bs-primary, #0d6efd));
    font-weight: 500;
}
.i2t3-accordion-section .accordion:not(.accordion-flush):not(.faq-accordion) .accordion-body {
    color: var(--bs-secondary-color, #6c757d);
}

/* flush variant (variation 2): the distinctive primary bar look from the
 * original (_accordion.scss lines 97-198) — solid primary background, white
 * text and square corners when open; white/dark when collapsed; a rotating
 * chevron glyph (no FontAwesome dependency, pure CSS glyph). */
.i2t3-accordion-section .accordion-flush .accordion-item {
    border: 0;
}
.i2t3-accordion-section .accordion-flush .accordion-button,
.i2t3-accordion-section .accordion-flush .accordion-button:not(.collapsed) {
    background-color: var(--i2t3-accordion-accent, var(--bs-primary, #0d6efd));
    border-radius: 0;
    box-shadow: none;
    color: #fff;
    padding: 1rem 1.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}
.i2t3-accordion-section .accordion-flush .accordion-button.collapsed {
    background-color: #fff;
    color: #212529;
}
.i2t3-accordion-section .accordion-flush .accordion-button:focus {
    box-shadow: none;
    z-index: 3;
}
/* chevron glyph (›) — rotated open/closed, replacing the FA \f054 arrow */
.i2t3-accordion-section .accordion-flush .accordion-button::after {
    background-image: none;
    content: "\203A"; /* single right-pointing angle quote = chevron */
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    transform: rotate(90deg);
    transition: transform 0.2s ease-in-out;
}
.i2t3-accordion-section .accordion-flush .accordion-button.collapsed::after {
    transform: rotate(0deg);
}