/* public/css/style.css */

/* === 1. NAVIGASI DESKTOP (TIDAK BERUBAH) === */
.nav-menu {
    font-size: 1.1rem;
    font-weight: 700;
    color: #374151;
    transition: color 0.3s ease;
}

.nav-menu:hover {
    color: #2563eb;
}

/* Animasi putar untuk chevron pada level 3 */
.group\/level3:hover i {
    transform: rotate(180deg);
    color: #1e3a8a; /* Warna blue-900 */
    opacity: 1;
}
.dropdown-wrapper {
    position: absolute;
    display: none;
    background-color: white;
    min-width: 240px;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    border-top: 3px solid #2563eb;
    z-index: 100;
    top: 100%;
    left: 0;
}

.group:hover .dropdown-wrapper {
    display: block;
    animation: fadeIn 0.2s ease-in-out;
}

.dropdown-item {
    display: block;
    padding: 12px 20px;
    font-size: 0.95rem;
    font-weight: 600;
    color: #4b5563;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.2s;
}

.dropdown-item:hover {
    background-color: #f9fafb;
    color: #2563eb;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* === 2. NAVIGASI MOBILE (DIREVISI AGAR TIDAK KACAU) === */
#mobile-menu {
    position: fixed;    /* Berubah ke fixed agar tidak mendorong layout */
    top: 70px;         /* Sesuaikan dengan tinggi navbar */
    left: 0;
    right: 0;
    bottom: 0;         /* Full layar ke bawah */
    z-index: 9999;     /* Sangat tinggi agar di atas segalanya */
    background-color: white;
    overflow-y: auto;  /* Bisa di-scroll jika menu panjang */
    display: none;     /* Default sembunyi */
    border-top: 1px solid #f3f4f6;
}

/* Muncul saat tombol hamburger diklik (via JS) */
#mobile-menu.active {
    display: block !important;
    animation: slideInDown 0.3s ease-out;
}

/* Accordion Sub-menu Mobile */
.mobile-dropdown-content {
    display: none;     /* Gunakan display untuk kestabilan */
    background-color: #f9fafb;
}

/* Logic penampil sub-menu */
.mobile-dropdown-content:not(.hidden) {
    display: block !important;
}

/* Styling Teks Mobile */
#mobile-menu button, 
#mobile-menu a {
    color: #374151 !important;
    transition: all 0.2s ease;
}

#mobile-menu a:hover, 
#mobile-menu button:hover {
    color: #2563eb !important; 
    background-color: #f3f4f6;
}

.mobile-dropdown-content a {
    color: #4b5563 !important;
}

/* === 3. ANIMASI & TRANSISI (DIREVISI) === */
@keyframes slideInDown {
    from { transform: translateY(-10px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* Rotasi Ikon (Sesuai Logic JS) */
.rotate-180 {
    transform: rotate(180deg);
}

.rotate-45 {
    transform: rotate(45deg); /* Untuk ikon plus jadi silang */
}

.fa-chevron-down, .fa-plus {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* === 4. HERO & NEWS GALLERY (TIDAK BERUBAH) === */
.news-card-transition {
    transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-slide-in {
    animation: slideInUp 1s ease-out forwards;
}

/* Utility tambahan untuk JS */
body.menu-open {
    overflow: hidden; /* Mencegah layar belakang gerak saat menu buka */
}

.berita-content {
    text-indent: 3rem; /* Menjorok sekitar 5-6 spasi */
}

/* Trik agar setelah Enter 2x (paragraf baru) juga ikut menjorok */
.berita-content br + br {
    display: block;
    content: "";
    margin-top: 10px;
}