/**
 * SM Custom Schema — FAQ Accordion styles.
 *
 * Every selector here is scoped under the unique .smfaq-accordion root and
 * uses class names prefixed with "smfaq-" so this stylesheet cannot collide
 * with theme CSS, other plugins, or (if the site happens to use it) real
 * Bootstrap. Nothing in this file targets a bare element selector (body, h1,
 * a, ul, table, etc.), so it can never leak outside the accordion markup.
 */

.smfaq-accordion {
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.375rem;
    overflow: hidden;
}

.smfaq-item + .smfaq-item {
    border-top: 1px solid rgba(0, 0, 0, 0.125);
}

.smfaq-header {
    margin: 0;
}

.smfaq-button {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1rem 1.25rem;
    font-size: 1rem;
    font-weight: 500;
    text-align: left;
    background-color: #fff;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

.smfaq-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    background-position: center;
    transition: transform 0.2s ease-in-out;
}

.smfaq-button[aria-expanded="true"] {
    color: #0c4128;
    background-color: #eaf6ef;
}

.smfaq-button[aria-expanded="true"]::after {
    transform: rotate(-180deg);
}

.smfaq-button:focus-visible {
    outline: 2px solid #0d6efd;
    outline-offset: -2px;
}

.smfaq-collapse {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
}

.smfaq-body {
    padding: 1rem 1.25rem;
}

.faq-header.smfaq-intro {
    margin-bottom: 1rem;
}
