/* MDIX Wedding Sentosa — audit fixes */
/* Dimuat paling akhir di <head>, jadi menimpa style.css & color-variation.css */

/* ============================================================
   Kontras AA (WCAG 2.2) — warna emas tema (#F4C601) & teks abu
   terlalu terang. Emas dipakai sebagai AKSEN/latar; untuk TEKS
   di latar terang dipergelap, untuk TEKS di atas emas dibuat gelap.
   (lihat DECISIONS D-20)
   ============================================================ */

/* Teks emas di atas latar terang -> emas gelap (>=4.5:1 di putih/krem) */
#main_navigation ul > li > a:hover,
#main_navigation ul > li.active > a,
.section_title span b,
#important_people .row div .info-box span,
#love_story .details a.read_more,
#event_parties .single_event .read_more,
#blog .single_blog_post label a {
	color: #806400;
}

/* Teks putih di atas emas -> teks gelap (kontras tinggi, aksen emas tetap) */
#slider .time_counter li,
#groom_bride .info-box button,
#rsvp .rsvp_wrap button[type="submit"],
#blog .single_blog_post a.readmore,
#main_navigation ul li ul li a {
	color: #3a2d00;
}

/* State hover tombol (latar berubah putih) tetap terbaca */
#groom_bride .info-box button:hover,
#groom_bride .info-box button:focus,
#groom_bride .info-box button:active,
#rsvp .rsvp_wrap button[type="submit"]:hover,
#rsvp .rsvp_wrap button[type="submit"]:focus,
#rsvp .rsvp_wrap button[type="submit"]:active,
#blog .single_blog_post a.readmore:hover,
#blog .single_blog_post a.readmore:focus,
#blog .single_blog_post a.readmore:active,
#main_navigation ul li ul li a:hover {
	color: #806400;
}

/* Teks abu terlalu terang -> abu gelap yang lolos AA */
.section-text,
#groom_bride .info-box span,
#groom_bride .info-box p,
#important_people .row div .info-box p,
#love_story p,
#event_parties .single_event p,
#blog .single_blog_post p {
	color: #5e5e5e;
}

/* ============================================================
   Ikon sosial mempelai: area ketuk <a> hanya 35x18px (<24px).
   Jadikan inline-block sehingga membungkus ikon (34px) -> lolos.
   ============================================================ */
#groom_bride .info-box ul li a {
	display: inline-block;
	vertical-align: middle;
}

/* ============================================================
   Galeri: tinggi thumbnail dipatok 295px -> foto 399x294 gepeng.
   object-fit:cover menjaga proporsi.
   ============================================================ */
#gallery ul li img {
	object-fit: cover;
	object-position: center;
}

/* ============================================================
   single-post.html: elemen emas/abu yang gagal AA
   ============================================================ */
/* Teks di atas emas -> gelap */
.single #author h2,
.single #author label,
.single #blog_content .comment_form .form_wrapper button[type="submit"] {
	color: #3a2d00;
}
/* Teks emas di latar terang -> emas gelap */
.single #blog_content .content_top label.post_meta a,
.single #blog_content .comment_section .single_comment .comment_details span.comment_time {
	color: #806400;
}
/* Abu terlalu terang -> lolos AA */
.single #blog_content .content_top p {
	color: #5e5e5e;
}
.single #blog_content .comment_section .single_comment .reply_button {
	color: #5e5e5e;
}
/* Hover tombol kirim (latar putih) tetap terbaca */
.single #blog_content .comment_form .form_wrapper button[type="submit"]:hover,
.single #blog_content .comment_form .form_wrapper button[type="submit"]:focus,
.single #blog_content .comment_form .form_wrapper button[type="submit"]:active {
	color: #806400;
}

/* ============================================================
   Menu HP (<=767px): panel bawaan memakai coral + teks putih
   (gagal kontras & tidak seragam dengan brand emas). Dibuat
   panel emas dengan teks gelap -> seragam & lolos kontras.
   ============================================================ */
@media only screen and (max-width: 767px) {
	#header button.nav-collapser { background: #806400; }
	#header button.nav-collapser .fa { color: #fff; }
	#main_navigation ul { background: #F4C601; }
	#main_navigation ul:before { color: #F4C601; }
	#main_navigation ul li a { color: #3a2d00; border-color: #3a2d00; }
	#main_navigation ul li:first-child a { border-top-color: #3a2d00; }
	#main_navigation ul li a:hover,
	#main_navigation ul li.active a { background: #fff; color: #806400; }
}

/* ============================================================
   Ronde 2 (2026-10-13)
   ============================================================ */

/* Teks putih di atas lapisan emas (kutipan, judul RSVP, banner blog)
   hanya ±1.6:1 -> teks cokelat gelap (>= 9:1), aksen emas tetap */
#qoute h2,
#rsvp h1,
.blog #header-featured .section_title span,
.blog #header-featured .section-text {
	color: #2b2100;
}
#qoute button {
	color: #2b2100;
	border-color: #2b2100;
}
.blog #header-featured .section-text {
	font-size: 15px;
	font-weight: 600;
}
/* Judul "Cerita Persiapan" tampil dua kali di blog.html (banner + seksi) */
.blog #blog .section_title_wrap {
	display: none;
}

/* Tombol kembali blog.html: lebar tetap 130px memotong teks; hover teks putih di emas */
.blog #blog a.older_post {
	display: table;
	width: auto;
	height: 44px;
	line-height: 42px;
	padding: 0 24px;
}
.blog #blog a.older_post:hover,
.blog #blog a.older_post:focus {
	color: #2b2100;
}

/* Tombol menu HP 45x35 -> 44x44 */
#header button.nav-collapser {
	width: 44px;
	height: 44px;
}
#header button.nav-collapser .fa {
	line-height: 44px;
}

/* Target sentuh >= 24px: tautan logo, galeri (anchor inline 18px),
   link penulis/tanggal blog, kontak di Lokasi */
#logo a,
#gallery ul li a {
	display: block;
}
#logo a {
	display: inline-block;
}
#blog .single_blog_post label a,
.single #blog_content .content_top label.post_meta a,
#our_location .single_location p a {
	display: inline-block;
	padding: 2px 0;
	min-height: 24px;
}
#our_location .single_location p a {
	color: #262626;
}
#our_location .single_location p a:hover,
#our_location .single_location p a:focus {
	color: #806400;
}

/* Timeline: "Selengkapnya" & "Muat Lainnya" tidak punya tujuan
   (tidak ada halaman cerita/item tambahan) -> disembunyikan, isi kartu sudah lengkap */
#love_story .details a.read_more,
#love_story button.load_more {
	display: none;
}
#love_story .details .details_content {
	padding-bottom: 14px;
}

/* HP: urutan timeline seragam (tanggal lalu kartu) & panah selalu di atas kartu */
@media only screen and (max-width: 767px) {
	#love_story ul li {
		display: flex;
		flex-direction: column;
	}
	#love_story ul li > div.date {
		order: -1;
	}
	#love_story ul li > div.details:first-child {
		margin-top: 30px;
		margin-bottom: 0;
		position: relative;
	}
	#love_story ul li > div.details:first-child:after {
		bottom: auto;
		top: -20px;
		left: 45%;
		transform: rotate(-270deg);
	}
}

/* HP: judul hero 60px -> 5 baris di 390px */
@media only screen and (max-width: 575px) {
	#slider h1 {
		font-size: 38px;
		line-height: 46px;
	}
	#slider .overlay {
		padding: 110px 0;
	}
}

/* Timeline tanpa tombol "Muat Lainnya": ruang bawah dikurangi */
#love_story {
	padding-bottom: 100px;
}

/* Lokasi: teks abu pucat -> abu gelap AA */
#our_location .single_location p {
	color: #5e5e5e;
}

/* HP: jarak antarseksi 125px+165px terlalu lapang; judul RSVP 2 baris rapat */
@media only screen and (max-width: 767px) {
	.section_title_wrap {
		padding: 70px 0 50px;
	}
	#groom_bride,
	#important_people,
	#event_parties,
	#blog,
	#love_story,
	.single #blog_content {
		padding-bottom: 80px;
	}
	.section-text br {
		display: none;
	}
	#rsvp h1 {
		font-size: 28px;
		line-height: 36px;
		margin-bottom: 36px;
	}
	#qoute .overlay {
		padding: 100px 0 90px;
	}
}

/* single-post: teks komentar abu pucat -> AA */
.single #blog_content .comment_section .single_comment .comment_details p {
	color: #5e5e5e;
}

/* Ikon sosial mempelai 35x32 -> 44x44 (sasaran D-11), hover emas gelap */
#groom_bride .info-box ul li a .fa {
	width: 44px;
	height: 44px;
	line-height: 34px;
}
#groom_bride .info-box ul li a:hover .fa,
#groom_bride .info-box ul li a:focus .fa {
	color: #806400;
}