/* ==========================================================================
   MENU/NAVIGATION STYLES
   ========================================================================== */

.main-navigation {
	background-color: #fff;
	position: relative;
	z-index: 998;
	display: block;
}

.nav-container {
	max-width: 1124px;
	margin: 0 auto;
	padding: 0;
}

.main-navigation .menu,
.main-navigation .primary-menu {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.main-navigation li {
	list-style: none;
	margin: 0 15px 0 0;
	padding: 0;
	position: relative;
	border: 1px solid black;
    text-transform: lowercase;
}

.main-navigation li:first-child {
	border-left: 1px solid black;
}

.main-navigation a {
	display: block;
	padding: 16px 17px;
	color: #333;
	text-decoration: none;
	transition: background-color 0.3s ease, color 0.3s ease;
	font-size: 20px;
	font-weight: 500;
}

.main-navigation a:hover {
	background-color: #f9f9f9;
	color: #c00;
	text-decoration: none;
}

.main-navigation .menu-item {
    margin-right: 15px;
}

.main-navigation .current-menu-item > a,
.main-navigation .current-menu-parent > a {
	background-color: #000;
	color: #fff;
}

.main-navigation .current-menu-item > a:hover,
.main-navigation .current-menu-parent > a:hover {
	background-color: #333;
	color: #fff;
	text-decoration: none;
}

/* Submenu / Dropdown */
.main-navigation ul.sub-menu,
.main-navigation ul.children {
	display: none;
	list-style: none;
	position: absolute;
	top: 100%;
	left: 0;
	background-color: #f9f9f9;
	border: 1px solid #ddd;
	border-top: 0;
	padding: 0;
	margin: 0;
	min-width: 200px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	z-index: 1000;
}

.main-navigation li:hover > .sub-menu,
.main-navigation li:hover > .children,
.main-navigation li:focus-within > .sub-menu,
.main-navigation li:focus-within > .children {
	display: block;
}

.main-navigation .sub-menu li,
.main-navigation .children li {
	border: none;
	border-bottom: 1px solid #ddd;
	padding: 0;
	margin: 0;
}

.main-navigation .sub-menu li:last-child,
.main-navigation .children li:last-child {
	border-bottom: none;
}

.main-navigation .sub-menu a,
.main-navigation .children a {
	padding: 0.75rem 1.5rem;
	color: #333;
	display: block;
	border: none;
	font-size: 0.85rem;
}

.main-navigation .sub-menu a:hover,
.main-navigation .children a:hover {
	background-color: #fff;
	color: #c00;
}

.main-navigation .sub-menu .current-menu-item > a,
.main-navigation .children .current-menu-item > a {
	background-color: #c00;
	color: #fff;
}

.main-navigation .sub-menu .current-menu-item > a:hover,
.main-navigation .children .current-menu-item > a:hover {
	background-color: #900;
	color: #fff;
}

/* Dropdown Indicator */
.main-navigation li.menu-item-has-children > a::after,
.main-navigation li.page_item_has_children > a::after {
	content: " \25BC";
	font-size: 0.6rem;
	margin-left: 0.5rem;
	opacity: 0.7;
}

/* Mobile Menu (hidden by default) */
.main-navigation.mobile-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background-color: #fff;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.main-navigation.mobile-menu.active {
	display: block;
}

.main-navigation.mobile-menu .menu,
.main-navigation.mobile-menu .primary-menu {
	flex-direction: column;
	border: 0;
}

.main-navigation.mobile-menu li {
	border-bottom: 1px solid #ddd;
	border-left: none;
	border-right: none;
}

.main-navigation.mobile-menu li:first-child {
	border-left: none;
}

.main-navigation.mobile-menu a {
	padding: 1rem;
	border: none;
}

.main-navigation.mobile-menu ul.sub-menu,
.main-navigation.mobile-menu ul.children {
	position: static;
	display: none;
	border: none;
	box-shadow: none;
	background-color: #f9f9f9;
}

.main-navigation.mobile-menu li.menu-item-has-children.active > .sub-menu,
.main-navigation.mobile-menu li.page_item_has_children.active > .children {
	display: block;
}

.main-navigation.mobile-menu .sub-menu li,
.main-navigation.mobile-menu .children li {
	border-bottom: 1px solid #ddd;
	margin-left: 1rem;
}

.main-navigation.mobile-menu .sub-menu a,
.main-navigation.mobile-menu .children a {
	padding-left: 1.5rem;
}

/* Page Nav Links (for pagination) */
.page-links {
	text-align: center;
	margin: 2rem 0;
	font-size: 0.875rem;
}

.page-links a,
.page-links span {
	display: inline-block;
	padding: 0.5rem 0.75rem;
	margin: 0.25rem;
	border: 1px solid #ddd;
	background-color: #fff;
	color: #333;
	text-decoration: none;
	border-radius: 3px;
	transition: all 0.3s ease;
}

.page-links a:hover {
	background-color: #c00;
	color: #fff;
	border-color: #c00;
	text-decoration: none;
}

.page-links span.page-numbers {
	border-color: #ddd;
}

.page-links span.dots {
	border: none;
	padding: 0.5rem 0.25rem;
}

/* Posts Pagination - Using .pagination class that WordPress outputs */
.pagination {
	text-align: center;
	margin: 3rem 0;
}

.pagination .nav-links {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}

/* Base styling for all pagination elements */
.pagination a,
.pagination span {
	display: inline-block;
	padding: 0.6rem 0.9rem;
	color: #fff;
	border: none;
	text-decoration: none;
	border-radius: 3px;
	transition: all 0.3s ease;
	font-size: 0.9rem;
	font-weight: 500;
	line-height: 1.4;
	min-width: 38px;
	text-align: center;
}

/* Current page - Dark gray/charcoal background */
.pagination span.current {
	background-color: #333;
	color: #fff;
	font-weight: 600;
	cursor: default;
}

/* Clickable page numbers - Red background */
.pagination a.page-numbers {
	background-color: #c00;
	color: #fff;
}

.pagination a.page-numbers:hover {
	background-color: #900;
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 2px 6px rgba(204, 0, 0, 0.3);
}

.pagination a.page-numbers:active {
	transform: translateY(0);
}

/* Ellipsis - Neutral gray background */
.pagination span.dots {
	background-color: #333;
	color: #fff;
	cursor: default;
	min-width: auto;
	padding: 0.6rem 0.5rem;
	font-weight: 400;
}

/* Previous button */
.pagination a.prev,
.pagination .prev {
	background-color: #c00;
	color: #fff;
	font-weight: 600;
	font-size: 0.95rem;
	padding: 0.6rem 1rem;
}

.pagination a.prev:hover,
.pagination .prev:hover {
	background-color: #900;
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 2px 6px rgba(204, 0, 0, 0.3);
}

.pagination a.prev:active,
.pagination .prev:active {
	transform: translateY(0);
}

/* Next button */
.pagination a.next,
.pagination .next {
	background-color: #c00;
	color: #fff;
	font-weight: 600;
	font-size: 0.95rem;
	padding: 0.6rem 1rem;
}

.pagination a.next:hover,
.pagination .next:hover {
	background-color: #900;
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: 0 2px 6px rgba(204, 0, 0, 0.3);
}

.pagination a.next:active,
.pagination .next:active {
	transform: translateY(0);
}

/* Disabled prev/next (when not available) */
.pagination .prev.disabled,
.pagination .next.disabled {
	background-color: #ddd;
	color: #999;
	cursor: not-allowed;
	opacity: 0.6;
}

.pagination .prev.disabled:hover,
.pagination .next.disabled:hover {
	background-color: #ddd;
	transform: none;
	box-shadow: none;
}