/*
Theme Name: Framework Internal
Template: Newspaper
*/


/*
Theme Name:     Newspaper Child theme
Theme URI: 		http://themeforest.net/user/tagDiv/portfolio
Description:    Child theme made by tagDiv
Author:         tagDiv
Author URI: 	http://themeforest.net/user/tagDiv/portfolio
Template:       Newspaper
Version:        9.0c
*/


/*  ----------------------------------------------------------------------------
    This file will load automatically when the child theme is active. You can use it
    for custom CSS.
*/

/* ==========================================================
   SINGLE PERANGKAT
   ==========================================================*/

/* Card utama vertical */
.perangkat-card {
    background: linear-gradient(135deg, #e3f2fd, #e8f0fe, #f0f9ff);
    padding: 40px;
    border-radius: 28px;
    box-shadow: 
        0 12px 25px rgba(0,0,0,0.08),
        0 6px 12px rgba(0,0,0,0.03);
    border: 1px solid rgba(59,130,246,0.15);
    transition: 0.3s ease-in-out;

    /* FIX: layout atas-bawah */
    display: block;
    text-align: center;
}

/* Foto besar Single */
.perangkat-photo img {
    width: 210px;
    height: 300px;
    border-radius: 20px;
    object-fit: cover;
    display: block;
    margin: 0 auto 20px;
    box-shadow: 
        0 8px 25px rgba(0,0,0,0.18),
        0 0 0 6px #ffffff,
        0 0 0 10px rgba(59,130,246,0.15);
}

/* Info text */
.perangkat-info {
    text-align: center;
    margin-bottom: 30px;
}

.perangkat-name {
    font-size: 34px;
    font-weight: 700;
    margin-bottom: -18px;
    color: #1f2937;
}

.perangkat-role {
    font-size: 18px;
    color: #4b5563;
    font-weight: 500;
    margin-bottom: 5px;
}

.perangkat-nip,
.perangkat-alamat {
    font-size: 16px;
    color: #6b7280;
    margin-bottom: 4px;
}

/* Konten */
.perangkat-content {
    margin-top: 30px;
    font-size: 17px;
    line-height: 1.75;
    color: #374151;
}


/* ==========================================================
   ARSIP PERANGKAT
   ==========================================================*/

.perangkat-archive-title {
    text-align: center;
    font-size: 36px;
    margin-bottom: 40px;
    font-weight: 700;
    color: #2b5235;
}

/* Grid */
.perangkat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 25px;
}

/* Link item */
.perangkat-item {
    text-decoration: none;
    color: inherit;
}

/* Card hijau soft (vertical) */
.perangkat-card {
    background: linear-gradient(135deg, #e7f8e9, #d8f2dc);
    border-radius: 16px;
    padding: 25px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    border: 1px solid #cfe9d2;
    transition: 0.3s;

    /* FIX: vertical */
    display: block;
    text-align: center;
}

.perangkat-card:hover {
    transform: translateY(-4px);
    background: linear-gradient(135deg, #dff6e3, #ccf0d4);
}

/* Foto bulat */
.perangkat-photo {
    margin-bottom: 15px;
}

.perangkat-img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #b8e5bd;
    margin: 0 auto;
}

/* Placeholder jika tidak ada foto */
.perangkat-placeholder {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #b8e5bd;
    color: #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:600;
    margin: 0 auto;
}

/* Text info */
.perangkat-info {
    text-align: center;
    margin-top: 10px;
}

.perangkat-name-archive {
    font-size: 20px;
    margin-bottom: -8px;
    color: #2c4030;
    font-weight: 700;
}

.perangkat-jabatan {
    font-size: 14px;
    color: #3e6945;
    opacity: 0.9;
    margin-bottom: 18px;
}


/* ==========================================================
   SINGLE FASILITAS
   ==========================================================*/
/* === CONTAINER === */
.fasilitas-container {
    max-width: 900px;
    margin: 40px auto;
    padding: 20px;
}

/* === CARD === */
.fasilitas-card {
    background: #ffffff;
    padding: 25px;
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(0,0,0,0.08);
}

/* === IMAGE === */
.fasilitas-image img {
    width: 100%;
    border-radius: 14px;
    margin-bottom: 25px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* === TITLE === */
.fasilitas-title {
    font-size: 34px;
    font-weight: 800;
    margin-bottom: 20px;
    text-align: center;
    color: #1b3c2a;
}

/* === CONTENT === */
.fasilitas-content {
    font-size: 18px;
    color: #344a3f;
    line-height: 1.75;
}

.fasilitas-content p {
    margin-bottom: 18px;
}
/* === SLIDER GALERI — FULL WIDTH === */
.fasilitas-gallery {
    width: 100%;
    margin-bottom: 35px;
}

/* setiap slide mengisi penuh */
.fasilitas-gallery .swiper-slide {
    width: 100% !important;
    height: 620px; /* tinggi bisa kamu sesuaikan */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* foto memenuhi area slide */
.fasilitas-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* kunci agar penuh */
    border-radius: 14px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* tombol */
.swiper-button-next,
.swiper-button-prev {
    color: #009692;
}

.swiper-pagination-bullet-active {
    background: #009692;
}
autoplay: {
    delay: 3000,   // 3 detik
    disableOnInteraction: false
},

/* ==== RELATED FASILITAS ==== */
.related-fasilitas-wrap {
    margin-top: 50px;
}

.related-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 25px;
    text-align: center;
    color: #1b3c2a;
}

.related-grid {
    display: grid;
    gap: 25px;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.related-item {
    text-decoration: none;
    background: #ffffff;
    border-radius: 14px;
    padding: 15px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
    transition: 0.25s;
    text-align: center;
}

.related-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
}

.related-img img {
    width: 100%;
    border-radius: 10px;
    margin-bottom: 12px;
}

.related-name {
    font-size: 18px;
    color: #1b3c2a;
    font-weight: 600;
}

/* ==========================================================
   SINGLE GALERI
   ==========================================================*/

/* === CONTAINER === */
.galeri-container {
    max-width: 900px;
    margin: 40px auto;
    padding: 20px;
}

/* === CARD === */
.galeri-card {
    background: #ffffff;
    padding: 25px;
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(0,0,0,0.08);
}

/* === IMAGE === */
.galeri-image img {
    width: 100%;
    border-radius: 14px;
    margin-bottom: 25px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* === TITLE === */
.galeri-title {
    font-size: 34px;
    font-weight: 800;
    margin-bottom: 20px;
    text-align: center;
    color: #1b3c2a;
}

/* === CONTENT === */
.galeri-content {
    font-size: 18px;
    color: #344a3f;
    line-height: 1.75;
}

.galeri-content p {
    margin-bottom: 18px;
}

/* === SLIDER GALERI — FULL WIDTH === */
.galeri-gallery {
    width: 100%;
    margin-bottom: 35px;
}

.galeri-gallery .swiper-slide {
    width: 100% !important;
    height: 620px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.galeri-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}

/* tombol */
.swiper-button-next,
.swiper-button-prev {
    color: #009692;
}

.swiper-pagination-bullet-active {
    background: #009692;
}

/* ==== RELATED GALERI ==== */
.related-galeri-wrap {
    margin-top: 50px;
}

.related-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 25px;
    text-align: center;
    color: #1b3c2a;
}

.related-grid {
    display: grid;
    gap: 25px;
    grid-template-columns: repeat(auto-fill, minmax(180px,1fr));
}

.related-item {
    text-decoration: none;
    background: #ffffff;
    border-radius: 14px;
    padding: 15px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
    transition: 0.25s;
    text-align: center;
}

.related-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.12);
}

.related-img img {
    width: 100%;
    border-radius: 10px;
    margin-bottom: 12px;
}

.related-name {
    font-size: 18px;
    color: #1b3c2a;
    font-weight: 600;
}
/*APBDesa single*/
.apbdesa-title {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 20px;
}

.apbdesa-meta {
    text-align: center;
    margin-bottom: 30px;
    color: #444;
}

.apbdesa-meta div {
    margin-bottom: 6px;
}

.apbdesa-content {
    line-height: 1.7;
    font-size: 16px;
}

/* ===============================
   APBDESA RELATED + THUMBNAIL
================================ */

.apbdesa-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 24px;
}

.apbdesa-related-card {
    background: #f7fbf8;
    border: 1px solid #d9eadf;
    border-radius: 14px;
    overflow: hidden;
    transition: 0.3s;
}

.apbdesa-related-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.apbdesa-related-thumb {
    width: 100%;
    height: 100%;
    background: #e6f3ea;
    overflow: hidden;
}

.apbdesa-related-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Placeholder */
.apbdesa-thumb-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #cfe9d2, #bfe0c6);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #2b5235;
    font-size: 18px;
}

.apbdesa-related-body {
    padding: 18px;
}

.apbdesa-related-body h3 {
    font-size: 16px;
    margin-bottom: 6px;
    color: #1f3d2b;
}

.apbdesa-related-year {
    font-size: 13px;
    color: #4f7a5f;
}


/*APBDesa Archive*/
/* ==========================================================
   ARCHIVE APBDESA
   ========================================================== */

.apbdesa-archive-title {
    text-align: center;
    font-size: 34px;
    font-weight: 700;
    margin-bottom: 45px;
    color: #2c4030;
}

/* GRID 3 KOLOM */
.apbdesa-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* RESPONSIVE */
@media (max-width: 1024px) {
    .apbdesa-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .apbdesa-grid {
        grid-template-columns: 1fr;
    }
}

/* LINK */
.apbdesa-item {
    text-decoration: none;
    color: inherit;
}

/* CARD */
.apbdesa-card {
    background: linear-gradient(135deg, #f7fbf8, #e6f2eb);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    border: 1px solid #d6e6db;
    transition: 0.35s ease;
    height: 100%;
}

.apbdesa-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 14px 35px rgba(0,0,0,0.12);
}

/* THUMBNAIL */
.apbdesa-thumb img {
    width: 100%;
    height: 455px;
    object-fit: cover;
    display: block;
}

/* CONTENT */
.apbdesa-info {
    padding: 0px 24px 26px;
    text-align: center;
}

/* TITLE */
.apbdesa-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    color: #2b5235;
}

/* META */
.apbdesa-meta {
    font-size: 14px;
    color: #3f5f4a;
    margin-bottom: 0px;
}

/* ===== ANIMASI MASUK CARD ===== */
@keyframes slideFadeLeft {
    from {
        opacity: 0;
        transform: translateX(-40px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* default */
.apbdesa-card {
    opacity: 0;
    animation: slideFadeLeft 1s ease forwards;
}

/* delay otomatis per item */
.apbdesa-card:nth-child(1) { animation-delay: 0.1s; }
.apbdesa-card:nth-child(2) { animation-delay: 0.20s; }
.apbdesa-card:nth-child(3) { animation-delay: 0.3s; }
.apbdesa-card:nth-child(4) { animation-delay: 0.4s; }
.apbdesa-card:nth-child(5) { animation-delay: 0.5s; }
.apbdesa-card:nth-child(6) { animation-delay: 0.6s; }

/* FORCE HIDE META INFO – Newspaper */
#tdi_7 .td-post-date {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}
/* Ganti icon Twitter jadi X */
.td-social-twitter i:before {
    content: "𝕏";
    font-family: inherit;
    font-size: 18px;
    font-weight: 700;
}
/* ===============================
   SINGLE LEMBAGA – GAYA DESA
=============================== */

/* BUNGKUSAN UTAMA */
.lembaga-wrap {
    max-width: 1000px;
    margin: 50px auto;
    padding: 0 15px;
    font-family: Arial, sans-serif;
}

/* Judul */
.lembaga-title {
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 30px;
    color: #2b5235;
}

/* Struktur row */
.lembaga-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    margin-bottom: 30px;
}

/* Logo/foto */
.lembaga-photo {
    flex: 0 0 160px;
    margin-right: 30px;
    margin-bottom: 15px;
    text-align: center;
}

.lembaga-photo img {
    width: 150px;
    height: auto;
    border-radius: 8px;
    border: 2px solid #e0e7cf;
}

/* Tabel detail */
.lembaga-details {
    flex: 1;
}

.lembaga-details table {
    width: 100%;
    border-collapse: collapse;
}

.lembaga-details th,
.lembaga-details td {
    padding: 8px 10px;
    font-size: 15px;
    line-height: 1.6;
}

.lembaga-details th {
    width: 30%;
    font-weight: 600;
    color: #2c3e2f;
}

.lembaga-details td {
    color: #4e5e51;
}

/* Garis bawah untuk baris terakhir */
.lembaga-details tr.b-bottom td,
.lembaga-details tr.b-bottom th {
    border-bottom: 1px solid #d4d7d2;
}

/* Konten profil */
.lembaga-content {
    margin-top: 35px;
    font-size: 16px;
    line-height: 1.7;
    color: #3c4a3a;
}

/* Responsive untuk mobile */
@media (max-width: 768px) {
    .lembaga-header {
        flex-direction: column;
    }
    .lembaga-photo {
        margin-right: 0;
        margin-bottom: 20px;
    }
}

/* =====================================
   ARCHIVE LEMBAGA DESA (TABLE STYLE)
===================================== */

.lembaga-archive-title {
    font-size: 26px;
    font-weight: 700;
    color: #009692;
    margin-bottom: 20px;
}

.lembaga-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.lembaga-table thead th {
    text-align: left;
    font-weight: 700;
    color: #666;
    padding: 12px 10px;
    border-bottom: 2px solid #ddd;
}

.lembaga-table tbody td {
    padding: 14px 10px;
    border-bottom: 1px solid #e5e5e5;
    vertical-align: middle;
    font-size: 14px;
}

.lembaga-nama a {
    font-weight: 700;
    color: #009692;
    text-decoration: none;
    text-transform: uppercase;
}

.lembaga-nama a:hover {
    text-decoration: underline;
}

.lembaga-singkatan {
    display: inline-block;
    margin-top: 6px;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
    background: #e6f1ff;
    color: #009692;
    border-radius: 3px;
}

.lembaga-alamat {
    color: #555;
    line-height: 1.5;
}

.lembaga-logo img {
    max-width: 55px;
    height: auto;
}

/* Responsive */
@media (max-width: 768px) {

    .lembaga-table thead {
        display: none;
    }

    .lembaga-table,
    .lembaga-table tbody,
    .lembaga-table tr,
    .lembaga-table td {
        display: block;
        width: 100%;
    }

    .lembaga-table tr {
        margin-bottom: 20px;
        border-bottom: 2px solid #eee;
        padding-bottom: 15px;
    }

    .lembaga-logo {
        text-align: left;
        margin-top: 10px;
    }
}

/* ==============================
   TABEL BPD DESA DIMORO
============================== */

.bpd-wrap {
    margin: 30px 0;
}

.bpd-title {
    font-size: 22px;
    font-weight: 700;
    color: #1e73be;
    margin-bottom: 15px;
}

.bpd-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.bpd-table th {
    background: #f5f7fa;
    color: #444;
    font-weight: 700;
    padding: 12px;
    border-bottom: 2px solid #e1e1e1;
    text-align: left;
}

.bpd-table td {
    padding: 12px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

.bpd-foto img {
    width: 170px;
    height: 190px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #ddd;
}

.bpd-nama {
    font-weight: 600;
    color: #222;
}

.bpd-jabatan {
    font-weight: 600;
    padding: 6px 10px;
    border-radius: 4px;
    display: inline-block;
    /*font-size: 13px;*/
}

/* Badge jabatan – versi soft */
.bpd-jabatan {
    padding: 4px 10px;
    border-radius: 6px;
    /*font-size: 13px;*/
    font-weight: 500;
    display: inline-block;
}

/* Ketua – merah soft */
.bpd-jabatan.ketua {
    background: #f6d6d2;
    color: #8c2e23;
}

/* Wakil Ketua – oranye soft */
.bpd-jabatan.wakil {
    background: #f9e4c8;
    color: #8a5a10;
}

/* Sekretaris – hijau soft */
.bpd-jabatan.sekretaris {
    background: #dff0e6;
    color: #1f6b45;
}

/* Anggota – biru soft */
.bpd-jabatan.anggota {
    background: #e3eef8;
    color: #1f4f7a;
}


/* Responsive */
@media (max-width: 768px) {

    .bpd-table thead {
        display: none;
    }

    .bpd-table,
    .bpd-table tbody,
    .bpd-table tr,
    .bpd-table td {
        display: block;
        width: 100%;
    }

    .bpd-table tr {
        margin-bottom: 20px;
        padding-bottom: 15px;
        border-bottom: 2px solid #eee;
    }

    .bpd-foto {
        margin-bottom: 10px;
    }
}
/* ==============================
   DESKTOP: BALIK KE TABLE-CELL
============================== */
@media (min-width: 769px) {

    .bpd-nama,
    .bpd-jabatan {
        display: table-cell;   /* FIX UTAMA */
        vertical-align: middle;
        text-align: left;
    }
}


/* ==============================
   MOBILE: NAMA & JABATAN CENTER
============================== */
@media (max-width: 768px) {

    .bpd-nama,
    .bpd-jabatan {
        text-align: center;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .bpd-jabatan {
        margin-top: 6px;
    }
}


