/* CKEditor 5 Content Rendering Stylesheet for Frontend Display */

/* Root Container: Force website theme font family by default, allow inline font family override */
.ck-content,
.ck-content p,
.ck-content div,
.ck-content li,
.ck-content h1,
.ck-content h2,
.ck-content h3,
.ck-content h4,
.ck-content h5,
.ck-content h6,
.ck-content span,
.ck-content a,
.ck-content blockquote,
.ck-content table,
.ck-content th,
.ck-content td {
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    word-wrap: break-word;
}

/* Allow explicit inline font-family to override theme font */
.ck-content [style*="font-family"] {
    font-family: inherit;
}

/* Eliminate all theme CSS pseudo-element icons / stray bullets */
.ck-content p::before,
.ck-content p::after,
.ck-content li::before,
.ck-content li::after,
.ck-content div::before,
.ck-content div::after,
.ck-content h1::before,
.ck-content h1::after,
.ck-content h2::before,
.ck-content h2::after,
.ck-content h3::before,
.ck-content h3::after,
.ck-content h4::before,
.ck-content h4::after,
.ck-content h5::before,
.ck-content h5::after,
.ck-content h6::before,
.ck-content h6::after {
    content: none !important;
    display: none !important;
}

/* Text Alignment Support - Forcefully apply alignments */
.ck-content .text-left,
.ck-content [style*="text-align: left"],
.ck-content [style*="text-align:left"] {
    text-align: left !important;
}

.ck-content .text-right,
.ck-content [style*="text-align: right"],
.ck-content [style*="text-align:right"] {
    text-align: right !important;
}

.ck-content .text-center,
.ck-content [style*="text-align: center"],
.ck-content [style*="text-align:center"] {
    text-align: center !important;
}

.ck-content .text-justify,
.ck-content [style*="text-align: justify"],
.ck-content [style*="text-align:justify"] {
    text-align: justify !important;
}

/* Font Sizes Classes & Headings */
.ck-content .text-tiny { font-size: 0.7em !important; }
.ck-content .text-small { font-size: 0.85em !important; }
.ck-content .text-big { font-size: 1.4em !important; }
.ck-content .text-huge { font-size: 1.8em !important; }

/* Paragraphs */
.ck-content p {
    display: block !important;
    margin-top: 0 !important;
    margin-bottom: 1rem !important;
    line-height: 1.7;
    color: inherit;
    position: static !important;
    list-style: none !important;
}

/* Force inline line-height to take absolute priority */
.ck-content [style*="line-height"] {
    /* Inline style="line-height: ..." automatically overrides line-height: 1.7 */
}

/* Headings: Preserve text editor styling & sizes */
.ck-content h1 {
    font-size: 2.2rem;
    font-weight: 700;
    margin-top: 1.75rem !important;
    margin-bottom: 0.85rem !important;
    line-height: 1.3;
}

.ck-content h2 {
    font-size: 1.75rem;
    font-weight: 700;
    margin-top: 1.5rem !important;
    margin-bottom: 0.75rem !important;
    line-height: 1.35;
}

.ck-content h3 {
    font-size: 1.4rem;
    font-weight: 700;
    margin-top: 1.25rem !important;
    margin-bottom: 0.65rem !important;
    line-height: 1.4;
}

.ck-content h4 {
    font-size: 1.2rem;
    font-weight: 700;
    margin-top: 1rem !important;
    margin-bottom: 0.5rem !important;
    line-height: 1.4;
}

.ck-content h5 {
    font-size: 1.1rem;
    font-weight: 700;
    margin-top: 1rem !important;
    margin-bottom: 0.5rem !important;
}

.ck-content h6 {
    font-size: 1rem;
    font-weight: 700;
    margin-top: 0.85rem !important;
    margin-bottom: 0.5rem !important;
}

/* Text Formatting */
.ck-content strong,
.ck-content b {
    font-weight: 700 !important;
}

.ck-content em,
.ck-content i {
    font-style: italic !important;
}

.ck-content u {
    text-decoration: underline !important;
}

.ck-content s,
.ck-content del,
.ck-content strike {
    text-decoration: line-through !important;
}

/* Links inside blog content */
.ck-content a {
    color: #2b56f5;
    text-decoration: underline;
    font-weight: 600;
}

.ck-content a:hover {
    color: #1a3bbd;
}

/* Unordered & Ordered Lists */
.ck-content ul {
    list-style-type: disc !important;
    padding-left: 2rem !important;
    margin-left: 0 !important;
    margin-top: 0.5rem !important;
    margin-bottom: 1.25rem !important;
    display: block !important;
}

.ck-content ol {
    list-style-type: decimal !important;
    padding-left: 2rem !important;
    margin-left: 0 !important;
    margin-top: 0.5rem !important;
    margin-bottom: 1.25rem !important;
    display: block !important;
}

.ck-content ul ul,
.ck-content ol ul {
    list-style-type: circle !important;
    margin-bottom: 0.5rem !important;
}

.ck-content ul ul ul,
.ck-content ol ul ul {
    list-style-type: square !important;
    margin-bottom: 0.5rem !important;
}

.ck-content li {
    list-style: inherit !important;
    display: list-item !important;
    margin-bottom: 0.4rem !important;
    padding-left: 0.25rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    position: static !important;
}

/* Todo List Support */
.ck-content ul.todo-list {
    list-style: none !important;
    padding-left: 0 !important;
}

.ck-content ul.todo-list li {
    position: relative !important;
    padding-left: 1.8rem !important;
}

.ck-content ul.todo-list li input[type="checkbox"] {
    position: absolute !important;
    left: 0 !important;
    top: 0.25rem !important;
}

/* Table Styling */
.ck-content figure.table {
    display: table;
    clear: both;
    margin: 1.25rem auto;
    max-width: 100%;
}

.ck-content figure.table table,
.ck-content table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    width: 100% !important;
    border: 1px solid #bfbfbf !important;
    margin-bottom: 1rem;
}

.ck-content table td,
.ck-content table th {
    min-width: 2em;
    padding: 0.5rem 0.75rem !important;
    border: 1px solid #bfbfbf !important;
}

.ck-content table th {
    font-weight: bold;
    background-color: rgba(0, 0, 0, 0.04) !important;
}

/* Figures & Images */
.ck-content figure.image {
    display: table;
    clear: both;
    text-align: center;
    margin: 1.25rem auto;
    max-width: 100%;
}

.ck-content figure.image img,
.ck-content img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

.ck-content figure.image.image-style-side {
    float: right;
    margin-left: 1.5rem;
    max-width: 50%;
}

.ck-content figure.image.image-style-align-left {
    float: left;
    margin-right: 1.5rem;
}

.ck-content figure.image.image-style-align-center {
    margin-left: auto;
    margin-right: auto;
}

.ck-content figure.image.image-style-align-right {
    float: right;
    margin-left: 1.5rem;
}

.ck-content figure.image_resized {
    display: block;
    box-sizing: border-box;
}

.ck-content figure.image_resized img {
    width: 100%;
}

.ck-content figure.image figcaption {
    display: table-caption;
    caption-side: bottom;
    word-break: break-word;
    color: #555;
    background-color: #f7f7f7;
    padding: 0.5rem;
    font-size: 0.85em;
    text-align: center;
}

/* Blockquotes */
.ck-content blockquote {
    overflow: hidden;
    padding: 1rem 1.5rem !important;
    margin: 1.25rem 0 !important;
    font-style: italic;
    border-left: 5px solid #007bff !important;
    background-color: #f8f9fa !important;
}

.ck-content blockquote p {
    margin-bottom: 0 !important;
}

/* Code & Preformatted Text */
.ck-content pre {
    padding: 1rem !important;
    color: #24292e !important;
    background-color: #f6f8fa !important;
    border: 1px solid #e1e4e8 !important;
    border-radius: 4px !important;
    white-space: pre-wrap !important;
    font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace !important;
    font-size: 0.9em !important;
    margin-bottom: 1rem !important;
}

.ck-content code {
    background-color: rgba(27, 31, 35, 0.05);
    padding: 0.2em 0.4em;
    border-radius: 3px;
    font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace !important;
    font-size: 85%;
}

.ck-content pre code {
    background-color: transparent !important;
    padding: 0 !important;
}

/* Highlight Markers */
.ck-content mark.marker-yellow { background-color: #fdfd77 !important; }
.ck-content mark.marker-green { background-color: #63f963 !important; }
.ck-content mark.marker-pink { background-color: #fc9797 !important; }
.ck-content mark.marker-blue { background-color: #72ccfd !important; }
.ck-content mark.pen-red { color: #e71313 !important; background-color: transparent !important; }
.ck-content mark.pen-green { color: #128a12 !important; background-color: transparent !important; }

/* Horizontal Lines */
.ck-content hr {
    margin: 1.5rem 0 !important;
    border: 0 !important;
    border-top: 1px solid #e0e0e0 !important;
}