/**
 * Wasren Card Content Styles
 *
 * カードコンテンツ（フラッシュカードの表示部分）用の共通スタイル
 *
 * 使用場所:
 *   - 本体アプリ (StudySession.vue) → .card-text-content
 *   - DokuWiki デッキブラウザ (deck_browser.php) → .card-tile-content
 *   - Marketplace Editor (wasrenMarketplaceEditor) → .wasren-card-content
 *
 * CDN: https://jslib.emuyn.net/wasren-card-content.css
 */

/* ===========================
   見出し (h1-h6)
   =========================== */
.card-text-content h1,
.card-text-content h2,
.card-text-content h3,
.card-text-content h4,
.card-text-content h5,
.card-text-content h6,
.card-tile-content h1,
.card-tile-content h2,
.card-tile-content h3,
.card-tile-content h4,
.card-tile-content h5,
.card-tile-content h6,
.wasren-card-content h1,
.wasren-card-content h2,
.wasren-card-content h3,
.wasren-card-content h4,
.wasren-card-content h5,
.wasren-card-content h6 {
    margin: 0.25em 0 0.1em 0;
    font-weight: bold;
    line-height: 1.2;
}

.card-text-content h1,
.card-tile-content h1,
.wasren-card-content h1 { font-size: 1.5em; }

.card-text-content h2,
.card-tile-content h2,
.wasren-card-content h2 { font-size: 1.3em; }

.card-text-content h3,
.card-tile-content h3,
.wasren-card-content h3 { font-size: 1.15em; }

.card-text-content h4,
.card-text-content h5,
.card-text-content h6,
.card-tile-content h4,
.card-tile-content h5,
.card-tile-content h6,
.wasren-card-content h4,
.wasren-card-content h5,
.wasren-card-content h6 { font-size: 1em; }

/* ===========================
   段落 (p)
   =========================== */
.card-text-content p,
.card-tile-content p,
.wasren-card-content p { margin: 0; }

.card-text-content p:empty,
.card-tile-content p:empty,
.wasren-card-content p:empty { display: none; }

/* ===========================
   リスト (ul, ol, li)
   =========================== */
.card-text-content ul,
.card-text-content ol,
.card-tile-content ul,
.card-tile-content ol,
.wasren-card-content ul,
.wasren-card-content ol {
    margin: 0.2em 0;
    padding-left: 1.2em;
    line-height: 1.6;
    white-space: normal;
}

.card-text-content li,
.card-tile-content li,
.wasren-card-content li {
    margin: 0;
    padding: 0;
    white-space: normal;
}

.card-text-content li > ul,
.card-text-content li > ol,
.card-tile-content li > ul,
.card-tile-content li > ol,
.wasren-card-content li > ul,
.wasren-card-content li > ol { margin: 0; }

.card-text-content li > p,
.card-tile-content li > p,
.wasren-card-content li > p { margin: 0; }

/* ===========================
   水平線 (hr)
   =========================== */
.card-text-content hr,
.card-tile-content hr,
.wasren-card-content hr {
    border: none;
    border-top: 1px solid var(--theme-border, currentColor);
    margin: 0.5em 0;
    background: none;
    height: 0;
}

/* ===========================
   コードブロック (code, pre)
   =========================== */
.card-text-content code,
.card-tile-content code,
.wasren-card-content code {
    background: rgba(0, 0, 0, 0.05);
    padding: 0.1em 0.3em;
    border-radius: 3px;
    font-family: monospace;
    font-size: 0.9em;
}

.card-text-content pre,
.card-tile-content pre,
.wasren-card-content pre {
    background: rgba(0, 0, 0, 0.05);
    padding: 0.4em;
    border-radius: 3px;
    overflow-x: auto;
    margin: 0.2em 0;
}

.card-text-content pre code,
.card-tile-content pre code,
.wasren-card-content pre code {
    background: none;
    padding: 0;
}

/* ===========================
   引用 (blockquote)
   =========================== */
.card-text-content blockquote,
.card-tile-content blockquote,
.wasren-card-content blockquote {
    border-left: 2px solid #ccc;
    margin: 0.2em 0;
    padding-left: 0.5em;
    color: #666;
}

/* ===========================
   テーブル (table)
   =========================== */
.card-text-content table,
.card-tile-content table,
.wasren-card-content table {
    border-collapse: collapse;
    margin: 0.2em 0;
    width: 100%;
}

.card-text-content th,
.card-text-content td,
.card-tile-content th,
.card-tile-content td,
.wasren-card-content th,
.wasren-card-content td {
    border: 1px solid #ddd;
    padding: 0.25em 0.4em;
    text-align: left;
}

.card-text-content th,
.card-tile-content th,
.wasren-card-content th {
    background: rgba(0, 0, 0, 0.05);
    font-weight: bold;
}

/* ===========================
   折りたたみ (details/summary)
   =========================== */
.card-text-content details,
.card-tile-content details,
.wasren-card-content details {
    white-space: normal;
    margin: 0.2em 0;
}

.card-text-content summary,
.card-tile-content summary,
.wasren-card-content summary {
    white-space: normal;
    cursor: pointer;
}

.card-text-content details > *:not(summary),
.card-tile-content details > *:not(summary),
.wasren-card-content details > *:not(summary) {
    white-space: normal;
}

/* ===========================
   リンク (a)
   =========================== */
.card-text-content a,
.card-tile-content a,
.wasren-card-content a {
    color: var(--theme-link, #2563eb);
    text-decoration: underline;
}

/* ===========================
   画像 (img)
   =========================== */
.card-text-content img,
.card-tile-content img,
.wasren-card-content img {
    max-width: 100%;
    max-height: 300px;
    height: auto;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

/* ===========================
   MathJax
   !important はMathJaxのデフォルトスタイルを上書きするために必要
   =========================== */
.card-text-content mjx-container,
.card-tile-content mjx-container,
.wasren-card-content mjx-container {
    margin: 0.1em 0 !important;
    padding: 0 !important;
}

.card-text-content mjx-container[display="true"],
.card-tile-content mjx-container[display="true"],
.wasren-card-content mjx-container[display="true"] {
    margin: 0.2em 0 !important;
}