/* GLOBAL FONT ENFORCEMENT - Exclude Arabic text */
*:not(.arabic-text):not([lang="ar"]):not([dir="rtl"]) {
    font-family: "Montserrat";
}

/* FONT AWESOME ICONS */
.fas, .far, .fab, .fal, .fad, .fa,
i.fas, i.far, i.fab, i.fal, i.fad, i.fa,
span.fas, span.far, span.fab, span.fal, span.fad, span.fa,
[class*="fa-"], i[class*="fa-"], span[class*="fa-"] {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
}

.fab, i.fab, span.fab {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

.far, i.far, span.far {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 400 !important;
}

/* ARABIC TEXT - Font & Direction ALWAYS enforced, alignment can be changed from CMS */
.arabic-text,
.arabic-text *,
[lang="ar"],
[lang="ar"] *,
[dir="rtl"],
[dir="rtl"] * {
    font-family: "Noto Naskh Arabic" !important;
    direction: rtl !important;
    text-align: justify;
    line-height: 1.8 !important;
}

/* Arabic default alignment - always justify unless explicitly overridden */
.arabic-text,
[lang="ar"],
[dir="rtl"] {
    text-align: justify !important;
}

/* Allow manual override from CMS */
.arabic-text[style*="text-align: center"],
[lang="ar"][style*="text-align: center"],
[dir="rtl"][style*="text-align: center"] {
    text-align: center !important;
}

.arabic-text[style*="text-align: left"],
[lang="ar"][style*="text-align: left"],
[dir="rtl"][style*="text-align: left"] {
    text-align: left !important;
}

.arabic-text[style*="text-align: right"],
[lang="ar"][style*="text-align: right"],
[dir="rtl"][style*="text-align: right"] {
    text-align: right !important;
}

/* MIXED CONTENT (Indonesian + Arabic words) */
/* .mixed-arabic-content {
    font-family: "Montserrat" !important;
    direction: ltr !important;
} */

.mixed-arabic-content *[lang="ar"],
.mixed-arabic-content .arabic-char {
    font-family: "Noto Naskh Arabic" !important;
    direction: ltr !important;
    display: inline !important;
}

/* SYSTEM FONT OVERRIDE */
[style*="system-ui"],
[style*="-apple-system"],
[style*="BlinkMacSystemFont"],
[style*="Segoe UI"],
[style*="Roboto"],
[style*="Helvetica"],
[style*="Arial"],
[style*="sans-serif"],
[style*="serif"],
[style*="Figtree"],
[style*="Inter"] {
    font-family: "Montserrat" !important;
}

/* PROSE CONTENT */
.prose.article-content *:not(.arabic-text):not([lang="ar"]):not([dir="rtl"]) {
    font-family: "Montserrat" !important;
}

/* ARABIC in PROSE - Font & Direction enforced, alignment flexible, font-size preserved */
.prose.article-content .arabic-text,
.prose.article-content [lang="ar"],
.prose.article-content [dir="rtl"],
.prose.article-content .arabic-text *,
.prose.article-content [lang="ar"] *,
.prose.article-content [dir="rtl"] * {
    font-family: "Noto Naskh Arabic" !important;
    direction: rtl !important;
    line-height: 1.8 !important;
}

/* Arabic with ANY inline styles (font-size, color, etc) - Font & Direction still enforced, other styles preserved */
.prose.article-content .arabic-text[style],
.prose.article-content [lang="ar"][style],
.prose.article-content [dir="rtl"][style],
.prose.article-content .arabic-text *[style],
.prose.article-content [lang="ar"] *[style],
.prose.article-content [dir="rtl"] *[style] {
    font-family: "Noto Naskh Arabic" !important;
    direction: rtl !important;
    line-height: 1.8 !important;
}

/* Arabic default alignment - always justify unless explicitly overridden */
.prose.article-content .arabic-text,
.prose.article-content [lang="ar"],
.prose.article-content [dir="rtl"] {
    text-align: justify !important;
}

/* Allow manual override from CMS */
.prose.article-content .arabic-text[style*="text-align: center"],
.prose.article-content [lang="ar"][style*="text-align: center"],
.prose.article-content [dir="rtl"][style*="text-align: center"] {
    text-align: center !important;
}

.prose.article-content .arabic-text[style*="text-align: left"],
.prose.article-content [lang="ar"][style*="text-align: left"],
.prose.article-content [dir="rtl"][style*="text-align: left"] {
    text-align: left !important;
}

.prose.article-content .arabic-text[style*="text-align: right"],
.prose.article-content [lang="ar"][style*="text-align: right"],
.prose.article-content [dir="rtl"][style*="text-align: right"] {
    text-align: right !important;
}

/* DEFAULT TEXT ALIGNMENT (respects CMS choices) - Match editor defaults */
.prose.article-content p:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]) {
    text-align: left;
}

.prose.article-content h1:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]),
.prose.article-content h2:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]),
.prose.article-content h3:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]),
.prose.article-content h4:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]),
.prose.article-content h5:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]),
.prose.article-content h6:not([style*="text-align"]):not(.arabic-text):not([lang="ar"]):not([dir="rtl"]) {
    text-align: left;
}

/* QUILL EDITOR ALIGNMENT CLASSES (legacy support) */
.prose.article-content .ql-align-left:not([style*="text-align"]) {
    text-align: left;
}

.prose.article-content .ql-align-center:not([style*="text-align"]) {
    text-align: center;
}

.prose.article-content .ql-align-right:not([style*="text-align"]) {
    text-align: right;
}

.prose.article-content .ql-align-justify:not([style*="text-align"]) {
    text-align: justify;
}

/* DEFAULT TYPOGRAPHY */
.prose.article-content p:not([style*="font-size"]) {
    font-size: 16px;
}

.prose.article-content h2:not([style*="color"]) {
    color: #0047b2;
}

.prose.article-content h2:not([style*="font-size"]) {
    font-size: 18px;
}

.prose.article-content h2:not([style*="font-weight"]) {
    font-weight: bold;
}

.prose.article-content h2:not([style*="margin-top"]) {
    margin-top: 30px;
}

.prose.article-content h2:not([style*="margin-bottom"]) {
    margin-bottom: 15px;
}

/* LIST STYLING */
.prose.article-content ul:not([style*="list-style-type"]) {
    list-style-type: disc;
}

.prose.article-content ol:not([style*="list-style-type"]) {
    list-style-type: decimal;
}

/* Fix list font size on small screens - override prose-sm */
.prose.article-content ul li,
.prose.article-content ol li {
    font-size: 16px !important;
    line-height: 1.75 !important;
}

/* Nested lists */
.prose.article-content ul li ul li,
.prose.article-content ol li ol li,
.prose.article-content ul li ol li,
.prose.article-content ol li ul li {
    font-size: 15px !important;
}

/* TABLE STYLING - Match Jodit Editor exactly */
.prose.article-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    font-size: 14px;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    table-layout: auto;
    word-wrap: break-word;
}

.prose.article-content thead {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
}

.prose.article-content th {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #1f2937;
    border-bottom: 2px solid #e5e7eb;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.prose.article-content td {
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    color: #374151;
    vertical-align: top;
}

.prose.article-content tbody tr {
    transition: background-color 0.2s ease;
}

.prose.article-content tbody tr:hover {
    background-color: #f9fafb;
}

.prose.article-content tbody tr:last-child td {
    border-bottom: none;
}

/* Tablet (768px - 1024px): Smaller but still table */
@media (max-width: 1024px) and (min-width: 769px) {
    .prose.article-content table {
        font-size: 13px;
    }
    
    .prose.article-content th,
    .prose.article-content td {
        padding: 10px 12px;
    }
}

/* Small & Medium screens (481px - 768px): Compact table */
@media (max-width: 768px) and (min-width: 481px) {
    .prose.article-content table {
        font-size: 12px;
        display: table;
        width: 100%;
        table-layout: fixed; /* Fixed layout for better control */
    }
    
    .prose.article-content th,
    .prose.article-content td {
        padding: 8px 10px;
        word-wrap: break-word;
        overflow-wrap: break-word;
        hyphens: auto;
    }
    
    .prose.article-content th {
        font-size: 11px;
    }
}

/* Extra small mobile (≤480px): Very compact table */
@media (max-width: 480px) {
    .prose.article-content table {
        font-size: 11px;
        display: table;
        width: 100%;
        table-layout: fixed;
    }
    
    .prose.article-content th,
    .prose.article-content td {
        padding: 6px 8px;
        word-wrap: break-word;
        overflow-wrap: break-word;
        hyphens: auto;
    }
    
    .prose.article-content th {
        font-size: 10px;
        letter-spacing: 0.3px;
    }
}

/* LINK STYLING */
.prose.article-content a:not([style*="color"]) {
    color: #3b82f6;
}

.prose.article-content a:not([style*="text-decoration"]) {
    text-decoration: underline;
}

/* IMAGE STYLING */
.prose.article-content img:not([style*="max-width"]) {
    max-width: 100%;
}

.prose.article-content img:not([style*="height"]) {
    height: auto;
}

.prose.article-content img {
    width: 100%;
    object-fit: cover;
}

/* FEATURED IMAGE - Responsive for all orientations */
.featured-image {
    max-height: 60vh;
    min-height: 200px;
    max-width: 100%;
    width: 100%;
    object-fit: contain;
}

/* Mobile Landscape: Reduce max-height */
@media (max-width: 768px) and (orientation: landscape) {
    .featured-image {
        max-height: 80vh;
        min-height: 150px;
        object-fit: contain;
    }
}

/* Mobile Portrait: Standard height */
@media (max-width: 768px) and (orientation: portrait) {
    .featured-image {
        max-height: 50vh;
        min-height: 200px;
        object-fit: contain;
    }
}

/* Tablet and up: Full height */
@media (min-width: 769px) {
    .featured-image {
        max-height: 60vh;
        min-height: 300px;
        object-fit: cover;
    }
}

/* BLOCKQUOTE STYLING */
.prose.article-content blockquote:not([style*="border-left"]) {
    border-left: 4px solid #10b981;
}

.prose.article-content blockquote:not([style*="background"]) {
    background: #f0fdf4;
}

.prose.article-content blockquote:not([style*="padding"]) {
    padding: 1rem 1.5rem;
}

.prose.article-content blockquote:not([style*="margin"]) {
    margin: 1.5rem 0;
}

/* TABLE WRAPPER - No scroll, fully responsive */
.prose.article-content {
    overflow-x: hidden !important;
}

.table-responsive {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.table-responsive table {
    margin: 1.5rem 0 !important;
    width: 100% !important;
}

/* Remove any min-width constraints on mobile */
@media (max-width: 768px) {
    .table-responsive {
        overflow: visible !important;
    }
    
    .table-responsive table {
        min-width: auto !important;
        display: block !important;
    }
}

/* CODE STYLING */
.prose.article-content code:not([style*="background"]) {
    background: #f3f4f6;
}

.prose.article-content code:not([style*="color"]) {
    color: #374151;
}

.prose.article-content code:not([style*="padding"]) {
    padding: 0.125rem 0.25rem;
}

.prose.article-content code:not([style*="border-radius"]) {
    border-radius: 0.25rem;
}

.prose.article-content pre:not([style*="background"]) {
    background: #1f2937;
}

.prose.article-content pre:not([style*="color"]) {
    color: #f9fafb;
}

.prose.article-content pre:not([style*="padding"]) {
    padding: 1rem;
}

.prose.article-content pre:not([style*="border-radius"]) {
    border-radius: 0.5rem;
}

.prose.article-content pre:not([style*="overflow-x"]) {
    overflow-x: auto;
}