/**
 * Product Detail Rich Text Frontend Rendering asset
 *
 * Mount: default | xinghang · product_detail only
 * （NOT platform.css / 全站 Rich Text Consumer 公共地板）
 *
 * Layer 1: Safety — containment · overflow · media
 * Layer 2: Readability Floor — CMS reading rhythm
 * Includes: Inline Media · Table Responsive · Scroll container rules
 *
 * Theme MAY override visual presentation inside these shells on product_detail.
 */


/* =========================================================
 * Safety Layer
 * ========================================================= */


/* =========================================================
 * Semantic shells
 * ========================================================= */

.platform-rich-text,
.Rich_text,
#id-rich-text,
.pcl-docs__body {

    /*
     * Editor HTML (.ae-col / .et-border / …) still uses float layout.
     * Without a BFC the shell height collapses and body text paints
     * over the inquiry card below ("超出框").
     */
    display: flow-root;
    overflow-wrap: break-word;
    word-wrap: break-word;
}


/* =========================================================
 * Text flow
 *
 * Containment only.
 * Reading rhythm lives in the Readability Floor.
 * ========================================================= */

.platform-rich-text p,
.Rich_text p,
#id-rich-text p,
.pcl-docs__body p {

    overflow-wrap: break-word;
}


/* =========================================================
 * Lists
 *
 * Scoped only.
 * Never touch global ul / ol.
 * ========================================================= */

.platform-rich-text ul,
.platform-rich-text ol,
.Rich_text ul,
.Rich_text ol,
#id-rich-text ul,
#id-rich-text ol,
.pcl-docs__body ul,
.pcl-docs__body ol {

    padding-left: 1.5em;
}


/* =========================================================
 * Inline Media
 *
 * Theme global img{display:block} MUST NOT break
 * inline-level replaced elements.
 *
 * Author width/height attributes are facts.
 * Do not force width:100%.
 * ========================================================= */

.platform-rich-text img,
.Rich_text img,
#id-rich-text img,
.pcl-docs__body img {

    max-width: 100%;
    height: auto;
    display: inline-block;
    vertical-align: middle;
}


/*
 * Standalone paragraph images:
 * keep visual block behavior.
 */

.platform-rich-text p > img:only-child,
.Rich_text p > img:only-child,
#id-rich-text p > img:only-child,
.pcl-docs__body p > img:only-child {

    display: block;
}


/* =========================================================
 * Figure
 * ========================================================= */

.platform-rich-text figure,
.Rich_text figure,
#id-rich-text figure,
.pcl-docs__body figure {

    max-width: 100%;
}


.platform-rich-text figcaption,
.Rich_text figcaption,
#id-rich-text figcaption,
.pcl-docs__body figcaption {

    display: block;
}


/* =========================================================
 * Tables
 *
 * Rich Text Table Responsive Contract v1
 * Rich Text Table Scroll Container v1
 *
 * Keep semantic table.
 * Horizontal scrolling belongs to .platform-rich-text__table-scroll.
 * The semantic shell keeps overflow-wrap and does not own overflow-x.
 *
 * NOTE:
 * Wrapper is a render projection. Do not rewrite the table.
 * No display:block/table mutation.
 * ========================================================= */

.platform-rich-text .platform-rich-text__table-scroll,
.Rich_text .platform-rich-text__table-scroll,
#id-rich-text .platform-rich-text__table-scroll,
.pcl-docs__body .platform-rich-text__table-scroll {

    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}


.platform-rich-text table,
.Rich_text table,
#id-rich-text table,
.pcl-docs__body table {

    display: table;
    width: max-content;
    min-width: 100%;
    max-width: none;

    border-collapse: collapse;
    table-layout: auto;
}


.platform-rich-text th,
.platform-rich-text td,
.Rich_text th,
.Rich_text td,
#id-rich-text th,
#id-rich-text td,
.pcl-docs__body th,
.pcl-docs__body td {

    white-space: normal;
    overflow-wrap: break-word;
}


.platform-rich-text th a,
.platform-rich-text td a,
.Rich_text th a,
.Rich_text td a,
#id-rich-text th a,
#id-rich-text td a,
.pcl-docs__body th a,
.pcl-docs__body td a {

    overflow-wrap: anywhere;
}


/* =========================================================
 * Embeds
 * ========================================================= */

.platform-rich-text iframe,
.platform-rich-text video,

.Rich_text iframe,
.Rich_text video,

#id-rich-text iframe,
#id-rich-text video,

.pcl-docs__body iframe,
.pcl-docs__body video {

    max-width: 100%;
}


.platform-rich-text pre,
.Rich_text pre,
#id-rich-text pre,
.pcl-docs__body pre {

    overflow-x: auto;
}


/* =========================================================
 * Readability Floor
 * ========================================================= */


/* ---------- Shell ---------- */

.platform-rich-text,
.Rich_text,
#id-rich-text,
.pcl-docs__body {

    line-height: 1.75;
}


/* ---------- Paragraph ---------- */

.platform-rich-text p,
.Rich_text p,
#id-rich-text p,
.pcl-docs__body p {

    margin: 0 0 1em;
}


/* ---------- First child ---------- */

.platform-rich-text > :first-child,
.Rich_text > :first-child,
#id-rich-text > :first-child,
.pcl-docs__body > :first-child {

    margin-top: 0;
}


/* ---------- Headings ----------
 *
 * Spacing rhythm only.
 * Theme owns size and color.
 */

.platform-rich-text h1,
.platform-rich-text h2,
.platform-rich-text h3,
.platform-rich-text h4,
.platform-rich-text h5,
.platform-rich-text h6,

.Rich_text h1,
.Rich_text h2,
.Rich_text h3,
.Rich_text h4,
.Rich_text h5,
.Rich_text h6,

#id-rich-text h1,
#id-rich-text h2,
#id-rich-text h3,
#id-rich-text h4,
#id-rich-text h5,
#id-rich-text h6,

.pcl-docs__body h1,
.pcl-docs__body h2,
.pcl-docs__body h3,
.pcl-docs__body h4,
.pcl-docs__body h5,
.pcl-docs__body h6 {

    margin-top: 1.5em;
    margin-bottom: .75em;
}


/* ---------- Lists ---------- */

.platform-rich-text li,
.Rich_text li,
#id-rich-text li,
.pcl-docs__body li {

    line-height: 1.7;
    margin-bottom: .4em;
}


.platform-rich-text li > p,
.Rich_text li > p,
#id-rich-text li > p,
.pcl-docs__body li > p {

    margin-bottom: 0;
}


/* ---------- Block images ----------
 *
 * Inline icons stay in the text line.
 */

.platform-rich-text p > img:only-child,
.Rich_text p > img:only-child,
#id-rich-text p > img:only-child,
.pcl-docs__body p > img:only-child {

    margin: 1em 0;
}


.platform-rich-text figure,
.Rich_text figure,
#id-rich-text figure,
.pcl-docs__body figure {

    margin: 1.5em 0;
}


.platform-rich-text figcaption,
.Rich_text figcaption,
#id-rich-text figcaption,
.pcl-docs__body figcaption {

    margin-top: .5em;
    line-height: 1.5;
}


/* ---------- Tables ---------- */

.platform-rich-text table,
.Rich_text table,
#id-rich-text table,
.pcl-docs__body table {

    margin: 1.5em 0;
}


.platform-rich-text th,
.platform-rich-text td,
.Rich_text th,
.Rich_text td,
#id-rich-text th,
#id-rich-text td,
.pcl-docs__body th,
.pcl-docs__body td {

    padding: .6em .8em;
}


/* ---------- Documents ---------- */

.platform-rich-text pre,
.Rich_text pre,
#id-rich-text pre,
.pcl-docs__body pre {

    margin: 1.5em 0;
}


.platform-rich-text blockquote,
.Rich_text blockquote,
#id-rich-text blockquote,
.pcl-docs__body blockquote {

    margin: 1.5em 0;
    padding-left: 1em;
}
