/* app/assets/styles/markdown.css */

/* === Markdown内のYouTubeサムネイル（中央寄せ＆枠内） === */
.review-body img[alt="YouTube thumbnail"] {
    display: block;
    margin: 0.8rem auto 1.2rem;
    max-width: 420px;
    width: 100%;
    height: auto;
    border-radius: .75rem;
    box-shadow: 0 4px 16px rgba(15, 23, 42, .15);
    transition: transform 0.15s ease-out;
}

.review-body img[alt="YouTube thumbnail"]:hover {
    transform: scale(1.02);
}

/* === Markdown headings in article (.review-body) === */
/* 濃いオレンジ基調に寄せたバージョン */

.review-body h1 {
    margin: 1.6rem 0 1rem;
    padding: .6rem 1.1rem;
    font-size: 1.45rem;
    font-weight: 800;
    border-left: 6px solid #ea580c;
    background: linear-gradient(90deg, #fed7aa 0%, #fdba74 45%, #ffedd5 100%);
    border-radius: .75rem;
}

.review-body h2 {
    margin: 1.4rem 0 .9rem;
    padding: .55rem 1rem;
    font-size: 1.28rem;
    font-weight: 700;
    border-left: 4px solid #f97316;
    background: linear-gradient(90deg, #ffedd5 0%, #fed7aa 50%, #fff7ed 100%);
    border-radius: .7rem;
}

.review-body h3 {
    margin: 1.2rem 0 .8rem;
    padding: .5rem .95rem;
    font-size: 1.12rem;
    font-weight: 650;
    border-left: 3px solid #fdba74;
    background: linear-gradient(90deg, #fff7ed 0%, #ffedd5 55%, #fff7ed 100%);
    border-radius: .65rem;
}

.review-body h4 {
    margin: 1rem 0 .6rem;
    padding: .4rem .9rem;
    font-size: 1.04rem;
    font-weight: 600;
    border-left: 2px solid #fed7aa;
    background: linear-gradient(90deg, #fff7ed 0%, #fffaf0 60%, #ffffff 100%);
    border-radius: .55rem;
}

.review-body h5 {
    margin: .9rem 0 .5rem;
    padding: .35rem .85rem;
    font-size: .97rem;
    font-weight: 600;
    background-color: #fff7ed;
    border-radius: .5rem;
}

.review-body h6 {
    margin: .8rem 0 .4rem;
    padding: .3rem .8rem;
    font-size: .9rem;
    font-weight: 600;
    background-color: #fffaf0;
    border-radius: .45rem;
}

/* ▼ スマホ時のMarkdown見出し・本文の縮小調整 */
@media (max-width: 575.98px) {
    .review-body {
        padding: .9rem .95rem;
    }

    .review-body h1 {
        margin: 1.2rem 0 .8rem;
        padding: .5rem .9rem;
        font-size: 1.25rem;
    }

    .review-body h2 {
        margin: 1.1rem 0 .7rem;
        padding: .45rem .85rem;
        font-size: 1.15rem;
    }

    .review-body h3 {
        margin: 1rem 0 .6rem;
        padding: .4rem .8rem;
        font-size: 1.05rem;
    }

    .review-body h4,
    .review-body h5,
    .review-body h6 {
        padding: .35rem .75rem;
        font-size: .9rem;
    }

    .review-body p,
    .review-body ul,
    .review-body ol {
        font-size: .95rem;
    }
}

/* === hr (区切り線) === */
.review-body hr {
    border: none;
    border-top: 2px dashed #fdba74;
    margin: 1.5rem auto;
    width: 60%;
}

/* === 本文 === */
.review-body p {
    margin: .6rem 0;
    font-size: 1rem;
    line-height: 1.8;
}

.review-body ul,
.review-body ol {
    padding-left: 1.2rem;
    margin: .55rem 0 .95rem;
    font-size: 1rem;
    line-height: 1.8;
}

.review-body .review-disclaimer {
    font-size: .75rem !important;
    line-height: 1.65;
    color: #6b7280;
    margin-top: 1.6rem;
    padding-top: .75rem;
    border-top: 1px dashed #e5e7eb;
}