.sl-accordion-content {
    padding: 30px 0;
    border-top: 1px solid rgba(var(--color-text), 0.2);
}

.sl-accordion-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    gap:20px;
}

.sl-accordion-content:last-child {
    border-bottom: 1px solid rgba(var(--color-text), 0.2);
}

.sl-accordion-icon {
    opacity: .6;
    transform: rotate(270deg);
}

.sl-accordion-heading[aria-expanded='true'] .sl-accordion-icon {
    opacity: 1;
    transform: rotate(0deg);
}

.sl-accordion-body-item {
    padding: 20px 0;
    width: 60%;
}

/* 可点区域 & focus 可见 */
.sl-accordion-heading {
    cursor: pointer;
    outline: none;
}

.sl-accordion-heading:focus-visible {
    box-shadow: 0 0 0 2px currentColor inset;
    border-radius: 4px;
}

/* 面板容器：通过 height 动画，避免 layout 抖动 */
.sl-accordion-body {
    overflow: hidden;
    height: 0;
    /* 默认收起 */
    transition: all .24s ease;
    opacity: 0;
    will-change: height;
}

/* 打开态（由 JS 在容器上加 .is-open） */
.sl-accordion-content.is-open .sl-accordion-body {
    opacity: 1;
    height: auto;
}

/* 箭头旋转动画 */
.sl-accordion-icon svg {
    transition: transform .24s ease;
    transform: rotate(90deg);
}

.sl-accordion-icon svg path {
    stroke: rgba(var(--color-text));
}

.sl-accordion-content.is-open .sl-accordion-icon svg {
    transform: rotate(180deg);
}

/* 用户偏好：减少动画时，直接跳 */
@media (prefers-reduced-motion: reduce) {

    .sl-accordion-body,
    .sl-accordion-icon svg {
        transition: none !important;
    }
}

@media (max-width: 768px) {
    .sl-accordion-content {
        padding: 20px 0;
    }
    .sl-accordion-body-item {
        width: auto;
    }
}