/* Theme overrides loaded after main.css */

/* Pages: remove default card padding on `.entry` so blocks can go edge-to-edge inside the container. */
body.page .entry {
	padding: 0 !important;
}

/* Footer: width + padding jak w innych sekcjach */
.site-footer .footer-container {
	max-width: 1092px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}

/* Menu thumbnails for models (CPT: kampery) */
.morelo-menu-thumb {
	width: 34px;
	height: 56px;
	border-radius: 10px;
	object-fit: cover;
	object-position: center;
	flex: 0 0 auto;
	margin-right: 10px;
}

/* Ensure link content aligns nicely when we inject thumbnail + label wrapper */
.site-nav .sub-menu a,
.mobile-nav a {
	align-items: center;
	gap: 0;
}

.morelo-menu-label {
	display: inline-block;
	min-width: 0;
}

/* Desktop dropdown: a bit more breathing room from the top (under the parent item) */
/* Desktop dropdowns: align submenu directly under the parent (no extra gap). */
.site-nav .sub-menu { top: 100%; }
.site-nav .menu-item-has-children::after { height: 12px; }

/* Footer: align top content so the right column doesn't start lower than the logo */
.site-footer .footer-top {
	align-items: start;
}

/* Backdrop for regular navbar dropdowns (non-mega) */
.morelo-nav-backdrop {
	position: fixed;
	top: var(--morelo-header-h);
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.92);
	z-index: 8000;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 260ms cubic-bezier(0.2, 0.8, 0.2, 1);
	will-change: opacity;
}

body.is-submenu-open .morelo-nav-backdrop {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* Ensure dropdown stays above backdrop */
body.is-submenu-open .site-nav .sub-menu {
	z-index: 9000;
}

/* Smooth dropdown animation (desktop). Keep mega-menu excluded. */
.site-nav > ul > li.menu-item-has-children:not(.morelo-has-mega) > .sub-menu {
	/* Override main.css (display: none) so we can animate */
	display: flex !important;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(8px);
	transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
	will-change: opacity, transform;
}

.site-nav > ul > li.menu-item-has-children:not(.morelo-has-mega):hover > .sub-menu,
.site-nav > ul > li.menu-item-has-children:not(.morelo-has-mega):focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
	transition: opacity 180ms ease, transform 180ms ease, visibility 0s;
}

/* Submenu links: no extra hover background (only subtle opacity change) */
.site-nav .sub-menu a:hover,
.site-nav .sub-menu a:focus,
.site-nav .sub-menu a:focus-visible,
.site-nav .sub-menu a:active {
	background: transparent !important;
	border-color: transparent !important;
	text-decoration: none;
	opacity: 0.92;
}

/* Dropdown alignment helpers (JS toggles these classes to keep submenu flush with parent and inside viewport) */
.site-nav > ul > li.menu-item-has-children.morelo-align-right > .sub-menu {
	left: auto !important;
	right: 0 !important;
}

.site-nav > ul > li.menu-item-has-children.morelo-align-left > .sub-menu {
	left: 0 !important;
	right: auto !important;
}

