/* ==========================================================================
   UgandanJobs design refresh
   Tokens: ink #0f172a · body #475569 · line #e2e8f0 · accent #e11d48
   ========================================================================== */

:root {
	--uj-ink: #0f172a;
	--uj-body: #475569;
	--uj-muted: #94a3b8;
	--uj-line: #e2e8f0;
	--uj-bg: #f8fafc;
	--uj-accent: #e11d48;
	--uj-accent-dark: #be123c;
	--uj-radius: 14px;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
body {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
	color: var(--uj-body);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.title, .widget-title {
	font-family: 'Inter', sans-serif !important;
	color: var(--uj-ink);
	font-weight: 700;
}

a { transition: color .15s ease; }
a:hover { color: var(--uj-accent); }

.text-theme { color: var(--uj-accent) !important; }
.text-second { color: var(--uj-muted) !important; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.btn {
	border-radius: 10px !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	transition: all .18s ease !important;
	box-shadow: none !important;
}

.btn-theme,
.btn.btn-theme,
button.search-submit {
	background: var(--uj-accent) !important;
	border-color: var(--uj-accent) !important;
	color: #fff !important;
}
.btn-theme:hover,
button.search-submit:hover {
	background: var(--uj-accent-dark) !important;
	border-color: var(--uj-accent-dark) !important;
	transform: translateY(-1px);
}

.btn-second,
.btn.btn-second {
	background: var(--uj-ink) !important;
	border-color: var(--uj-ink) !important;
	color: #fff !important;
}
.btn-second:hover {
	background: #1e293b !important;
	border-color: #1e293b !important;
}

/* --------------------------------------------------------------------------
   Header (desktop)
   -------------------------------------------------------------------------- */
#apus-header {
	position: sticky !important;
	top: 0;
	z-index: 1030;
	background: #fff !important;
	border-bottom: 1px solid var(--uj-line);
	box-shadow: 0 1px 12px rgba(15, 23, 42, .05);
}
#apus-header .header-middle { padding: 6px 0; }

/* Wordmark replaces the broken/white image logos everywhere */
.logo a img,
.header-mobile .logo img { display: none !important; }

.logo a {
	display: inline-flex !important;
	align-items: baseline;
	text-decoration: none !important;
}
.logo a::before {
	content: "Ugandan Jobs";
	font-family: 'Inter', sans-serif;
	font-size: 25px;
	font-weight: 800;
	letter-spacing: -0.5px;
	color: var(--uj-ink);
}
.logo a::after {
	content: "Net";
	margin-left: 7px;
	font-family: 'Inter', sans-serif;
	font-size: 25px;
	font-weight: 800;
	letter-spacing: -0.5px;
	color: var(--uj-accent);
}

/* Main menu */
#apus-header #primary-menu > li > a {
	color: #334155 !important;
	font-size: 15px;
	font-weight: 600;
	padding: 28px 16px;
	background: transparent !important;
}
#apus-header #primary-menu > li > a:hover,
#apus-header #primary-menu > li.active > a {
	color: var(--uj-accent) !important;
}
#apus-header #primary-menu > li.active > a {
	box-shadow: inset 0 -3px 0 var(--uj-accent);
}

#apus-header .submit-job .btn {
	background: var(--uj-accent) !important;
	border-color: var(--uj-accent) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 10px 22px;
	font-size: 14px;
}
#apus-header .submit-job .btn:hover {
	background: var(--uj-accent-dark) !important;
	transform: translateY(-1px);
}

/* Mobile header */
.header-mobile {
	background: #fff !important;
	border-bottom: 1px solid var(--uj-line);
}

/* --------------------------------------------------------------------------
   Hero search widget (homepage)
   -------------------------------------------------------------------------- */
.widget-search-form.half {
	background: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #312e40 100%) !important;
	border-radius: 20px;
	padding: 40px 40px 44px !important;
	box-shadow: 0 24px 60px -24px rgba(15, 23, 42, .45);
}
.widget-search-form.half .widget-title,
.widget-search-form.half .widget-title span {
	color: #fff !important;
	font-size: 30px;
	font-weight: 800;
	letter-spacing: -0.5px;
	background: transparent !important;
	text-transform: none !important;
}
.widget-search-form.half .widget-title::after {
	content: " Search thousands of opportunities across Uganda.";
	display: block;
	font-size: 15px;
	font-weight: 400;
	color: #cbd5e1;
	margin-top: 8px;
	letter-spacing: 0;
}

.job_search_form input[type="text"],
.job_search_form select,
.job_search_form .chosen-single,
.job_search_form .search-field {
	background: #fff !important;
	border: 1px solid transparent !important;
	border-radius: 10px !important;
	height: 52px !important;
	line-height: 52px;
	padding: 0 18px !important;
	font-size: 15px;
	color: var(--uj-ink) !important;
	box-shadow: none !important;
}
.job_search_form input:focus {
	border-color: var(--uj-accent) !important;
	outline: none;
}

.job_search_form .search-submit,
.job_search_form button[type="submit"] {
	position: static !important;
	width: auto !important;
	height: 52px !important;
	border-radius: 10px !important;
	padding: 0 36px !important;
	font-size: 15px !important;
	background: var(--uj-accent) !important;
	border: none !important;
}

/* Neutralise the theme's giant colored submit column */
.widget-search-form .search_jobs,
.widget-search-form .search_jobs_inner {
	background: transparent !important;
	box-shadow: none !important;
	border: none !important;
}

/* Homepage row backgrounds */
body .vc_custom_1547713153633 { background-color: #fff !important; }

/* --------------------------------------------------------------------------
   Section headings in page content
   -------------------------------------------------------------------------- */
.apus-main-content .widget-title,
.uj-sec-title {
	font-size: 26px !important;
	font-weight: 800 !important;
	letter-spacing: -0.5px;
	color: var(--uj-ink) !important;
	text-transform: none !important;
}
h2.uj-sec-title {
	margin: 0 0 6px;
}
h2.uj-sec-title + p.uj-sec-sub {
	color: var(--uj-muted);
	margin: 0 0 26px;
	font-size: 15px;
}

/* Jobs tab pills (if the tabs widget is used anywhere) */
.nav-tabs.tab-jobs {
	border: none !important;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.nav-tabs.tab-jobs > li > a {
	border: none !important;
	border-radius: 999px !important;
	background: #f1f5f9 !important;
	color: var(--uj-body) !important;
	font-weight: 600;
	padding: 9px 20px !important;
	text-transform: none !important;
}
.nav-tabs.tab-jobs > li.active > a,
.nav-tabs.tab-jobs > li > a:hover {
	background: var(--uj-ink) !important;
	color: #fff !important;
}

/* --------------------------------------------------------------------------
   Job cards
   -------------------------------------------------------------------------- */
.job-grid,
.job-list {
	border: 1px solid var(--uj-line) !important;
	border-radius: var(--uj-radius) !important;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
	overflow: hidden;
}
.job-grid:hover,
.job-list:hover {
	transform: translateY(-3px);
	border-color: transparent !important;
	box-shadow: 0 16px 40px -16px rgba(15, 23, 42, .18);
}

.job-grid .job-content-wrapper,
.job-list .job-content-wrapper {
	padding: 22px;
}

.company_logo {
	border-radius: 10px !important;
	border: 1px solid var(--uj-line);
	background: #fff;
	object-fit: contain;
}

.title-job-list,
.title-job-list a,
h3.title-job-list a {
	font-size: 16.5px !important;
	font-weight: 700 !important;
	color: var(--uj-ink) !important;
	line-height: 1.4;
}
.title-job-list a:hover { color: var(--uj-accent) !important; }

.job-grid .company a strong,
.job-list .company a strong {
	color: var(--uj-muted) !important;
	font-weight: 500 !important;
	font-size: 13.5px;
}

.job-metas {
	font-size: 13px;
	color: var(--uj-muted);
}
.job-metas .location { color: var(--uj-muted); }

/* Type pills (full time / part time etc.) */
.job-type,
.job-grid .type,
.label-job-type,
.full-time, .part-time, .freelance, .temporary, .internship {
	border-radius: 999px !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}

/* Listing grid breathing room */
.job_listings.row { margin-top: 8px; }
.list-item-job { margin-bottom: 24px; }

/* Load more */
.load_more_jobs,
a.load_more_jobs {
	display: inline-block;
	background: #fff !important;
	border: 1.5px solid var(--uj-ink) !important;
	color: var(--uj-ink) !important;
	border-radius: 999px !important;
	font-weight: 700 !important;
	text-transform: none !important;
	padding: 13px 36px !important;
	transition: all .18s ease;
}
.load_more_jobs:hover {
	background: var(--uj-ink) !important;
	color: #fff !important;
}

/* --------------------------------------------------------------------------
   Counters band (uses :has — degrades gracefully)
   -------------------------------------------------------------------------- */
.vc_row:has(.counters) {
	background: var(--uj-ink) !important;
	background-image: none !important;
}
.counters .counter-item .number,
.counters .counter-item [class*="count"] {
	color: #fff !important;
	font-weight: 800 !important;
}
.counters .counter-item {
	color: #94a3b8 !important;
}

/* --------------------------------------------------------------------------
   Breadcrumb / page title bar
   -------------------------------------------------------------------------- */
#apus-breadscrumb {
	background: var(--uj-bg) !important;
	background-image: none !important;
	border-bottom: 1px solid var(--uj-line);
	padding: 34px 0 !important;
}
#apus-breadscrumb h1, #apus-breadscrumb h2, #apus-breadscrumb h3,
#apus-breadscrumb .bread-title {
	color: var(--uj-ink) !important;
	font-weight: 800;
	letter-spacing: -0.5px;
}
#apus-breadscrumb .breadcrumb,
#apus-breadscrumb .breadcrumb a,
#apus-breadscrumb .breadcrumb li {
	color: var(--uj-muted) !important;
	background: transparent !important;
}
#apus-breadscrumb .breadcrumb a:hover { color: var(--uj-accent) !important; }

/* --------------------------------------------------------------------------
   Sidebar
   -------------------------------------------------------------------------- */
.sidebar .widget {
	background: #fff;
	border: 1px solid var(--uj-line);
	border-radius: var(--uj-radius);
	padding: 22px !important;
	box-shadow: none !important;
	margin-bottom: 24px;
}
.sidebar .widget .widget-title,
.sidebar .widget .widget-title span {
	background: transparent !important;
	color: var(--uj-ink) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	padding: 0 !important;
	text-transform: none !important;
}
.sidebar .widget .widget-title {
	border-bottom: 1px solid var(--uj-line);
	padding-bottom: 12px !important;
	margin: 0 0 14px !important;
}
.sidebar .widget a { color: var(--uj-body); }
.sidebar .widget a:hover { color: var(--uj-accent); }

/* Junk widgets: default WP meta/archives/comments and the noisy tag cloud */
.sidebar .widget_meta,
.sidebar .widget_archive,
.sidebar .widget_recent_comments,
.sidebar .widget_recent_entries,
.sidebar .widget_apus_job_taxonomy_widget:has(a[href*="job-tag"]),
.sidebar .widget_apus_job_taxonomy_widget:has(a[href*="job_tag"]) {
	display: none !important;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
#apus-footer {
	background: #0b1220 !important;
	background-image: none !important;
	color: #94a3b8;
}
#apus-footer .widget-title,
#apus-footer .widget-title span,
#apus-footer h1, #apus-footer h2, #apus-footer h3, #apus-footer h4 {
	color: #fff !important;
	background: transparent !important;
	text-transform: none !important;
}
#apus-footer a { color: #94a3b8; }
#apus-footer a:hover { color: #fff; }
#apus-footer .widget { background: transparent; border: none; padding: 0 !important; }

.apus-copyright,
#apus-copyright {
	background: #0b1220 !important;
	border-top: 1px solid #1e293b !important;
	color: #64748b !important;
}
.apus-copyright a { color: #94a3b8 !important; }

/* --------------------------------------------------------------------------
   Forms & misc polish
   -------------------------------------------------------------------------- */
select, .form-control {
	border-radius: 10px !important;
	border-color: var(--uj-line) !important;
}
input[type="submit"] { border-radius: 10px !important; }

.pagination > li > a,
.pagination > li > span {
	border-radius: 8px !important;
	margin: 0 3px;
	border-color: var(--uj-line) !important;
	color: var(--uj-ink);
}
.pagination > .active > a {
	background: var(--uj-ink) !important;
	border-color: var(--uj-ink) !important;
}

/* --------------------------------------------------------------------------
   v1.0.1 — hero widget layout fixes
   -------------------------------------------------------------------------- */
.widget-search-form.half .widget-title {
	position: static !important;
	float: none !important;
	width: auto !important;
	background: transparent !important;
	box-shadow: none !important;
	transform: none !important;
	padding: 0 0 22px !important;
	margin: 0 !important;
	text-align: left;
}
.widget-search-form.half .content {
	width: 100% !important;
	float: none !important;
	padding: 0 !important;
}
.widget-search-form .search_jobs,
.widget-search-form .search_jobs_inner,
.widget-search-form .search_jobs--frontpage,
.widget-search-form .table-visiable,
.widget-search-form .left-inner,
.widget-search-form .submit {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	position: static !important;
	padding: 0 !important;
	width: auto !important;
	height: auto !important;
	display: block;
}

/* Lay the fields out on a flexible grid */
.widget-search-form .table-visiable {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}
.widget-search-form .left-inner {
	display: flex !important;
	flex-wrap: wrap;
	gap: 12px;
	flex: 1 1 auto;
}
.widget-search-form .search-filter-wrapper,
.widget-search-form .wrapper-location {
	flex: 1 1 220px;
	min-width: 200px;
	margin: 0 !important;
	float: none !important;
	width: auto !important;
}
.job_search_form .chosen-container { width: 100% !important; }
.job_search_form .wrapper-location input { width: 100%; }

/* Clean search button: text only */
.job_search_form .search-submit .icon-search,
.job_search_form .search-submit img { display: none !important; }
.job_search_form .search-submit i.fa { margin-right: 8px; }
.job_search_form .search-submit {
	float: none !important;
	font-weight: 700 !important;
	flex: 0 0 auto;
}

/* --------------------------------------------------------------------------
   Homepage job listing: hide the shortcode's built-in sidebar & toolbar
   -------------------------------------------------------------------------- */
.home .job_listings .main-listing-content {
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.home .job_listings .main-listing-content > .row > .col-md-3 { display: none !important; }
.home .job_listings .main-listing-content > .row > .col-md-9 {
	width: 100% !important;
	float: none !important;
}
.home .job_listings .listing-action { display: none !important; }

/* --------------------------------------------------------------------------
   v1.0.2 — parallax bands, newsletter, footer imagery
   -------------------------------------------------------------------------- */
/* Counters & testimonials rows: replace red parallax photos with ink */
.vc_row.vc_parallax {
	background: var(--uj-ink) !important;
}
.vc_row.vc_parallax .vc_parallax-inner {
	background-image: none !important;
	background-color: var(--uj-ink) !important;
	opacity: 1 !important;
}

.counters { background: transparent !important; }
.counters .counter-item * { color: #fff !important; }
.counters .counter-item .name,
.counters .counter-item small,
.counters .counter-item p { color: #94a3b8 !important; }

/* Testimonial card on the dark band */
.apus-testimonials .testimonials-item,
.apus-testimonials .item-inner {
	border-radius: 16px;
}

/* Footer: kill every leftover background photo / colored band */
#apus-footer .vc_row,
#apus-footer [class*="vc_custom_"],
#apus-footer .vc_parallax-inner,
#apus-footer .footer-builder-wrapper,
#apus-footer .dark2 {
	background-image: none !important;
	background-color: transparent !important;
}
#apus-footer { background: #0b1220 !important; }

/* Newsletter band */
.widget-newletter,
.widget-newletter.st_3 {
	background: transparent !important;
	padding: 18px 0 !important;
}
.widget-newletter .title { color: #fff !important; font-weight: 700; }
.widget-newletter .icon-img img { filter: brightness(2); opacity: .9; }
.widget-newletter input[type="email"],
.widget-newletter input[type="text"] {
	border-radius: 10px !important;
	border: none !important;
	height: 50px !important;
	padding: 0 18px !important;
}
.widget-newletter button,
.widget-newletter input[type="submit"] {
	background: var(--uj-accent) !important;
	border-color: var(--uj-accent) !important;
	border-radius: 10px !important;
	height: 50px;
}
.widget-newletter button:hover { background: var(--uj-accent-dark) !important; }

/* Register (employer / candidate) row accents */
.apus-register .item .btn { border-radius: 999px !important; }

/* --------------------------------------------------------------------------
   v1.0.3 — final polish
   -------------------------------------------------------------------------- */
/* Register row OR bubble */
.apus-register .space span {
	background: var(--uj-accent) !important;
	color: #fff !important;
}

/* Grid/list view toggle */
.display-mode .change-view.active,
.display-mode .change-view:hover {
	background: var(--uj-ink) !important;
	border-color: var(--uj-ink) !important;
	color: #fff !important;
}

/* Listings sidebar taxonomy lists: stop awkward wrapping */
.widget-job-taxonomy li a {
	display: flex;
	align-items: baseline;
	gap: 7px;
	font-size: 14px;
	line-height: 1.5;
}

/* --------------------------------------------------------------------------
   v1.0.4 — mobile
   -------------------------------------------------------------------------- */
html, body { overflow-x: hidden !important; }

@media (max-width: 991px) {
	.widget-search-form.half {
		padding: 26px 20px 30px !important;
		border-radius: 16px;
	}
	.widget-search-form.half .widget-title,
	.widget-search-form.half .widget-title span { font-size: 24px; }

	.widget-search-form .table-visiable,
	.widget-search-form .left-inner { display: block !important; }

	.widget-search-form .search-filter-wrapper,
	.widget-search-form .wrapper-location {
		width: 100% !important;
		min-width: 0;
		margin: 0 0 12px !important;
	}
	.job_search_form .search-submit {
		width: 100% !important;
	}

	.job-grid .job-content-wrapper,
	.job-list .job-content-wrapper { padding: 18px; }

	.logo a::before, .logo a::after { font-size: 21px; }
}

/* v1.0.5 — mobile overflow containment */
@media (max-width: 991px) {
	.container,
	.main-listing-content.container,
	#main-container.container { width: 100% !important; max-width: 100% !important; padding-left: 15px !important; padding-right: 15px !important; }
	.row { margin-left: -10px !important; margin-right: -10px !important; }
	.widget-search-form.half,
	.widget-search-form.half .content,
	.job-grid, .job-list { max-width: 100% !important; width: 100% !important; }
	.list-item-job { padding-left: 10px !important; padding-right: 10px !important; }
	.vc_row[data-vc-full-width] { width: 100% !important; left: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
}

/* v1.0.6 — hard clip wrapper to stop JS-driven full-width overflow */
#wrapper-container { overflow-x: clip !important; max-width: 100vw; }
@media (max-width: 991px) {
	.vc_row-full-width { display: none !important; } /* zero-height spacer rows that carry the offset */
	body .vc_row[data-vc-full-width][style] {
		width: 100% !important;
		left: auto !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	.search_jobs--frontpage, .search_jobs_inner, .table-visiable { max-width: 100% !important; }
}

/* v1.0.8 — rebrand wordmark fit + hero form wrapper */
.logo a { white-space: nowrap; }
.logo a::before, .logo a::after { font-size: 21px; }
#apus-header .col-md-2 { width: auto; min-width: 220px; }

form.job_search_form { background: transparent !important; }
.job_search_form input[type="text"],
.job_search_form .search-field {
	border: 1px solid var(--uj-line) !important;
}

/* v1.0.9 — last white wrapper in hero */
.widget-search-form.half .content,
.widget-search-form .content { background: transparent !important; }