/* AI FAQ Generator — Frontend Styles */

.aifaq-wrapper {
    --aifaq-primary:     #2563eb;
    --aifaq-border:      #e5e7eb;
    --aifaq-bg:          #ffffff;
    --aifaq-text:        #111827;
    --aifaq-text-muted:  #6b7280;
    --aifaq-radius:      10px;
    --aifaq-shadow:      0 1px 3px rgba(0,0,0,.08);
    --aifaq-answer-bg:   #f9fafb;
    margin: 2em 0;
    font-family: inherit;
}

/* ── Heading ────────────────────────────────────────── */
.aifaq-heading {
    font-size: 1.35em;
    font-weight: 700;
    margin: 0 0 1em;
    color: var(--aifaq-text);
}

/* ── Items ──────────────────────────────────────────── */
.aifaq-list { border: 1px solid var(--aifaq-border); border-radius: var(--aifaq-radius); overflow: hidden; box-shadow: var(--aifaq-shadow); }

.aifaq-item { border-bottom: 1px solid var(--aifaq-border); }
.aifaq-item:last-child { border-bottom: none; }

/* ── Question button ────────────────────────────────── */
.aifaq-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 1em 1.2em;
    background: var(--aifaq-bg);
    border: none;
    cursor: pointer;
    font-size: 1em;
    font-weight: 600;
    color: var(--aifaq-text);
    text-align: left;
    gap: .75em;
    transition: background .2s;
}
.aifaq-question:hover { background: #f3f4f6; }
.aifaq-question[aria-expanded="true"] { color: var(--aifaq-primary); background: #eff6ff; }
.aifaq-question span { flex: 1; }

/* ── Icon ────────────────────────────────────────────── */
.aifaq-icon {
    flex-shrink: 0;
    transition: transform .3s ease;
    color: var(--aifaq-text-muted);
}
.aifaq-question[aria-expanded="true"] .aifaq-icon { transform: rotate(180deg); color: var(--aifaq-primary); }

/* ── Answer ──────────────────────────────────────────── */
.aifaq-answer {
    background: var(--aifaq-answer-bg);
    border-top: 1px solid var(--aifaq-border);
    overflow: hidden;
}
.aifaq-answer p {
    margin: 0;
    padding: .9em 1.2em;
    color: var(--aifaq-text-muted);
    line-height: 1.7;
}

/* ── Animation ───────────────────────────────────────── */
.aifaq--animated .aifaq-answer {
    max-height: 0;
    transition: max-height .35s ease;
    display: block !important; /* override hidden via JS */
}
.aifaq--animated .aifaq-answer.is-open { max-height: 600px; }

/* ══ DARK THEME ══════════════════════════════════════════ */
.aifaq-theme-dark {
    --aifaq-primary:    #60a5fa;
    --aifaq-border:     #374151;
    --aifaq-bg:         #1f2937;
    --aifaq-text:       #f9fafb;
    --aifaq-text-muted: #9ca3af;
    --aifaq-answer-bg:  #111827;
}
.aifaq-theme-dark .aifaq-question:hover   { background: #374151; }
.aifaq-theme-dark .aifaq-question[aria-expanded="true"] { background: #1e3a5f; color: var(--aifaq-primary); }

/* ══ MINIMAL THEME ═══════════════════════════════════════ */
.aifaq-theme-minimal {
    --aifaq-border:    transparent;
    --aifaq-shadow:    none;
    --aifaq-bg:        transparent;
    --aifaq-answer-bg: transparent;
}
.aifaq-theme-minimal .aifaq-list      { border: none; border-radius: 0; box-shadow: none; }
.aifaq-theme-minimal .aifaq-item      { border-bottom: 2px solid #e5e7eb; }
.aifaq-theme-minimal .aifaq-question  { padding-left: 0; padding-right: 0; }
.aifaq-theme-minimal .aifaq-answer    { border-top: none; }
.aifaq-theme-minimal .aifaq-answer p  { padding-left: 0; }

/* ── Responsive ──────────────────────────────────────── */
@media (max-width: 600px) {
    .aifaq-question { font-size: .95em; padding: .85em 1em; }
    .aifaq-answer p { padding: .8em 1em; }
}