/* =============================================================================
   WPCode CSS SNIPPET — gaya kartu promo aktif vs kedaluwarsa (adev.co.id)
   Dibuat: 21 Okt 2026 | dipakai bersama snippet JS:
     WPCODE-promo-kedaluwarsa-PASTE.js  (JS menandai kartu, CSS ini mengatur tampilannya)

   Cara pakai: WPCode → Add Snippet → Code Type: CSS Snippet →
   Auto Insert: Site Wide Header (atau Frontend Conditional Logic: Page URL contains "/promo/").
   ============================================================================= */

/* ---------- KARTU PROMO YANG SUDAH BERAKHIR: direndam, tidak menarik perhatian ---------- */
.elementor-post.adev-promo-selesai {
  opacity: .55;
  filter: grayscale(.65);
  transition: opacity .2s ease, filter .2s ease;
}
.elementor-post.adev-promo-selesai:hover,
.elementor-post.adev-promo-selesai:focus-within {
  opacity: .8;
  filter: grayscale(.15);            /* saat disentuh: jelas tapi tetap terasa "lampau" */
}
/* jangan sampai kartu berakhir terasa seperti ajakan klik */
.elementor-post.adev-promo-selesai .elementor-post__title a {
  text-decoration: none;
}
.elementor-post.adev-promo-selesai .elementor-post__title {
  font-size: .95em;
}
/* matikan efek naik/bayangan khas kartu aktif (bila tema memakainya) */
.elementor-post.adev-promo-selesai .elementor-post__card {
  box-shadow: none !important;
  transform: none !important;
}

/* ---------- BADGE STATUS ---------- */
.adev-promo-badge {
  display: inline-block;
  margin: 0 0 .5rem;
  padding: .22em .6em;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.5;
  text-transform: uppercase;
}
/* aktif: hijau tua dengan teks putih (kontras aman) */
.elementor-post.adev-promo-aktif .adev-promo-badge {
  background: #0a6b3d;
  color: #ffffff;
}
/* sudah berakhir: abu tua dengan teks putih (kontras aman) */
.elementor-post.adev-promo-selesai .adev-promo-badge {
  background: #5a5f66;
  color: #ffffff;
}

/* ---------- KARTU AKTIF: sedikit dibuat lebih menonjol ---------- */
.elementor-post.adev-promo-aktif .elementor-post__card {
  border: 2px solid #f4cf34;         /* kuning brand Adev */
  border-radius: 10px;
}

/* ---------- AKSESIBILITAS & PERFORMANCE ---------- */
@media (prefers-reduced-motion: reduce) {
  .elementor-post.adev-promo-selesai { transition: none; }
}

/* ---------- CATATAN UNTUK OPSI "TANPA KODE" (kategori penanda) ----------
   Kalau Mba Iim memilih cara taksonomi (membuat kategori "promo-selesai" lalu
   memindahkan promo lama ke sana dan mengecualikannya dari widget Query),
   CSS cukup memakai kelas kategori yang sudah disediakan WordPress:

   .category-promo-selesai { opacity: .55; filter: grayscale(.65); }
   .category-promo-selesai .elementor-post__badge::after { content: " — Telah berakhir"; }

   (Kelas .category-promo-selesai otomatis muncul bila post berada di kategori dengan slug itu,
    jadi tidak perlu JS maupun PHP.)
   ------------------------------------------------------------------------ */

/* =============================================================================
   v1.8.7 — PERBAIKAN KONTRAS (audit color-contrast 24 Okt)
   1) Badge bawaan Elementor (.elementor-post__badge) memakai teks putih di atas
      kuning #F4CF34 -> kontras 1,6:1 (gagal). Diubah menjadi teks navy #052D64
      di atas kuning yang sama -> kontras 8,83:1 (lulus WCAG AA).
   2) Kartu promo selesai sebelumnya memakai opacity < 1 yang MENURUNKAN kontras
      seluruh teks di dalamnya (penyebab 33 elemen gagal). Opacity dihapus,
      diganti filter grayscale + border agar tetap terlihat "non-aktif" tanpa
      mengorbankan keterbacaan.
   ============================================================================= */
.elementor-posts-container .elementor-post__badge,
.elementor-post .elementor-post__badge {
	background-color: #F4CF34 !important;
	color: #052D64 !important;
	font-weight: 700 !important;
}

.elementor-post.adev-promo-selesai {
	opacity: 1 !important;
	filter: grayscale(100%) !important;
	border: 2px solid #B7BDC7 !important;
}
