/* Transisi Global Mode Malam agar Mulus */
html { transition: background-color 0.4s ease, color 0.4s ease; }

/* Ticker Animasi */
.marquee-container { width: 100%; overflow: hidden; white-space: nowrap; box-sizing: border-box; display: flex; align-items: center; }
.marquee-content { display: inline-block; padding-left: 100%; animation: marquee 25s linear infinite; }
.marquee-container:hover .marquee-content { animation-play-state: paused; }
@keyframes marquee { 0% { transform: translate(0, 0); } 100% { transform: translate(-100%, 0); } }

/* Format Gambar/Video dari WYSIWYG Editor agar responsif di HP */
.quill-content img {
max-width: 100%;
height: auto;
border-radius: 0.75rem;
margin: 1.5rem auto;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}
.quill-content iframe {
width: 100%;
aspect-ratio: 16 / 9;
border-radius: 0.75rem;
margin: 1.5rem 0;
}

/* Huruf Besar di Awal Paragraf Berita (Drop Cap) */
.quill-content > p:first-of-type::first-letter {
float: left; font-size: 4.5rem; line-height: 0.8; font-weight: 900; margin-right: 0.75rem; margin-bottom: 0rem; margin-top: 0.2rem; color: #991B1B; font-family: 'Poppins', sans-serif; text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
}
.dark .quill-content > p:first-of-type::first-letter { color: #F87171; }

/* Spasi Paragraf Berita */
.quill-content p { margin-bottom: 1.5rem; line-height: 1.8; }
.quill-content h2, .quill-content h3 { font-family: 'Poppins', sans-serif; font-weight: 700; margin-top: 2.5rem; margin-bottom: 1rem; color: #111827; }
.dark .quill-content h2, .dark .quill-content h3 { color: #f3f4f6; }
.quill-content ul { list-style-type: disc; margin-left: 1.5rem; margin-bottom: 1.5rem; }
.quill-content ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 1.5rem; }

/* Styling Toolbar Admin Quill agar support Dark Mode */
.dark .ql-toolbar { background: #1e293b; border-color: #334155 !important; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; }
.dark .ql-container { border-color: #334155 !important; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; }
.dark .ql-stroke { stroke: #cbd5e1 !important; }
.dark .ql-fill { fill: #cbd5e1 !important; }
.dark .ql-picker { color: #cbd5e1 !important; }

/* Custom Scrollbar agar terlihat rapi */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.dark ::-webkit-scrollbar-track { background: #0f172a; }
.dark ::-webkit-scrollbar-thumb { background: #334155; }
.dark ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* Animasi Loading */
.loader { border: 4px solid #f3f3f3; border-top: 4px solid #991B1B; border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }