/*
   General List Style Restore
   --------------------------
   Tailwind CSS resets list-style-type to none and padding to 0.
   These rules restore them for the GrapesJS editor and final content.
*/
ul, ol {
    padding-left: 32px !important;
}

ul {
    list-style-type: disc !important;
}

ol {
    list-style-type: decimal !important;
}

li {
    display: list-item !important;
    margin-bottom: 4px !important;
}

.tinymce-content p {
    margin: 14px 0;
}

/* List styles */
.tinymce-content ul,
.tinymce-content ol {
    padding-left: 40px;
    margin: 14px 0;
}

.tinymce-content ul {
    list-style-type: disc;
}

.tinymce-content ol {
    list-style-type: decimal;
}

.tinymce-content li {
    margin-bottom: 4px;
    display: list-item;
}

/* Ensure paragraph inside li doesn't break alignment */
.tinymce-content li p {
    margin: 0;
    display: inline;
}

.tinymce-content {
    line-height: 1.6;
}


.tinymce-content h3 {
    font-size: 24px;
}

.tinymce-content img {
    max-width: 100%;
    height: auto;
    display: block;
}

.tinymce-content figure figcaption {
    text-align: center;
    color: #9ca3af;
    position: relative;
    min-height: 1.2em;
    margin: 4px 0 0 0;
}

.tinymce-content table,
.tinymce-content th,
.tinymce-content td {
    border: 1px solid #ccc;
}

.tinymce-content table {
    border-collapse: collapse;
}

.tinymce-content td {
    padding: 6.4px;
    color: #374151;
}

/* Dashed borders for layout tables (border="0") - Shows in both TinyMCE and GrapesJS canvas */
.tinymce-content table:not([border]),
.tinymce-content table[border="0"],
.tinymce-content table[style*="border-width: 0px"],
.tinymce-content table:not([border]) td,
.tinymce-content table[border="0"] td,
.tinymce-content table[style*="border-width: 0px"] td,
.tinymce-content table:not([border]) th,
.tinymce-content table[border="0"] th,
.tinymce-content table[style*="border-width: 0px"] th,
.tinymce-content table:not([border]) caption,
.tinymce-content table[border="0"] caption,
.tinymce-content table[style*="border-width: 0px"] caption {
    border: 1px dashed #bbb;
}

.tinymce-content a {
    color: #006ce7;
    cursor: pointer;
    text-decoration: underline;
}

/* Checklist styles */
.tinymce-content .tox-checklist>li:not(.tox-checklist--hidden) {
    list-style: none;
    margin: 0.25em 0;
}

.tinymce-content .tox-checklist>li:not(.tox-checklist--hidden)::before {
    content: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-unchecked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2215%22%20height%3D%2215%22%20x%3D%22.5%22%20y%3D%22.5%22%20fill-rule%3D%22nonzero%22%20stroke%3D%22%234C4C4C%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A");
    cursor: pointer;
    height: 1em;
    margin-left: -1.5em;
    margin-top: 0.125em;
    position: absolute;
    width: 1em;
}

.tinymce-content .tox-checklist li:not(.tox-checklist--hidden).tox-checklist--checked::before {
    content: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-checked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%234099FF%22%20fill-rule%3D%22nonzero%22%20rx%3D%222%22%2F%3E%3Cpath%20id%3D%22Path%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M11.5703186%2C3.14417309%20C11.8516238%2C2.73724603%2012.4164781%2C2.62829933%2012.83558%2C2.89774797%20C13.260121%2C3.17069355%2013.3759736%2C3.72932262%2013.0909105%2C4.14168582%20L7.7580587%2C11.8560195%20C7.43776896%2C12.3193404%206.76483983%2C12.3852142%206.35607322%2C11.9948725%20L3.02491697%2C8.8138662%20C2.66090143%2C8.46625845%202.65798871%2C7.89594698%203.01850234%2C7.54483354%20C3.373942%2C7.19866177%203.94940006%2C7.19592841%204.30829608%2C7.5386474%20L6.85276923%2C9.9684299%20L11.5703186%2C3.14417309%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A");
}

/* PrismJS Syntax Highlighting */
.tinymce-content code[class*="language-"],
.tinymce-content pre[class*="language-"] {
    color: black;
    background: none;
    text-shadow: 0 1px white;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    line-height: 1.5;
    tab-size: 4;
    hyphens: none;
}

.tinymce-content pre[class*="language-"] {
    padding: 1em;
    margin: 0.5em 0;
    overflow: auto;
    background: #f5f2f0;
}

.tinymce-content :not(pre)>code[class*="language-"] {
    padding: 0.1em;
    border-radius: 0.3em;
    white-space: normal;
    background: #f5f2f0;
}

.tinymce-content .token.comment,
.tinymce-content .token.prolog,
.tinymce-content .token.doctype,
.tinymce-content .token.cdata {
    color: slategray;
}

.tinymce-content .token.punctuation {
    color: #999;
}

.tinymce-content .token.namespace {
    opacity: 0.7;
}

.tinymce-content .token.property,
.tinymce-content .token.tag,
.tinymce-content .token.boolean,
.tinymce-content .token.number,
.tinymce-content .token.constant,
.tinymce-content .token.symbol,
.tinymce-content .token.deleted {
    color: #905;
}

.tinymce-content .token.selector,
.tinymce-content .token.attr-name,
.tinymce-content .token.string,
.tinymce-content .token.char,
.tinymce-content .token.builtin,
.tinymce-content .token.inserted {
    color: #690;
}

.tinymce-content .token.operator,
.tinymce-content .token.entity,
.tinymce-content .token.url {
    color: #9a6e3a;
}

.tinymce-content .token.atrule,
.tinymce-content .token.attr-value,
.tinymce-content .token.keyword {
    color: #07a;
}

.tinymce-content .token.function,
.tinymce-content .token.class-name {
    color: #DD4A68;
}

.tinymce-content .token.regex,
.tinymce-content .token.important,
.tinymce-content .token.variable {
    color: #e90;
}

.tinymce-content .token.important,
.tinymce-content .token.bold {
    font-weight: bold;
}

.tinymce-content .token.italic {
    font-style: italic;
}

/* Footnotes & Math */
.tinymce-content div.mce-footnotes hr {
    margin-inline: 0 auto;
    width: 25%;
}

.tinymce-content div.mce-footnotes li>a.mce-footnotes-backlink {
    text-decoration: none;
}

.tinymce-content tiny-math-block {
    display: flex;
    justify-content: center;
    margin: 16px 0;
}

.tinymce-content tiny-math-inline {
    display: inline-block;
}

/* Figures & Alignment */
.tinymce-content figure.align-left {
    float: left;
    margin: 0 1em 1em 0;
}

.tinymce-content figure.align-right {
    float: right;
    margin: 0 0 1em 1em;
}

.tinymce-content figure.image.align-center {
    display: table;
    margin-left: auto;
    margin-right: auto;
}

/* TOC & Page Break */
.tinymce-content .mce-toc {
    border: 1px solid gray;
    padding: 1em;
}

.tinymce-content .mce-toc h2 {
    margin: 4px;
}

.tinymce-content .mce-toc ul>li {
    list-style-type: none;
}

.tinymce-content .mce-pagebreak {
    border: 1px dashed #aaa;
    cursor: default;
    display: block;
    height: 5px;
    margin-top: 15px;
    page-break-before: always;
    width: 100%;
}

/* Dynamic News Grid responsive columns (used by GrapesJS traits + frontend render) */
.pulse-news-grid-cols-m-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}

.pulse-news-grid-cols-m-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

@media (min-width: 768px) {
    .pulse-news-grid-cols-t-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-t-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-t-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-t-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 1024px) {
    .pulse-news-grid-cols-d-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-d-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-d-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-d-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-d-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }

    .pulse-news-grid-cols-d-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }
}

/* ── Dynamic Repeater clone elements ──
   Ẩn outline/border, không cho tương tác
   (clone chỉ là preview, không phải GrapesJS component) */
[data-dynamic-repeater-clone],
[data-dynamic-repeater-clone] *,
[data-dynamic-repeater-clone] *::before,
[data-dynamic-repeater-clone] *::after {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    pointer-events: none !important;
    user-select: none !important;
    border-color: inherit !important;
}
