/*
 * Header enhancer. Astra's own off-canvas drawer already handles open/
 * close state, ESC, overlay-click and focus trap — this file only adds
 * the animation timing, width, safe-area and overlay-blur the brief asks
 * for on top of Astra's existing markup. No positioning override lives
 * here; the left/right side itself is set via astra_update_option() in
 * class-header.php, Astra's own supported API.
 */

#ast-mobile-popup.ast-mobile-popup-drawer .ast-mobile-popup-inner {
	transition-duration: var( --agm-drawer-duration ) !important;
	transition-timing-function: var( --agm-drawer-easing );
	max-width: var( --agm-drawer-width );
	padding-top: var( --agm-safe-top );
	padding-bottom: var( --agm-safe-bottom );
}

#ast-mobile-popup.ast-mobile-popup-drawer.ast-mobile-popup-left .ast-mobile-popup-inner {
	padding-left: var( --agm-safe-left );
}

#ast-mobile-popup.ast-mobile-popup-drawer .ast-mobile-popup-overlay {
	transition-duration: var( --agm-drawer-duration );
	backdrop-filter: blur( var( --agm-overlay-blur ) );
	-webkit-backdrop-filter: blur( var( --agm-overlay-blur ) );
	background-color: rgba( 0, 0, 0, var( --agm-overlay-opacity ) );
}

/* Drawer Animation: "Fade" (Animations settings) — cross-fades in place
   instead of Astra's own slide transform. Astra still drives open/close
   state and the transform itself; this only neutralises the slide so the
   fade reads cleanly. */
body.agm-drawer-anim-fade #ast-mobile-popup.ast-mobile-popup-drawer .ast-mobile-popup-inner {
	transition-property: opacity, visibility;
	transform: none !important;
	opacity: 0;
}

body.agm-drawer-anim-fade #ast-mobile-popup.ast-mobile-popup-drawer.active .ast-mobile-popup-inner {
	opacity: 1;
}

#menu-toggle-close {
	min-width: var( --agm-tap-size );
	min-height: var( --agm-tap-size );
}

@media ( prefers-reduced-motion: reduce ) {
	body.agm-respect-reduced-motion #ast-mobile-popup.ast-mobile-popup-drawer .ast-mobile-popup-inner,
	body.agm-respect-reduced-motion #ast-mobile-popup.ast-mobile-popup-drawer .ast-mobile-popup-overlay {
		transition: none !important;
	}
}