/* AM FAQ – Frontend */

.am-faq-container {
    /* Default values – overridden by inline CSS variables from settings */
    --amq-bg:      #000000;
    --amq-text:    #ffffff;
    --amq-bg-o:    #222222;
    --amq-text-o:  #ffffff;
    --amq-icon:    #ffffff;
    --amr-bg:      #ffffff;
    --amr-text:    #000000;
    --am-border:   #cccccc;
    --am-radius:   0px;
    --am-fq:       15px;
    --am-fr:       14px;
    --am-gap:      4px;
    --am-qpad:     16px;
    --am-rpad:     16px;

    width: 100%;
    box-sizing: border-box;
}

/* Full-width accordion */
.am-faq-accordion {
    display: flex;
    flex-direction: column;
    gap: var(--am-gap);
    width: 100%;
}

.am-faq-item {
    width: 100%;
    border: 1px solid var(--am-border);
    border-radius: var(--am-radius);
    overflow: hidden;
}

/* Question button – full width */
.am-faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: var(--am-qpad);
    background: var(--amq-bg);
    color: var(--amq-text);
    border: none;
    outline: none;
    text-align: left;
    font-size: var(--am-fq);
    font-weight: 500;
    cursor: pointer;
    gap: 12px;
    line-height: 1.4;
    box-sizing: border-box;
    transition: background .15s, color .15s;
}

.am-faq-question:hover {
    filter: brightness(1.12);
}

.am-faq-question[aria-expanded="true"] {
    background: var(--amq-bg-o);
    color: var(--amq-text-o);
}

/* Chevron icon */
.am-faq-chevron {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    stroke: var(--amq-icon);
    transition: transform .25s, stroke .15s;
}

.am-faq-question[aria-expanded="true"] .am-faq-chevron {
    transform: rotate(180deg);
    stroke: var(--amq-text-o);
}

/* Answer panel */
.am-faq-answer {
    width: 100%;
    box-sizing: border-box;
}

.am-faq-answer-inner {
    padding: var(--am-rpad);
    background: var(--amr-bg);
    color: var(--amr-text);
    font-size: var(--am-fr);
    line-height: 1.7;
    box-sizing: border-box;
}

.am-faq-answer-inner p:last-child { margin-bottom: 0; }
.am-faq-answer-inner ul,
.am-faq-answer-inner ol { padding-left: 20px; margin: 8px 0; }
.am-faq-answer-inner li { margin-bottom: 4px; }
.am-faq-answer-inner strong { font-weight: 600; }
.am-faq-answer-inner a { color: inherit; text-decoration: underline; }