/* Your custom CSS here */

/* Hero section: "Sell and Buy near you" title in red */
#homepage .hero-wrap h1,
#homepage .hero-wrap h1.text-white,
#homepage .hero-wrap:not(.only-search-bar) h1,
#homepage .hero-wrap:not(.only-search-bar) h1.text-white {
	color: #d8201d !important;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8), 0 0 10px rgba(255, 255, 255, 0.5) !important;
}

/* Hero section: Search bar container (blue to site yellow) */
#homepage .hero-wrap #searchForm .bg-primary,
#homepage .hero-wrap .bg-primary,
#homepage .only-search-bar .bg-primary {
	background-color: #ffc107 !important;
}

/* Hero section: Search bar Find button */
#homepage .hero-wrap #searchForm button.btn-primary,
#homepage .hero-wrap .btn-primary,
#homepage .only-search-bar .btn-primary {
	background-color: #ffc107 !important;
	border-color: #e0a800 !important;
	color: #000 !important;
	font-weight: 700 !important;
}

#homepage .hero-wrap #searchForm button.btn-primary:hover,
#homepage .hero-wrap .btn-primary:hover,
#homepage .only-search-bar .btn-primary:hover {
	background-color: #e0a800 !important;
	border-color: #d39e00 !important;
	color: #000 !important;
}

/* Footer: change white texts, headings, and links to blue */
footer,
footer .container-fluid,
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
footer .menu-type-title,
footer a.menu-type-link,
footer a.link-light,
footer a.link-body-emphasis,
footer a.link-primary,
footer a:not(.social-media a):not([class*="app-"]):not([class*="btn-"]),
footer .text-light,
footer .text-white,
footer .text-opacity-75,
footer .small,
footer .small div,
footer p,
footer li {
	color: #0d6efd !important;
	--bs-link-color-rgb: 13, 110, 253 !important;
	--bs-light-rgb: 13, 110, 253 !important;
}

footer a:not(.social-media a):hover,
footer a.link-light:hover,
footer a.menu-type-link:hover,
footer a.link-body-emphasis:hover {
	color: #0a58ca !important;
	text-decoration: underline !important;
}

/* Home page & listings widget: "View more" button to yellow */
#homepage .card-body a.btn-primary,
.card-body a.btn.btn-primary:has(.bi-box-arrow-in-right),
a.btn-view-more-yellow,
.btn-view-more-yellow {
	background-color: #ffc107 !important;
	border-color: #e0a800 !important;
	color: #000 !important;
	font-weight: 700 !important;
}

#homepage .card-body a.btn-primary:hover,
.card-body a.btn.btn-primary:has(.bi-box-arrow-in-right):hover,
a.btn-view-more-yellow:hover,
.btn-view-more-yellow:hover {
	background-color: #e0a800 !important;
	border-color: #d39e00 !important;
	color: #000 !important;
}

/* Quick login modal: login button to yellow */
#quickLogin .modal-footer button[type="submit"],
#quickLogin .modal-footer .btn-primary {
	background-color: #ffc107 !important;
	border-color: #e0a800 !important;
	color: #000 !important;
	font-weight: 700 !important;
}

#quickLogin .modal-footer button[type="submit"]:hover,
#quickLogin .modal-footer .btn-primary:hover {
	background-color: #e0a800 !important;
	border-color: #d39e00 !important;
	color: #000 !important;
}

/* === Listing Details: Additional Details List View (Wow Factor) === */
.ka-details-wrap {
	margin-top: 1.75rem;
	margin-bottom: 1.5rem;
}
.ka-details-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 1rem;
	padding-bottom: 0.6rem;
	border-bottom: 2px solid rgba(0, 0, 0, 0.06);
}
.ka-details-header-title {
	font-size: 1.15rem;
	font-weight: 800;
	color: #0f172a;
	margin: 0;
	display: flex;
	align-items: center;
	gap: 10px;
	letter-spacing: -0.01em;
}
.ka-details-icon-badge {
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
	color: #000;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	box-shadow: 0 2px 6px rgba(255, 193, 7, 0.35);
	flex-shrink: 0;
}
.ka-details-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.ka-detail-item {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-left: 4px solid #ffc107;
	border-radius: 10px;
	padding: 12px 16px;
	transition: all 0.22s ease-in-out;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}
.ka-detail-item:hover {
	border-color: #cbd5e1;
	border-left-color: #0d6efd;
	box-shadow: 0 6px 16px rgba(13, 110, 253, 0.08);
	transform: translateY(-1px);
}
.ka-detail-title {
	font-size: 0.74rem;
	font-weight: 800;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: #64748b;
	margin-bottom: 4px;
	display: flex;
	align-items: center;
	gap: 6px;
}
.ka-detail-title-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #ffc107;
	display: inline-block;
	flex-shrink: 0;
}
.ka-detail-item:hover .ka-detail-title-dot {
	background-color: #0d6efd;
}
.ka-detail-value {
	font-size: 0.95rem;
	font-weight: 500;
	color: #1e293b;
	line-height: 1.6;
	word-break: break-word;
}
.ka-detail-url-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	border-radius: 20px;
	background: #f8fafc;
	border: 1px solid #cbd5e1;
	color: #0f172a;
	font-weight: 600;
	font-size: 0.88rem;
	text-decoration: none !important;
	transition: all 0.2s ease-in-out;
}
.ka-detail-url-btn:hover {
	background: #0d6efd;
	border-color: #0d6efd;
	color: #ffffff !important;
	box-shadow: 0 3px 8px rgba(13, 110, 253, 0.25);
}
.ka-detail-url-btn:hover i {
	color: #ffffff !important;
}
.ka-detail-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 4px;
}
.ka-detail-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px;
	border-radius: 16px;
	background: #eff6ff;
	border: 1px solid #bfdbfe;
	color: #1d4ed8;
	font-size: 0.85rem;
	font-weight: 600;
}

/* Hide ad post date/time across listing cards and ad details */
.item-card .fa-clock,
.item-card .fa-clock + span,
.item-card .fa-clock + time,
.item-card li:has(> .fa-clock),
.item-list li:has(> .fa-clock),
.card-body li:has(> .fa-clock),
.featured-list-slider li:has(> .fa-clock) {
	display: none !important;
}
