/* Theme: SpectrumAbroStyle (Clean 3D Edition)
   Fokus: High Contrast, Readability, & Elegant 3D 
*/

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');

:root {
    --spectrum-blue: #0d145a;      /* Biru dipergelap untuk kontras */
    --spectrum-green: #00332c;     
    --spectrum-purple: #310d5e;    
    --spectrum-gold: #FFD700;      
    --spectrum-gradient: linear-gradient(135deg, #1a237e 0%, #4a148c 50%, #004d40 100%);
}

body.theme-SpectrumAbroStyle {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* --- NAVBAR & HEADER --- */
body.theme-SpectrumAbroStyle .navbar {
    background: var(--spectrum-gradient) !important;
    border-bottom: 3px solid var(--spectrum-gold);
    padding: 10px 0 !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4);
}

/* --- LOGO & BRANDING (2 BARIS) --- */
body.theme-SpectrumAbroStyle .navbar-brand {
    display: flex !important;
    align-items: center !important;
    gap: 12px;
    font-size: 0 !important; /* Hilangkan teks asli PHP agar tidak double */
    padding: 0;
    text-decoration: none;
}

/* Membungkus teks agar SMP IT dan BOJONGSAWAH tetap menyatu secara vertikal */
body.theme-SpectrumAbroStyle .navbar-brand::before {
    content: "SMP IT";
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    color: #FFFFFF !important;
    line-height: 1.1;
    letter-spacing: 1px;
    text-shadow: 2px 2px 0px rgba(0,0,0,0.8);
}

body.theme-SpectrumAbroStyle .navbar-brand::after {
    content: "BOJONGSAWAH";
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: var(--spectrum-gold) !important;
    line-height: 1.1;
    letter-spacing: 0.5px;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.8);
}

/* Agar logo dan teks berdampingan (Logo kiri, Teks kanan bertumpuk) */
@media (min-width: 0px) {
    body.theme-SpectrumAbroStyle .navbar-brand {
        display: grid !important;
        grid-template-columns: auto 1fr; /* Kolom 1: Logo, Kolom 2: Teks */
        align-items: center;
    }
    
    body.theme-SpectrumAbroStyle .navbar-brand img {
        grid-row: span 2; /* Logo memakan 2 baris tinggi teks */
        height: 55px !important;
        margin-right: 5px;
    }

    body.theme-SpectrumAbroStyle .navbar-brand::before {
        grid-column: 2;
        grid-row: 1;
    }

    body.theme-SpectrumAbroStyle .navbar-brand::after {
        grid-column: 2;
        grid-row: 2;
    }
}

/* --- MENU NAVIGASI 3D --- */
body.theme-SpectrumAbroStyle .nav-link {
    color: #FFFFFF !important;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    padding: 8px 16px !important;
    margin: 0 4px;
    background: rgba(255, 255, 255, 0.1); /* Latar transparan agar terlihat seperti tombol */
    border-radius: 6px;
    border-bottom: 3px solid rgba(0,0,0,0.4); /* Efek 3D */
    transition: all 0.2s ease;
}

body.theme-SpectrumAbroStyle .nav-link:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: translateY(-2px);
    border-bottom: 5px solid rgba(0,0,0,0.5);
    color: var(--spectrum-gold) !important;
}

/* --- FOOTER SPEKTRUM --- */
body.theme-SpectrumAbroStyle footer {
    background: var(--spectrum-blue) !important; /* Warna solid lebih aman untuk baca teks */
    background-image: var(--spectrum-gradient) !important;
    border-top: 4px solid var(--spectrum-gold);
    color: #FFFFFF !important;
}

body.theme-SpectrumAbroStyle footer h5 {
    color: var(--spectrum-gold) !important;
    font-weight: 800;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

body.theme-SpectrumAbroStyle footer p, 
body.theme-SpectrumAbroStyle footer i {
    color: rgba(255,255,255,0.9) !important; /* Putih terang */
}

/* --- PERBAIKAN CARD BERITA --- */
body.theme-SpectrumAbroStyle .news-card {
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

body.theme-SpectrumAbroStyle .card-title {
    color: var(--spectrum-blue);
    font-weight: 700;
}