/* === ChatGPT風Markdown拡張スタイル === */

/* ChatGPT風テーブルラッパー（横スクロール対応・スクロールバー非表示） */
.chatgpt-table-wrapper {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    margin: 16px 0;
    border-radius: 8px;
    -webkit-overflow-scrolling: touch;
    /* スクロールバーを非表示にする */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

.chatgpt-table-wrapper::-webkit-scrollbar {
    display: none; /* Chrome/Safari/Opera */
}

/* ChatGPT風テーブル本体 */
.chatgpt-table,
.message-content table {
    width: max-content; /* コンテンツ幅に応じて横幅を決定 */
    min-width: 100%; /* 最低でもコンテナ幅 */
    table-layout: fixed;
    border-collapse: collapse; /* 横グリッド線が途切れないように結合 */
    border-spacing: 0;
    background: transparent;
    font-size: 14px;
    font-family: 'Noto Sans JP', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
    font-weight: 400;
}

.chatgpt-table-header,
.message-content table th {
    background: transparent;
    padding: 12px 32px 6px 2px;
    text-align: left;
    font-weight: 600;
    font-size: 13px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.4);
    color: var(--text-primary, #374151);
    vertical-align: middle;
    width: var(--chatgpt-table-column-width, 200px);
    max-width: var(--chatgpt-table-column-width, 200px);
}

.chatgpt-table-cell,
.message-content table td {
    padding: 12px 32px 10px 2px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    color: var(--text-primary, #374151);
    vertical-align: top;
    line-height: 1.75;
    background: transparent;
    width: var(--chatgpt-table-column-width, 200px);
    max-width: var(--chatgpt-table-column-width, 200px);
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    font-weight: 400;
}

.chatgpt-table {
    margin: 0;
}

.message-content table:not(.chatgpt-table) {
    margin: 16px 0 32px; /* テーブルと続く文章の間に余白を確保 */
}

.chatgpt-table tbody tr:last-child .chatgpt-table-cell,
.message-content table tbody tr:last-child td {
    border-bottom: 1px solid rgba(148, 163, 184, 0.35);
    padding-bottom: 48px; /* 最終行のライン上下に余白を確保 */
}

.chatgpt-table-cell strong,
.message-content table td strong {
    font-weight: 600;
}

.chatgpt-table-cell > :where(p, div, span, strong, em, a),
.message-content table td > :where(p, div, span, strong, em, a) {
    margin: 0;
}

/* ChatGPT風リストスタイル */
.chatgpt-list {
    line-height: 1.75;
    margin: 12px 0;
}

.chatgpt-list li {
    margin: 8px 0;
}

.chatgpt-ordered-list {
    counter-reset: item;
}

.chatgpt-ordered-list > li {
    display: block;
    position: relative;
}

.chatgpt-ordered-list > li::before {
    content: counter(item) ". ";
    counter-increment: item;
    font-weight: 600;
    margin-right: 8px;
    color: var(--text-secondary, #4a5568);
}

/* インラインコードのスタイルはchat-code-highlight.cssに移行しました */

/* コードブロックのシンタックスハイライトはShikiに完全統一したため、.codehilite関連スタイルはすべて削除 */

/* テーブルのレスポンシブ改善 */
@media (max-width: 768px) {
    .chatgpt-table-wrapper {
        margin: 12px -12px; /* モバイルで画面幅いっぱいに */
    }
    
    .chatgpt-table-header,
    .chatgpt-table-cell,
    .message-content table th,
    .message-content table td {
        padding: 12px 12px; /* モバイルでも余白を確保しつつ圧縮 */
    }
}