/*
 Theme Name: GeneratePress Child
 Theme URI: https://generatepress.com
 Description: Child theme for GeneratePress
 Author: Ahmad Al Abid
 Author URI: https://eduasianews.com
 Template: generatepress
 Version: 1.0.0
*/

/* Import parent theme style */
@import url("../generatepress/style.css");

.site-content {
  all: unset;
  display: block; /* set ulang display default */
}

.mobile-search-toggle {
    display: none;
}

/* Custom Single Post Layout */

.single-article-wrapper {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 30px;
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 15px;
}
.article-main { display: flex; flex-direction: column; }
.article-title { font-size: 28px; font-weight: bold; margin-bottom: 10px; }
.article-meta { font-size: 14px; color: #666; margin-bottom: 15px; }
.article-share a { margin-right: 8px; text-decoration: none; font-size: 14px; }
.article-featured-image img { width: 100%; border-radius: 5px; }
.featured-caption { font-size: 12px; font-style: italic; margin-top: 5px; color: #555; }
.article-content { font-size: 16px; line-height: 1.8; margin-top: 20px; }

.sidebar-latest { display: flex; flex-direction: column; gap: 15px; }
.sidebar-latest h2 { font-size: 20px; font-weight: bold; margin-bottom: 10px; }
.latest-item { display: flex; align-items: center; gap: 10px; }
.latest-item h3 { font-size: 14px; margin: 0; }
.latest-item img { width: 60px; height: 60px; object-fit: cover; border-radius: 5px; }
.latest-date { font-size: 12px; color: #666; }
.ad-label { text-align: center; font-size: 12px; color: #666; margin-top: 20px; }
.ad-img { width: 100%; aspect-ratio: 1 / 1; background-size: cover; background-position: center; border-radius: 5px; }

@media screen and (max-width: 1024px) {
    .single-article-wrapper { grid-template-columns: 1fr; }
    .sidebar-latest { margin-top: 40px; }
}

/* Default desktop */
.article-title,
h1.elementor-heading-title {
    font-size: 28px !important;
    font-weight: bold !important;
    line-height: 1.3 !important;
    margin-bottom: 15px !important;
}

.hero-item .hero-caption a {
    color: #fff !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
    font-size: 28px;
    font-weight: 700;
}

.hero-item .hero-caption a:hover {
    text-decoration: underline !important;
}

/* Tablet */
@media screen and (max-width: 1024px) {
    .article-title,
    h1.elementor-heading-title {
        font-size: 24px !important;
    }
}

/* Mobile */
@media screen and (max-width: 768px) {
    .article-title,
    h1.elementor-heading-title {
        font-size: 20px !important;
        margin: 0 15px !important;
    }
}

/* Extra small (HP kecil) */
@media screen and (max-width: 480px) {
    .article-title,
    h1.elementor-heading-title {
        font-size: 18px !important;
        line-height: 1.4 !important;
    }
}

.single-meta {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.single-meta .meta-left {
  font-size: 14px !important;
  color: #555 !important;
}

.single-meta .meta-share {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.single-meta .share-label {
  font-weight: bold !important;
  margin-right: 6px !important;
}

.single-meta .share-icons {
  display: flex !important;
  gap: 8px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-meta .share-icons li a {
  font-size: 16px !important;
  color: #333 !important;
  text-decoration: none !important;
}

.single-meta .share-icons li a:hover {
  color: #0073e6 !important;
}

/* Mobile */
@media screen and (max-width: 768px) {
  .single-meta {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
    margin: 0 15px !important; /* tambah margin kiri-kanan */
  }

  .single-meta .meta-share {
    flex-direction: row !important; 
    align-items: center !important; 
    gap: 6px !important;
    width: 100% !important;
    flex-wrap: wrap !important;
  }

  .single-meta .share-icons {
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  .single-meta .share-icons li a {
    font-size: 20px !important;
  }
}

/* Drop cap hanya paragraf pertama yang mengandung teks */
.elementor-widget-theme-post-content p:not(:empty):first-of-type::first-letter {
  font-size: 3em;
  font-weight: bold;
  float: left;
  line-height: 1;
  margin-right: 0.1em;
  margin-top: 0.05em;
}

/* Margin horizontal 15px saat mobile */
@media screen and (max-width: 768px) {
  .elementor-widget-theme-post-content {
    margin: 0 15px !important;
  }
}

.e-con-inner {
    margin: 0 auto !important;           /* Center the container */
    padding: 10px 20px !important;       /* Same horizontal padding as top-menu */
    max-width: 1200px !important;        /* Optional: constrain width */
    box-sizing: border-box !important;   /* Include padding in width */
}

.news-headline,
.english-title {
    color: #262626 !important;
    font-weight: bold !important;
    transition: color 0.3s ease !important; /* smooth hover transition */
}

.news-headline :hover,
.english-title :hover {
    color: #0f7399 !important;
}

/* All links inside .elementor-kit-27 except links that are descendants of .hero-caption */
.elementor-kit-27 a {
    color: #262626 !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

/* Exclude links inside .hero-caption */
.elementor-kit-27 .hero-caption a {
    color: inherit !important; /* or whatever default you want */
}

/* Hover for general links */
.elementor-kit-27 a:hover {
    color: #0f7399 !important; /* hover color */
}

/* Keep hover for hero-caption links separately if needed */
.elementor-kit-27 .hero-caption a:hover {
    color: inherit !important; /* prevent hover change */
}

.hero-item .hero-caption {
    color: #fff !important;
}

.hero-item .hero-caption a {
    color: #fff !important;
    text-decoration: none !important; /* optional: remove underline */
    transition: color 0.3s ease !important;
}

.hero-item .hero-caption a:hover {
    color: #fff !important; /* keep hover white */
}

@media (max-width: 767px) {
    .elementor-element-2ba7513 {
        display: none;
    }
}

@media (max-width: 767px) {
    .elementor-element-ce8c418 {
        background-color: #000; /* black background */
        padding: 10px 0;
    }

    /* Optional: ganti warna teks menu agar kontras */
    .elementor-element-ce8c418 .elementor-nav-menu a {
        color: #fff;
    }
}
.mobile-header-search {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 10px !important;
        padding: 5px !important;
    }

@media (max-width: 767px) {
    /* Keep mobile header icons intact */
    .mobile-header-search,
    .elementor-menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 10px !important;
        padding: 5px !important;
    }

    .mobile-header-search a svg,
    .elementor-menu-toggle svg {
        width: 24px !important;
        height: 24px !important;
        fill: #fff !important;
    }

    /* Search form popup */
    #mobile-search-form {
        position: fixed !important;
        top: 28% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        margin: 0 !important;
        padding: 10px !important;
        /*background: rgba(0, 0, 0, 0.5) !important;*/
        border-radius: 0 !important;
        z-index: 9999 !important;
        box-sizing: border-box;
    }

    /* Form container */
    #mobile-search-form form {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    /* Search input */
    #mobile-search-form input[type="search"] {
        width: 100%;
        padding: 10px;
        background: rgba(255, 255, 255, 0.9) !important; /* slightly transparent input */
        color: #000 !important;
        font-size: 16px;
        box-sizing: border-box;
        border: none;
        border-radius: 4px;
    }
    
    .elementor-99 .elementor-element.elementor-element-57a1d79 .elementor-divider-separator {
        margin: 0 !important;
    }

    .e-con.e-flex>.e-con-inner {
        padding: 0 !important;
    }
}

/* Full width ads slider container */
.slide-advert-container {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  margin-bottom: 10px !important;
}

/* Slide figure */
.slide-advert-container .ads-slide {
  margin: 0;
  padding: 0;
  width: 100%;
}

/* Gambar dalam slide */
.slide-advert-container .ads-slide-img {
  display: block;
  width: 100% !important;
  height: auto !important;
  object-fit: cover;
}

.menu-items a,
.menu-items a:hover,
.menu-items a:visited {
  color: #fff !important;
}

/* Desktop hitam */
@media (min-width: 1025px) {
  #header-search-toggle {
    color: #000;
  }
}

.e-con.e-flex>.e-con-inner {
    padding: 0px !important;
}

.elementor-element-08c4734 h1.elementor-heading-title {
  font-weight: bold !important;
  margin-top: 30px !important;
}

@media (max-width: 767px) {
  div.elementor-element.elementor-element-ce8c418.e-con {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}

@media (max-width: 768px) {
  .share-icons a.facebook i {
    color: #1877f2 !important; /* Facebook blue */
  }
  .share-icons a.x i {
    color: #000000 !important; /* X (Twitter) black */
  }
  .share-icons a.whatsapp i {
    color: #25D366 !important; /* WhatsApp green */
  }
  .share-icons a.mail i {
    color: #D44638 !important; /* Gmail red */
  }
  .share-icons a.telegram i {
    color: #0088cc !important; /* Telegram blue */
  }
  
  .elementor-45 .elementor-element.elementor-element-08c4734 .elementor-heading-title {
    font-family: "Lato", Sans-serif;
    font-size: 2em !important;
    font-weight: 700 !important;
    text-transform: none;
    font-style: normal;
    text-decoration: none;
    line-height: 1.1em !important;
  }
}
