@font-face {
    font-family: 'KhmerOSMuolLight';
    src: local('Khmer OS Muol Light'), url('../fonts/Khmer OS Muol Light.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'KhmerOSMuolLight';
    src: local('Khmer OS Muol Light'), url('../fonts/Khmer OS Muol Light.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Alias for compatibility */
@font-face {
    font-family: 'KhmerOSMuolLight';
    src: local('Khmer OS Muol Light'), url('../fonts/Khmer OS Muol Light.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'KhmerOSMuolLight';
    src: local('Khmer OS Muol Light'), url('../fonts/Khmer OS Muol Light.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tacteing';
    src: url('../fonts/Tacteing.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

[style*="Tacteing"],
.tacteing,
span[style*="font-family: Tacteing"],
.news-content-rendered *[style*="Tacteing"] {
    font-family: 'Tacteing', 'KhmerOSMuolLight', serif !important;
    speak: never;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
}

/* Khmer Muol headings: standardized locked line-height and margin for consistent rhythm */
.welcome-title,
.khmer-muol {
    font-family: 'KhmerOSMuolLight', 'Tacteing', serif;
    font-weight: normal !important;
    line-height: 2.2 !important; /* Slightly reduced from 2.5 for better integration with standard headings */
    margin-top: 1rem !important;
    margin-bottom: 0.5rem !important;
    display: block;
    text-rendering: auto !important;
}

/* Optional Safari hint */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .welcome-title, .khmer-muol {
        -webkit-font-smoothing: antialiased;
    }
}

/* Apply Khmer OS Muol Light to specific elements */
.khmer-muol-font {
    font-family: 'KhmerOSMuolLight', 'Tacteing', serif;
}

/* Spacing adjustments for Khmer OS Muol Light in Slides and Editor */
.slide [style*="KhmerOSMuolLight"],
.welcome-title [style*="KhmerOSMuolLight"],
.cke_editable [style*="KhmerOSMuolLight"] {
    line-height: 2.2 !important;
}

.slide [style*="KhmerOSMuolLight"] + [style*="KhmerOSMuolLight"],
.welcome-title [style*="KhmerOSMuolLight"] + [style*="KhmerOSMuolLight"],
.cke_editable [style*="KhmerOSMuolLight"] + [style*="KhmerOSMuolLight"],
.slide [style*="KhmerOSMuolLight"] + [style*="KhmerOSMuolLight"],
.welcome-title [style*="KhmerOSMuolLight"] + [style*="KhmerOSMuolLight"],
.cke_editable [style*="KhmerOSMuolLight"] + [style*="KhmerOSMuolLight"],
.slide [style*="KhmerOSMuolLight"] + p [style*="KhmerOSMuolLight"],
.slide [style*="KhmerOSMuolLight"] + p [style*="KhmerOSMuolLight"],
.slide p:has([style*="KhmerOSMuolLight"]) + p:has([style*="KhmerOSMuolLight"]),
.slide p:has([style*="KhmerOSMuolLight"]) + p:has([style*="KhmerOSMuolLight"]),
.slide p:has([style*="KhmerOSMuolLight"]) + [style*="KhmerOSMuolLight"],
.slide p:has([style*="KhmerOSMuolLight"]) + [style*="KhmerOSMuolLight"],
.slide [style*="KhmerOSMuolLight"] + p:has([style*="KhmerOSMuolLight"]),
.slide [style*="KhmerOSMuolLight"] + p:has([style*="KhmerOSMuolLight"]),
.welcome-title div + div,
.welcome-title p + p,
.welcome-title h1 + h1,
.welcome-title h1 + p,
.welcome-title p + h1 {
    margin-top: 10mm !important;
}

.slide [style*="KhmerOSMuolLight"] + [style*="Tacteing"],
.welcome-title [style*="KhmerOSMuolLight"] + [style*="Tacteing"],
.cke_editable [style*="KhmerOSMuolLight"] + [style*="Tacteing"],
.slide [style*="KhmerOSMuolLight"] + [style*="Tacteing"],
.welcome-title [style*="KhmerOSMuolLight"] + [style*="Tacteing"],
.cke_editable [style*="KhmerOSMuolLight"] + [style*="Tacteing"],
.slide p:has([style*="KhmerOSMuolLight"]) + p:has([style*="Tacteing"]),
.slide p:has([style*="KhmerOSMuolLight"]) + p:has([style*="Tacteing"]),
.slide p:has([style*="KhmerOSMuolLight"]) + [style*="Tacteing"],
.slide p:has([style*="KhmerOSMuolLight"]) + [style*="Tacteing"],
.slide [style*="KhmerOSMuolLight"] + p:has([style*="Tacteing"]),
.slide [style*="KhmerOSMuolLight"] + p:has([style*="Tacteing"]) {
    margin-top: 8mm !important;
}