/* ============================================
   s-accordion-02 — シンプル details/summary アコーディオン
   wp:details に className="s-accordion-02__item" を付与
   用途: 疾患一覧、コンテンツ開閉など（Q/Aラベルなし）
   ============================================ */

.s-accordion-02__item {
  border-bottom: 1px solid var(--color-border);
}

.s-accordion-02__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2-xl) var(--space-xl);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
  color: var(--color-primary-dark);
  cursor: pointer;
  list-style: none;
  transition: opacity var(--transition-fast);
}

.s-accordion-02__item summary:hover {
  opacity: 0.7;
}

/* Hide default marker */
.s-accordion-02__item summary::-webkit-details-marker,
.s-accordion-02__item summary::marker {
  display: none;
  content: "";
}

/* Toggle icon */
.s-accordion-02__item summary::after {
  content: "";
  flex-shrink: 0;
  width: 2.4rem;
  height: 2.4rem;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23999' stroke-width='1.5'%3E%3Cpath d='M6 1v10M1 6h10'/%3E%3C/svg%3E") center / 12px no-repeat;
  transition: transform var(--transition-fast);
}

.s-accordion-02__item[open] summary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23999' stroke-width='1.5'%3E%3Cpath d='M1 6h10'/%3E%3C/svg%3E");
}

/* Content area */
.s-accordion-02__item > :not(summary) {
  padding: 0 var(--space-xl) var(--space-3-xl);
}

.s-accordion-02__item p {
  font-size: var(--font-size-md);
  line-height: var(--line-height-relaxed);
  color: var(--color-text);
}

.s-accordion-02__item p + p {
  margin-top: var(--space-xl);
}

.s-accordion-02__item h3 {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary-dark);
  margin-top: var(--space-2-xl);
  margin-bottom: var(--space-md);
}

.s-accordion-02__item h4 {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin-top: var(--space-xl);
  margin-bottom: var(--space-xs);
}

/* 疾患イラスト（AI生成）は主張しすぎないよう上限幅を設けて控えめに見せる。
   画像カラム(flex-basis 40%)内で中央寄せし、大きくなりすぎるのを防ぐ。 */
.s-accordion-02__image {
  max-width: var(--content-width-sm);
  margin-inline: auto;
}

.s-accordion-02__image img {
  width: 100%;
  height: auto;
}

/* --- Responsive --- */
@container (max-width: 599px) {
  .s-accordion-02__item summary {
    padding: var(--space-xl) var(--space-md);
    font-size: var(--font-size-md);
  }

  .s-accordion-02__item > :not(summary) {
    padding: 0 var(--space-md) var(--space-2-xl);
  }

  .s-accordion-02__item p {
    font-size: var(--font-size-sm);
  }
}