/* Single-ad page title was rendering oversized on phones. Scoped to
   mobile only -- desktop sizing is untouched. */
@media (max-width: 767px) {
	article h1,
	.content-area h1,
	.single-ad-title,
	h1.entry-title {
		font-size: 21px !important;
		line-height: 1.35 !important;
	}
}

/* "Edit Post" button -- restyled as a clear, actionable green button
   (found and tagged by chapchap-ui-polish.js since its markup comes from
   the parent theme). */
.chapchap-edit-post-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	background: #28a745 !important;
	color: #fff !important;
	border-radius: 6px;
	padding: 8px 14px !important;
	font-weight: 600;
	text-decoration: none !important;
}
.chapchap-edit-post-btn:hover {
	background: #218838 !important;
	color: #fff !important;
}

/* Bottom nav bar -- built from scratch by chapchap-ui-polish.js
   (rebuildBottomNav()) instead of trying to CSS-fix whatever the parent
   theme rendered. Fixed to the bottom of the viewport, mobile only
   (desktop nav is untouched and looks fine as-is). */
#chapchap-bottom-nav-v2 {
	display: none;
}
@media (max-width: 767px) {
	#chapchap-bottom-nav-v2 {
		display: flex !important;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 99999;
		background: #232323;
		border-top: 3px solid #ffc107;
		padding-top: 6px;
		padding-bottom: env(safe-area-inset-bottom, 6px);
	}
	/* Content shouldn't sit hidden underneath the fixed bar. */
	body.chapchap-has-bnv2 {
		padding-bottom: 64px;
	}
}
.chapchap-bnv2-item {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-decoration: none !important;
	padding: 4px 2px 6px;
	color: #fff !important;
}
.chapchap-bnv2-icon {
	font-size: 18px;
	line-height: 1.2;
}
.chapchap-bnv2-label {
	font-size: 11px;
	line-height: 1.3;
	white-space: nowrap;
	margin-top: 2px;
}

/* Edit Ad page: hide the bottom nav entirely (body class added in
   chapchap-ui-polish.php via is_page_template()). */
body.chapchap-hide-bottom-nav #chapchap-bottom-nav-v2 {
	display: none !important;
}
body.chapchap-hide-bottom-nav.chapchap-has-bnv2 {
	padding-bottom: 0 !important;
}

/* ChapChap: hides the broken multi-currency selector row above the Ad
   Price field (a dropdown that renders visually mangled/overlapping on
   mobile) -- shown only when the theme's "Multi Currency" option
   (Theme Options -> Pricing) is turned on. This site only needs a
   single fixed currency (KSh), and there's already a separate, working
   "Currency" dropdown further down the form -- so this row is both
   broken AND redundant. Hiding it here is immediate; turning "Multi
   Currency" off in Theme Options is the fully clean fix (stops the
   broken markup from being generated at all), but isn't something a
   child theme file can safely do on your behalf. */
.price__tag {
	display: none !important;
}

/* "Make Featured" / "Main photo" badge -- shown on each uploaded photo
   on Submit Ad (the fixed image-slot grid) and Edit Ad (the Dropzone.js
   previews), so a seller can pick which image becomes the ad's
   thumbnail instead of it always defaulting to whichever was uploaded
   first. */
#mydropzone .classiera-image-preview,
.dz-preview {
	position: relative;
}
.chapchap-featured-badge {
	position: absolute;
	left: 4px;
	bottom: 4px;
	z-index: 999;
	pointer-events: auto;
	background: rgba(0, 0, 0, 0.7);
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 4px 8px;
	font-size: 11px;
	line-height: 1.3;
	cursor: pointer;
	white-space: nowrap;
	/* Hidden until the sibling img actually has a real src -- reacts
	   live to that attribute changing, no matter how the parent
	   theme's upload script sets it (direct attribute, jQuery .attr(),
	   etc). This is what makes the badge's visibility reliable instead
	   of depending on JavaScript catching the exact moment an image
	   appears. */
	display: none;
}
.classiera-image-preview img.my-image[src]:not([src=""]) ~ .chapchap-featured-badge,
.dz-preview.dz-image-preview .chapchap-featured-badge {
	display: inline-block;
}
.chapchap-featured-badge.is-featured {
	background: #ffc107;
	color: #232323;
	font-weight: 700;
}