/*
Theme Name: RanahJabar
Theme URI: https://example.com/ranahjabar
Author: Your Name / Esh by ISW
Author URI: https://example.com/your-website
Description: Tema berita dinamis untuk WordPress, terinspirasi oleh Antaranews, Tribun, dan RakyatBekasi, dengan kustomisasi penuh dan fitur dark mode.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ranahjabar
Tags: blog, custom-background, custom-colors, custom-header, custom-menu, featured-images, flexible-header, full-width-template, news, one-column, photography, post-formats, responsive-layout, rtl-language-support, sticky-post, theme-options, translation-ready, two-columns

*/

/*--------------------------------------------------------------
# Variabel CSS Global (Dikembalikan ke pengaturan asli)
--------------------------------------------------------------*/
:root {
    --ranahjabar-primary-color: #E74C3C; /* Merah */
    --ranahjabar-secondary-color: #27AE60; /* Hijau */
    --ranahjabar-text-color: #333333; /* Hitam/Abu gelap */
    --ranahjabar-background-color: #ffffff; /* Putih */
    --ranahjabar-border-color: #eeeeee;
    --ranahjabar-light-grey: #f8f8f8;
    --ranahjabar-dark-grey: #555555;

    /* Variabel untuk Dark Mode */
    --ranahjabar-dark-mode-text: #ecf0f1; /* Putih keabu-abuan */
    --ranahjabar-dark-mode-background: #2c3e50; /* Biru gelap */
    --ranahjabar-dark-mode-card-background: #34495e; /* Biru gelap sedikit terang */
    --ranahjabar-dark-mode-border: #4a667e;
}

/*--------------------------------------------------------------
# Dark Mode Styling
--------------------------------------------------------------*/
body.dark-mode {
    background-color: var(--ranahjabar-dark-mode-background);
    color: var(--ranahjabar-dark-mode-text);
}

body.dark-mode a {
    color: var(--ranahjabar-secondary-color); /* Link tetap hijau atau disesuaikan */
}

body.dark-mode .site-header,
body.dark-mode .flash-news-ticker,
body.dark-mode .main-navigation,
body.dark-mode .hero-slider-section,
body.dark-mode .editor-choice-section,
body.dark-mode .homepage-grid-section,
body.dark-mode .more-news-section,
body.dark-mode .above-footer-section,
body.dark-mode .site-footer,
body.dark-mode .post-card,
body.dark-mode .menu-toggle,
body.dark-mode .search-icon {
    background-color: var(--ranahjabar-dark-mode-card-background);
    border-color: var(--ranahjabar-dark-mode-border);
    color: var(--ranahjabar-dark-mode-text);
}

body.dark-mode .flash-news-ticker span,
body.dark-mode .flash-news-ticker a {
    color: var(--ranahjabar-dark-mode-text);
}

/* Styling untuk tombol dark mode */
.dark-mode-toggle {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.4em; /* Ukuran ikon, sedikit lebih kecil dari menu/search */
    padding: 0 5px;
    color: var(--ranahjabar-text-color);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin-left: 10px; /* Spasi dari elemen sebelumnya */
}

body.dark-mode .dark-mode-toggle {
    color: var(--ranahjabar-dark-mode-text);
}

/*--------------------------------------------------------------
# General Styling
--------------------------------------------------------------*/
html {
    box-sizing: border-box;
    scroll-behavior: smooth;
}

*, *::before, *::after {
    box-sizing: inherit;
}

body {
    margin: 0;
    font-family: 'Inter', sans-serif; /* Menggunakan Inter sesuai instruksi */
    line-height: 1.6; /* Line-height dasar untuk seluruh situs */
    color: var(--ranahjabar-text-color);
    background-color: var(--ranahjabar-background-color);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 16px; /* Ukuran font dasar untuk seluruh situs (1em = 16px) */
}

a {
    color: var(--ranahjabar-primary-color);
    text-decoration: none;
}

a:hover,
a:focus {
    color: var(--ranahjabar-secondary-color);
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    max-width: 480px; /* Lebar target utama untuk tampilan mirip m.antaranews.com */
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* Clearfix */
.clearfix::before,
.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.top-bar {
    background-color: var(--ranahjabar-dark-grey);
    color: #fff;
    font-size: 0.85em; /* 13.6px - Ukuran font untuk top bar */
    padding: 6px 0; /* Padding vertikal saja, horizontal akan diatur oleh .container */
    align-items: center; /* Tetap di sini untuk vertikal alignment dari container */
    flex-wrap: nowrap; /* Mencegah pembungkusan pada top bar itu sendiri */
}

.top-bar .container {
    display: flex; /* Mengatur konten di dalamnya sebagai flex */
    justify-content: space-between; /* Memastikan ruang antara elemen jam dan sosial */
    align-items: center; /* Menyelaraskan item secara vertikal */
    width: 100%; /* Memastikan container mengambil lebar penuh dari top-bar */
}

.social-icons {
    display: flex; /* Mengatur ikon sosial dalam satu baris */
    align-items: center; /* Menyelaraskan ikon secara vertikal */
}

.social-icons a {
    color: #fff;
    margin-left: 10px;
    font-size: 1em; /* 13.6px, relatif terhadap .top-bar (0.85em dari body) */
}

.site-header {
    background-color: var(--ranahjabar-background-color);
    padding: 10px 0;
    border-bottom: 1px solid var(--ranahjabar-border-color);
    position: relative;
    height: 60px;
    z-index: 1000;
    display: block;
}

.site-header .container {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* Mengatur elemen ke kiri */
    height: 100%;
}

/* Sticky Header */
.site-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.site-branding {
    /* flex-grow: 1; */ /* Dihapus agar logo tidak mengambil semua ruang dan tetap di kiri */
    text-align: left; /* Pusatkan logo */
    order: 2; /* Tetap order 2 agar di sebelah kanan menu toggle */
    margin-left: 10px; /* Tambahkan sedikit jarak dari menu toggle */
    transform: translateY(5px); /* Menurunkan logo sedikit, sesuai permintaan sebelumnya */
}

.site-branding .custom-logo-link {
    display: inline-block;
    height: 40px;
    line-height: 40px;
}

.site-branding .custom-logo {
    max-height: 40px;
    width: auto;
}

.site-title {
    margin: 0;
    font-size: 1.6em; /* 25.6px */
}

.site-title a {
    color: var(--ranahjabar-text-color);
}

.menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.6em; /* 25.6px */
    padding: 0 5px;
    color: var(--ranahjabar-text-color);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    order: 1; /* Pindah ke kiri */
}

.search-icon {
    order: 3; /* Pindah ke kanan */
    margin-left: auto; /* Mendorong ikon pencarian ke paling kanan */
    font-size: 1.6em; /* 25.6px */
}

/* Flash News Ticker (Dikembalikan ke pengaturan asli) */
.flash-news-ticker {
    background-color: var(--ranahjabar-primary-color);
    color: #fff;
    padding: 8px 0;
    font-size: 0.95em; /* 15.2px */
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    z-index: 999;
}

.flash-news-ticker span { /* Ini adalah label "FLASHNEWS" */
    font-weight: bold;
    margin-right: 10px;
    padding-left: 5px;
}

.flash-news-ticker .marquee {
    display: inline-block;
    animation: marquee 30s linear infinite; /* DURASI ANIMASI DIKEMBALIKAN KE 15 DETIK */
}

.flash-news-ticker .marquee a {
    color: #fff;
    margin-right: 20px;
}

@keyframes marquee {
    0% { transform: translateX(100%); } /* Teks mulai dari luar layar kanan (perilaku asli) */
    100% { transform: translateX(-100%); } /* Bergeser ke kiri hingga keluar layar kiri */
}

/* Main Navigation */
.main-navigation {
    background-color: #000000; /* Latar belakang hitam */
    border-bottom: 1px solid var(--ranahjabar-primary-color); /* Border bawah merah */
    z-index: 998;
}

.main-navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
}

.main-navigation li {
    flex-shrink: 0; /* Prevent items from shrinking */
    position: relative;
}

.main-navigation a {
    display: block;
    padding: 10px 12px;
    color: var(--ranahjabar-dark-mode-text); /* Warna teks terang untuk kontras */
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.95em; /* 15.2px - Konsisten dengan flash news */
    white-space: nowrap; /* Ensure text does not wrap within menu item */
}

.main-navigation a:hover,
.main-navigation a:focus {
    background-color: rgba(255, 255, 255, 0.1); /* Efek hover yang lebih lembut */
    text-decoration: none;
}

/* Sub-menu (Mobile - will be hidden by JS mobile menu) */
.main-navigation ul ul {
    display: none;
    position: absolute;
    background-color: #1a1a1a; /* Latar belakang sub-menu lebih gelap */
    border: 1px solid var(--ranahjabar-primary-color); /* Border sub-menu merah */
    min-width: 180px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    z-index: 10;
    flex-direction: column;
}

.main-navigation ul li:hover > ul {
    display: flex;
}

.main-navigation ul ul li {
    width: 100%;
}

.main-navigation ul ul a {
    padding: 10px 15px;
    font-weight: normal;
    text-transform: none;
    font-size: 0.95em; /* 15.2px - Konsisten dengan menu utama */
    color: var(--ranahjabar-dark-mode-text); /* Warna teks terang untuk sub-menu */
}

/* Mobile Menu Overlay */
.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
    z-index: 1001;
    display: none; /* Default hidden */
}

.mobile-menu-overlay.active {
    display: block; /* Menggunakan block untuk menampilkan overlay */
}

.mobile-menu-content {
    background-color: var(--ranahjabar-background-color);
    position: absolute; /* Menggunakan posisi absolut untuk penempatan di tengah */
    top: 50%; /* Pindah ke tengah vertikal */
    left: 50%; /* Pindah ke tengah horizontal */
    transform: translate(-50%, -50%); /* Menggeser kembali 50% dari lebar/tinggi sendiri */
    width: 90%; /* Mengatur lebar agar responsif */
    max-width: 300px; /* Batas lebar maksimum */
    height: auto; /* Tinggi disesuaikan dengan konten */
    max-height: 90%; /* Batas tinggi maksimum agar tidak melebihi layar */
    overflow-y: auto; /* Scroll jika konten melebihi tinggi */
    padding: 20px; /* Padding yang lebih umum untuk konten di tengah */
    border-radius: 8px; /* Menambahkan border-radius agar terlihat seperti modal */
    box-shadow: 0 5px 15px rgba(0,0,0,0.3); /* Menambahkan bayangan */
}

body.dark-mode .mobile-menu-content {
    background-color: var(--ranahjabar-dark-mode-card-background);
    color: var(--ranahjabar-dark-mode-text);
}

.mobile-menu-content ul {
    flex-direction: column;
    align-items: flex-start;
}

.mobile-menu-content li {
    width: 100%;
    border-bottom: 1px solid var(--ranahjabar-border-color);
}

.mobile-menu-content a {
    padding: 15px;
    font-size: 1em; /* 16px - Konsisten dengan body */
    width: 100%;
}

.mobile-menu-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    border: none;
    color: var(--ranahjabar-text-color);
    font-size: 2.2em; /* 35.2px */
    cursor: pointer;
    z-index: 1002;
}

body.dark-mode .mobile-menu-close {
    color: var(--ranahjabar-dark-mode-text);
}

/* Search Overlay */
.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.8);
    z-index: 1001;
    display: none;
    justify-content: center;
    align-items: center;
}

.search-overlay.active {
    display: flex;
}

.search-form-container {
    background-color: var(--ranahjabar-background);
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    position: relative;
    max-width: 90%;
    width: 500px;
}

body.dark-mode .search-form-container {
    background-color: var(--ranahjabar-dark-mode-card-background);
}

.search-form-container input[type="search"] {
    width: calc(100% - 60px);
    padding: 10px 15px;
    border: 1px solid var(--ranahjabar-border-color);
    border-radius: 5px;
    font-size: 1em; /* 16px - Konsisten dengan konten utama */
    background-color: var(--ranahjabar-background-color); /* Agar input terlihat di dark mode */
    color: var(--ranahjabar-text-color); /* Agar teks input terlihat di dark mode */
}

body.dark-mode .search-form-container input[type="search"] {
    background-color: var(--ranahjabar-dark-mode-background);
    color: var(--ranahjabar-dark-mode-text);
    border-color: var(--ranahjabar-dark-mode-border);
}

.search-form-container button {
    background-color: var(--ranahjabar-primary-color);
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1em; /* 16px - Konsisten dengan konten utama */
    margin-left: 10px;
}

.search-overlay-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: none;
    border: none;
    color: var(--ranahjabar-text-color);
    font-size: 2.2em; /* 35.2px */
    cursor: pointer;
}

body.dark-mode .search-overlay-close {
    color: var(--ranahjabar-dark-mode-text);
}

/*--------------------------------------------------------------
# Homepage Sections (General)
--------------------------------------------------------------*/
.section-title {
    font-size: 1em; /* 16px - Judul bagian homepage, disamakan */
    font-weight: normal; /* Normal agar sama dengan konten */
    color: var(--ranahjabar-primary-color);
    margin-bottom: 0px;
    text-align: center;
    padding-top: 0px;
    border-bottom: 1px solid var(--ranahjabar-primary-color); /* Garis bawah merah */
    padding-bottom: 5px; /* Padding bawah untuk garis */
}

.post-card {
    background-color: var(--ranahjabar-background-color);
    border: none; /* Hapus border */
    border-radius: 0; /* Hapus border-radius */
    overflow: hidden;
    margin-bottom: 10px; /* Spasi antar kartu */
    box-shadow: none; /* Hapus shadow */
    transition: none; /* Hapus transisi */
    display: flex; /* Gunakan flex untuk thumbnail di kiri */
    align-items: flex-start; /* Sejajarkan item ke atas */
    padding-bottom: 10px; /* Padding bawah untuk pemisah */
    border-bottom: 1px solid var(--ranahjabar-border-color); /* Pemisah antar post */
}

.post-card:hover {
    transform: none; /* Hapus efek hover */
    box-shadow: none; /* Hapus shadow hover */
    background-color: var(--ranahjabar-background-color); /* Pastikan background tetap */
}

body.dark-mode .post-card {
    background-color: var(--ranahjabar-dark-mode-background); /* Sesuaikan dengan background dark mode */
    border-color: var(--ranahjabar-dark-mode-border);
}

body.dark-mode .post-card:hover {
    background-color: var(--ranahjabar-dark-mode-background); /* Pastikan background hover dark mode tetap */
}

.post-card .post-thumbnail {
    width: 120px; /* Ukuran thumbnail lebih kecil */
    height: 80px; /* Ukuran thumbnail lebih kecil */
    overflow: hidden;
    position: relative;
    border-radius: 6px; /* Rounded corners untuk thumbnail */
    margin-right: 10px; /* Spasi antara thumbnail dan konten */
}

.post-card .post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-card .post-content {
    padding: 0; /* Hapus padding */
}

.post-card .post-title {
    font-size: 0.95em; /* Judul post lebih kecil */
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 3px;
    line-height: 1.2; /* Line-height lebih rapat */
}

.post-card .post-title a {
    color: var(--ranahjabar-text-color);
}

body.dark-mode .post-card .post-title a {
    color: var(--ranahjabar-dark-mode-text);
}

.post-card .post-excerpt {
    font-size: 0.85em; /* Cuplikan post lebih kecil */
    color: var(--ranahjabar-dark-grey);
    line-height: 1.4;
}

/*--------------------------------------------------------------
# Hero Sliders
--------------------------------------------------------------*/
.hero-slider-section {
    padding: 10px 0; /* Padding lebih besar */
    background-color: var(--ranahjabar-light-grey);
    text-align: center;
}

body.dark-mode .hero-slider-section {
    background-color: var(--ranahjabar-dark-mode-background);
}

.hero-slider-container {
    position: relative;
    max-width: 480px; /* Sesuaikan dengan lebar container */
    margin: 0 auto;
    overflow: hidden;
    border-radius: 12px;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

.hero-slide {
    display: none;
    position: relative;
}

.hero-slide.active {
    display: block;
}

.hero-slide img {
    width: 100%;
    height: 250px; /* Tinggi gambar slider ditingkatkan */
    object-fit: cover;
    border-radius: 12px;
}

.hero-slide-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
    color: #fff;
    padding: 10px; /* Padding lebih besar */
    text-align: left;
    border-radius: 0 0 12px 12px;
}

.hero-slide-content h3 {
    font-size: 1em; /* 16px - Konsisten dengan judul post-card */
    font-weight: normal;
    margin: 0;
    line-height: 1.3;
}

.hero-slide-content h3 a {
    color: #fff;
}

.slider-nav-arrows {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
    padding: 0 10px;
}

.slider-nav-arrows button {
    background-color: rgba(0,0,0,0.5);
    color: #fff;
    border: none;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 1.5em; /* 24px */
    border-radius: 50%;
    transition: background-color 0.2s ease-in-out;
}

.slider-nav-arrows button:hover {
    background-color: rgba(0,0,0,0.8);
}

.slider-nav-dots {
    text-align: center;
    margin-top: 5px;
}

.slider-nav-dots .dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #bbb;
    border-radius: 50%;
    margin: 0 4px;
    cursor: pointer;
    transition: background-color 0.2s ease-in-out;
}

.slider-nav-dots .dot.active {
    background-color: var(--ranahjabar-primary-color);
}

/*--------------------------------------------------------------
# Editor's Choice & More News (Row-based)
--------------------------------------------------------------*/
.editor-choice-section,
.more-news-section {
    padding: 10px 0; /* Padding lebih besar */
    background-color: var(--ranahjabar-background-color);
}

body.dark-mode .editor-choice-section,
body.dark-mode .more-news-section {
    background-color: var(--ranahjabar-dark-mode-background);
}

.editor-choice-item,
.more-news-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 10px; /* Spasi antar item */
    padding-bottom: 10px; /* Padding bawah untuk pemisah */
    border-bottom: 1px solid var(--ranahjabar-border-color); /* Pemisah antar item */
}

.editor-choice-item:last-child,
.more-news-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.editor-choice-item .thumbnail-wrapper,
.more-news-item .thumbnail-wrapper {
    flex-shrink: 0;
    width: 80px; /* Ukuran thumbnail lebih besar */
    height: 60px; /* Ukuran thumbnail lebih besar */
    overflow: hidden;
    border-radius: 6px;
    margin-right: 10px; /* Spasi antara thumbnail dan konten */
}

.editor-choice-item .thumbnail-wrapper img,
.more-news-item .thumbnail-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.editor-choice-item .content-wrapper {
    flex-grow: 1;
    padding-left: 0;
}

/* Untuk more-news-item, thumbnail di kanan */
.more-news-item .thumbnail-wrapper {
    order: 2;
    margin-left: 10px; /* Spasi antara konten dan thumbnail */
    margin-right: 0;
    padding-left: 0;
}

.more-news-item .content-wrapper {
    order: 1;
    padding-left: 0;
    padding-right: 0;
}

.editor-choice-item .post-title,
.more-news-item .post-title {
    font-size: 0.95em; /* Judul post lebih kecil */
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 1px;
    line-height: 1.2;
}

.editor-choice-item .post-title a,
.more-news-item .post-title a {
    color: var(--ranahjabar-text-color);
}

body.dark-mode .editor-choice-item .post-title a,
body.dark-mode .more-news-item .post-title a {
    color: var(--ranahjabar-dark-mode-text);
}

.editor-choice-item .post-excerpt,
.more-news-item .post-excerpt {
    font-size: 0.85em; /* Cuplikan post lebih kecil */
    color: var(--ranahjabar-dark-grey);
    line-height: 1.4;
}

/*--------------------------------------------------------------
# Homepage Grid (3 Rows + 2 Columns)
--------------------------------------------------------------*/
.homepage-grid-section {
    padding: 10px 0; /* Padding lebih besar */
    background-color: var(--ranahjabar-light-grey);
}

body.dark-mode .homepage-grid-section {
    background-color: var(--ranahjabar-dark-mode-background);
}

.homepage-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2 kolom untuk mobile */
    gap: 10px; /* Spasi antar grid item */
}

.homepage-grid .post-card {
    border-bottom: 1px solid var(--ranahjabar-border-color); /* Pemisah antar post */
    padding-bottom: 10px; /* Padding bawah */
    margin-bottom: 10px; /* Margin bawah */
    box-shadow: none; /* Hapus shadow */
    transform: none; /* Hapus transform */
    display: block; /* Kembali ke block untuk grid item */
}

.homepage-grid .post-card:hover {
    transform: none; /* Hapus efek hover */
    box-shadow: none; /* Hapus shadow hover */
}

.homepage-grid .post-card .post-thumbnail {
    width: 100%;
    height: 80px; /* Tinggi thumbnail lebih besar */
    margin-right: 0; /* Hapus margin kanan */
    border-radius: 6px; /* Rounded corners untuk thumbnail */
}

.homepage-grid .post-card .post-content {
    padding: 0; /* Hapus padding */
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.above-footer-section {
    padding: 10px 0; /* Padding lebih besar */
    background-color: var(--ranahjabar-dark-grey);
    text-align: center;
}

body.dark-mode .above-footer-section {
    background-color: var(--ranahjabar-dark-mode-background);
}

.above-footer-section .link-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.above-footer-section .link-list li {
    margin: 0 5px 5px 5px; /* Spasi antar link */
}

.above-footer-section .link-list a {
    color: #fff;
    font-size: 0.9em; /* 14.4px - Ukuran font untuk link footer atas */
    text-transform: uppercase;
    font-weight: bold;
}

.site-footer {
    padding: 10px 0; /* Padding lebih besar */
    background-color: #222;
    color: #bbb;
    text-align: center;
    font-size: 0.85em; /* 13.6px - Ukuran font untuk footer */
}

body.dark-mode .site-footer {
    background-color: #222;
    color: #bbb;
}

.site-footer a {
    color: #bbb;
}

/*--------------------------------------------------------------
# Single Post / Page / Archive / Search / 404 Styling
--------------------------------------------------------------*/
.page-title,
.entry-title {
    font-size: 1em; /* 16px - Judul utama halaman baca, SAMA dengan konten utama */
    font-weight: normal;
    margin-bottom: 8px;
    line-height: 1.2;
    text-align: left;
    color: var(--ranahjabar-text-color);
}

body.dark-mode .page-title,
body.dark-mode .entry-title {
    color: var(--ranahjabar-dark-mode-text);
}

.archive-description {
    font-size: 1em; /* 16px - Deskripsi arsip, disamakan dengan konten utama */
    color: var(--ranahjabar-dark-grey);
    margin-bottom: 15px;
    text-align: left;
}

.entry-meta {
    font-size: 1em; /* 16px - Meta info, disamakan */
    color: var(--ranahjabar-dark-grey);
    margin-bottom: 15px;
    text-align: left;
}

.post-thumbnail-single,
.post-thumbnail-page {
    margin-bottom: 15px;
    border-radius: 8px;
    overflow: hidden;
}

.entry-content,
.page-content { /* Terapkan juga ke .page-content untuk 404/no-results */
    font-size: 1em; /* 16px - Konten utama, disamakan dengan cuplikan di frontpage */
    line-height: 1.6;
    margin-bottom: 20px;
}

.entry-content p,
.page-content p {
    margin-bottom: 1em;
}

.entry-content ul,
.entry-content ol,
.page-content ul,
.page-content ol {
    margin-bottom: 1em;
    padding-left: 20px;
}

.entry-content li,
.page-content li {
    margin-bottom: 0.5em;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.page-content h1,
.page-content h2,
.page-content h3,
body.dark-mode .page-content h4,
body.dark-mode .page-content h5,
body.dark-mode .page-content h6 {
    color: var(--ranahjabar-dark-mode-text);
}

.entry-content img,
.page-content img {
    height: auto;
    max-width: 100%;
    margin: 1em auto;
    display: block;
    border-radius: 8px;
}

.entry-content blockquote,
.page-content blockquote {
    border-left: 4px solid var(--ranahjabar-primary-color);
    padding-left: 15px;
    margin: 1.5em 0;
    font-style: italic;
    color: var(--ranahjabar-dark-grey);
}

.entry-footer {
    font-size: 1em; /* 16px - Konsisten dengan konten utama */
    color: var(--ranahjabar-dark-grey);
    margin-top: 20px;
    border-top: 1px solid var(--ranahjabar-border-color);
    padding-top: 10px;
}

.page-links {
    font-size: 1em; /* 16px - Konsisten dengan konten utama */
    margin-top: 15px;
}

.post-navigation {
    margin-top: 20px;
    border-top: 1px solid var(--ranahjabar-border-color);
    padding-top: 15px;
    display: flex;
    justify-content: space-between;
    font-size: 1em; /* 16px - Mengatur base untuk navigasi post */
}

.post-navigation .nav-previous,
.post-navigation .nav-next {
    width: 48%;
}

.post-navigation .nav-subtitle {
    display: block;
    color: var(--ranahjabar-dark-grey);
    font-size: 1em; /* 16px - Relatif terhadap parent .post-navigation (16px) */
    font-weight: normal;
}

.post-navigation .nav-title {
    font-weight: normal;
    color: var(--ranahjabar-text-color);
    font-size: 1em; /* 16px - Relatif terhadap parent .post-navigation (16px) */
}

body.dark-mode .post-navigation .nav-title {
    color: var(--ranahjabar-dark-mode-text);
}

/* Search form on 404/No Results */
.search-no-results .search-form,
.error-404 .search-form {
    margin-top: 5px;
}

/* Widgets on 404 page */
.widget {
    font-size: 1em; /* 16px */
    margin-bottom: 3px;
}

.widget-title {
    font-size: 1em; /* 16px - Judul widget, disamakan */
    font-weight: normal;
    color: var(--ranahjabar-primary-color);
    margin-bottom: 10px;
    border-bottom: 1px solid var(--ranahjabar-primary-color); /* Garis bawah merah */
    padding-bottom: 5px; /* Padding bawah untuk garis */
}

.widget ul li {
    font-size: 1em; /* 16px - Item daftar di widget, disamakan */
    margin-bottom: 5px;
}

.widget ul li a {
    color: var(--ranahjabar-text-color);
}

body.dark-mode .widget ul li a {
    color: var(--ranahjabar-dark-mode-text);
}