/*
Theme Name: Auto Parts Garage Child
Theme URI: https://www.buywptemplates.com/products/free-auto-parts-wordpress-theme
Template: auto-parts-garage
Author: VWThemes
Author URI: https://www.vwthemes.com/
Description: The Auto Parts Garage is a remarkable option for automotive businesses that want to establish an online presence. This Autoparts Garage offers a sleek, modern, and professional design, making it ideal for auto parts stores, garages, car-repair, automotive shops,Automotive, Repair, Workshop, Parts, Garage, mechanic shop, automobile, and workshops. Its user-friendly interface makes customization simple, even for those with limited web design experience. The theme offers a full-width header with a background image that is perfect for displaying your products and services. The Autoparts Garage can be used for businesses that deal in Car Service Mot, Tires, Brakes Hire, Automotive, Auto Care, Maintenance, Vehicle Diagnostics, Auto Glass, Body Shops,Tyre, Auto Inspections, repair services, accessories, dealerships, workshops, and garages. The Auotparts theme for WordPress also has a catalog section allowing you to present your offerings neat and attractively. The services section lets you showcase your workshop’s specialties and the services you offer. The Auto Parts Garage has a responsive design, so your website will look great on any device, including desktops, laptops, tablets, and smartphones. This is especially important in the automotive industry, where customers often search for parts and services while they’re on the go. The theme is also search engine optimized, which helps increase your online visibility and attract more potential customers to your website. It has several customization options, including custom colors, fonts, and logo upload, so you can easily make your website unique and reflective of your brand. Plus, it integrates seamlessly with WooCommerce, Ibtana website builder, Contact Form 7, Classic Widget, YITH Woocommerce Wishlist, Curcy- Multi currency for Woocommerce, making it easy to sell your products and services directly from your website. The Auto Parts Garage is a versatile and professional choice for automotive businesses. Demo: https://demos.buywptemplates.com/garage-pro/.
Tags: left-sidebar,right-sidebar,one-column,two-columns,three-columns,four-columns,grid-layout,wide-blocks,block-styles,flexible-header,custom-colors,custom-background,custom-logo,custom-menu,custom-header,editor-style,featured-images,footer-widgets,sticky-post,full-width-template,theme-options,translation-ready,threaded-comments,post-formats,rtl-language-support,blog,portfolio,e-commerce
Version: 0.8.3.1773336829
Updated: 2026-03-13 00:10:00

*/

/* Header reset and strict three-row structure */
.home-page-header,
.home-page-header * {
	box-sizing: border-box;
}

.home-page-header {
	margin: 0 !important;
	padding: 0 !important;
	background: #f5f7fa;
	border-bottom: 1px solid #e8edf3;
}

header[role="banner"] {
	position: sticky;
	top: 0;
	z-index: 9999;
	width: 100%;
	background: #f5f7fa;
	box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
}

.admin-bar header[role="banner"] {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar header[role="banner"] {
		top: 46px;
	}
}

.home-page-header .container {
	max-width: 1200px;
}

/* Parent theme conflict cleanup */
.top-bar,
.middle-header,
#header {
	margin: 0 !important;
	padding: 0 !important;
	min-height: 0 !important;
	background: transparent !important;
	border: 0 !important;
}

.logo {
	padding: 0 !important;
}

/* 1) Top bar */
.apg-topbar {
	height: 36px;
	background: #141b24;
	color: #d8e2ef;
	font-size: 12px;
}

.apg-topbar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 36px;
	direction: rtl;
	gap: 14px;
}

.apg-topbar-message {
	white-space: nowrap;
	line-height: 1;
}

.apg-topbar-left {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	direction: ltr;
}

.apg-topbar-links,
.apg-topbar-icons {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	line-height: 1;
}

.apg-topbar-links {
	direction: rtl;
}

.apg-topbar-links a,
.apg-topbar-icons a {
	color: #eaf2ff;
	text-decoration: none;
	font-size: 12px;
}

.apg-topbar-icons a {
	width: 26px;
	height: 26px;
	padding: 0 1px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	background: #ffffff;
	border: 0;
	color: #141b24;
	flex: 0 0 26px;
	overflow: visible;
	opacity: 1 !important;
	visibility: visible !important;
}

.apg-topbar-icons .apg-ico {
	width: 100%;
	height: 100%;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 700;
	font-family: Arial, sans-serif;
	line-height: 1;
	color: inherit;
	opacity: 1 !important;
	visibility: visible !important;
}

.apg-topbar-icons .icon-1 {
	background: #25d366;
	color: #ffffff;
}

.apg-topbar-icons .icon-2 {
	background: linear-gradient(135deg, #f58529 0%, #dd2a7b 50%, #8134af 100%);
	color: #ffffff;
}

.apg-topbar-icons .icon-3 {
	background: #111111;
	color: #ffffff;
}

.apg-topbar-icons .icon-4 {
	background: #1877f2;
	color: #ffffff;
}

.apg-topbar-icons a:hover,
.apg-topbar-icons a:focus {
	transform: translateY(-1px);
	color: #ffffff;
}

/* 2) Main header */
.apg-main-header {
	height: 86px;
	display: flex;
	align-items: center;
	border-bottom: 1px solid #e8edf3;
	padding: 0 !important;
	margin: 0 !important;
	background: #f5f7fa;
}

.apg-main-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	width: 100%;
	direction: rtl;
}

.apg-main-logo {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
}

.apg-brand {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
}

.apg-brand .custom-logo {
	margin: 0;
}

.apg-brand-text-wrap {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	line-height: 1.1;
}

.apg-brand-title {
	font-family: "Tajawal", "Cairo", sans-serif;
	font-size: 32px;
	font-weight: 800;
	color: #16202a;
	letter-spacing: 0;
}

.apg-brand-subtitle {
	font-size: 12px;
	font-weight: 500;
	color: #5f6b7a;
	margin-top: 2px;
}

.apg-main-logo .custom-logo {
	max-height: 58px;
	width: auto;
	display: block;
}

.apg-main-search {
	flex: 1 1 auto;
	max-width: 680px;
	margin: 0 auto;
}

.apg-search-form {
	display: flex;
	align-items: center;
	width: 100%;
	height: 50px;
	border: 1px solid #cfd8e3;
	border-radius: 28px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.apg-search-form input[type="search"] {
	flex: 1;
	height: 100%;
	margin: 0;
	padding: 0 16px;
	border: 0 !important;
	outline: 0;
	background: transparent;
	font-size: 15px;
}

.apg-search-form button {
	width: 52px;
	height: 100%;
	border: 0;
	margin: 0;
	background: #1f8f4f;
	color: #fff;
	cursor: pointer;
}

.apg-main-actions {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.apg-action {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid #d6dee8;
	border-radius: 999px;
	background: #fff;
	color: #1b2430;
	text-decoration: none;
}

.apg-action.account {
	width: auto;
	padding: 0 12px;
	gap: 6px;
}

.apg-action.account span {
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

.apg-cart-count {
	position: absolute;
	top: -5px;
	left: -5px;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	border-radius: 999px;
	background: #da2f24;
	color: #fff;
	font-size: 11px;
	line-height: 18px;
	text-align: center;
}

/* 3) Navigation bar */
.apg-nav-bar {
	height: 52px;
	border-bottom: 1px solid #e8edf3;
	padding: 0 !important;
	margin: 0 !important;
	background: #eef2f6 !important;
}

.apg-nav-inner {
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.apg-nav-bar #mySidenav {
	display: block;
	width: 100%;
}

.apg-nav-bar .main-navigation {
	width: 100%;
	text-align: center;
}

.apg-main-menu,
.apg-nav-bar .main-navigation ul {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.apg-main-menu > li > a,
.apg-nav-bar .main-navigation a {
	display: inline-flex;
	align-items: center;
	height: 52px;
	padding: 0 4px;
	text-transform: none;
	font-size: 15px;
	font-weight: 600;
	color: #222c39;
}

.apg-nav-bar li.current-menu-item a,
.apg-nav-bar .main-navigation a:hover,
.apg-nav-bar .main-navigation a:focus {
	color: #1f8f4f;
	border-bottom: 0;
	margin-bottom: 0;
}

/* Mobile */
@media (max-width: 991px) {
	.apg-topbar {
		height: auto;
		padding: 8px 0;
	}

	.apg-topbar-inner {
		height: auto;
		flex-wrap: wrap;
		justify-content: center;
	}

	.apg-main-header {
		height: auto;
		padding: 10px 0 !important;
	}

	.apg-main-header-inner {
		flex-wrap: wrap;
	}

	.apg-main-logo,
	.apg-main-actions,
	.apg-main-search {
		width: 100%;
	}

	.apg-main-logo,
	.apg-main-actions {
		display: flex;
		justify-content: center;
	}

	.apg-brand {
		justify-content: center;
	}

	.apg-brand-title {
		font-size: 28px;
	}

	.apg-brand-subtitle {
		display: none;
	}

	.apg-main-search {
		max-width: 100%;
	}

	.apg-nav-inner {
		justify-content: flex-end;
	}

	.toggle-nav.mobile-menu {
		display: block;
	}

	.apg-nav-bar .main-navigation ul {
		display: block;
	}
}

/* Final hard overrides to prevent inherited broken spacing */
header .home-page-header {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	transform: none !important;
}

.admin-bar .home-page-header {
	margin-top: 0 !important;
}

.home-page-header .row {
	margin: 0 !important;
}

.home-page-header [class*="col-"] {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.home-page-header .search-cat-box,
.home-page-header .product-cat,
.home-page-header .phonebox,
.home-page-header .cartbox,
.home-page-header .translate-lang,
.home-page-header .currency-box,
.home-page-header .top-bar .social-icons,
.home-page-header .top-bar .account {
	display: none !important;
}

.home-page-header .apg-topbar,
.home-page-header .apg-main-header,
.home-page-header .apg-nav-bar {
	display: block !important;
	width: 100%;
	clear: both;
}

.home-page-header .apg-main-header + .apg-nav-bar {
	margin-top: 0 !important;
}

/* Footer redesign */
.apg-footer {
	background: #0f1722;
	color: #d8e2ee;
	direction: rtl;
	margin-top: 40px;
}

.apg-footer-main {
	padding: 44px 0 26px;
}

.apg-footer-grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr 1fr;
	gap: 24px;
}

.apg-footer-col h3 {
	font-size: 17px;
	font-weight: 700;
	margin: 0 0 12px;
	color: #ffffff;
}

.apg-footer-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	margin-bottom: 12px;
}

.apg-footer-logo img,
.apg-footer-logo .custom-logo {
	max-height: 40px;
	width: auto;
}

.apg-footer-brand-name {
	font-size: 28px;
	font-weight: 800;
	color: #ffffff;
	line-height: 1;
}

.apg-footer-text {
	font-size: 14px;
	line-height: 1.9;
	color: #b5c1d0;
	margin: 0;
}

.apg-footer-text.small {
	font-size: 13px;
	margin-bottom: 10px;
}

.apg-footer-col ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.apg-footer-col li {
	margin: 0 0 8px;
}

.apg-footer-col a {
	color: #cfdae8;
	text-decoration: none;
	font-size: 14px;
}

.apg-footer-col a:hover,
.apg-footer-col a:focus {
	color: #21a05a;
}

.apg-footer-icons {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	direction: ltr;
	margin-bottom: 10px;
}

.apg-footer-icons a {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-decoration: none;
}

.apg-footer-icons .apg-ico {
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

.apg-footer-icons .icon-1 { background: #25d366; }
.apg-footer-icons .icon-2 { background: linear-gradient(135deg, #f58529 0%, #dd2a7b 50%, #8134af 100%); }
.apg-footer-icons .icon-3 { background: #000000; }
.apg-footer-icons .icon-4 { background: #1877f2; }

.apg-footer-mail {
	margin: 0;
	font-size: 13px;
	color: #9fb0c3;
}

.apg-footer-widgets {
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.apg-footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	padding: 14px 0;
	background: #0b111a;
}

.apg-footer-bottom-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	color: #a9b9cc;
}

@media (max-width: 991px) {
	.apg-footer-grid {
		grid-template-columns: 1fr 1fr;
	}

	.apg-footer-bottom-inner {
		flex-direction: column;
		text-align: center;
	}
}

@media (max-width: 575px) {
	.apg-footer-grid {
		grid-template-columns: 1fr;
	}

	.apg-footer-brand-name {
		font-size: 24px;
	}
}

/* Horizontal black footer override */
.apg-footer,
.apg-footer-ribbon,
.apg-footer-bottom {
	background: #0a0d12 !important;
	color: #d8e2ee !important;
}

.apg-footer {
	margin-top: 34px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.apg-footer-ribbon {
	padding: 14px 0;
}

.apg-footer-ribbon-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: nowrap;
	direction: rtl;
}

.apg-footer-brandline strong {
	color: #ffffff;
	font-size: 20px;
	font-weight: 800;
}

.apg-footer-brand-link {
	text-decoration: none;
}

.apg-footer-nav {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	justify-content: center;
}

.apg-footer-nav a {
	color: #cdd8e6;
	text-decoration: none;
	font-size: 14px;
	white-space: nowrap;
}

.apg-footer-nav a:hover,
.apg-footer-nav a:focus {
	color: #22a45c;
}

.apg-footer-icons {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	direction: ltr;
}

.apg-footer-icons a {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-decoration: none;
}

.apg-footer-icons .apg-ico {
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}

.apg-footer-icons .icon-1 { background: #25d366; }
.apg-footer-icons .icon-2 { background: linear-gradient(135deg, #f58529 0%, #dd2a7b 50%, #8134af 100%); }
.apg-footer-icons .icon-3 { background: #000; }
.apg-footer-icons .icon-4 { background: #1877f2; }

.apg-footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding: 10px 0;
}

.apg-footer-bottom-inner {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 13px;
	color: #9fb0c3;
}

@media (max-width: 991px) {
	.apg-footer-ribbon-inner {
		flex-wrap: wrap;
		justify-content: center;
	}

	.apg-footer-brandline,
	.apg-footer-nav,
	.apg-footer-icons {
		width: 100%;
		justify-content: center;
	}
}

