@a.nemreen/dga-ui 0.3.2 → 0.3.4

package/fesm2022/a.nemreen-dga-ui-header.mjs

@@ -1,4 +1,4 @@
-import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,booleanAttribute as y,model as w,output as u,signal as l,Injector as R,DOCUMENT as _,DestroyRef as U,viewChild as k,computed as n,effect as L,untracked as T,afterNextRender as b,HostListener as m,ChangeDetectionStrategy as F,Component as V}from"@angular/core";import{APP_BASE_HREF as Y,PlatformLocation as Q}from"@angular/common";import{dgaSafeHref as N,dgaCx as r,DgaAvatar as S,DgaBadge as C,DgaField as D,DgaFormControl as I,DgaFormEnd as z,DgaIcon as M,DgaIconBadge as A,DgaModal as P,DgaTooltip as O}from"@a.nemreen/dga-ui";function B($,e="/"){if(typeof window>"u")return!1;const t=N($.trim(),e);if(!t)return!1;try{const i=new URL(t,window.location.origin);return i.protocol!=="http:"&&i.protocol!=="https:"||i.origin!==window.location.origin?!1:(window.location.assign(`${i.pathname}${i.search}${i.hash}`),!0)}catch{return!1}}const H="group relative inline-flex h-(--size-header-portal) shrink-0 cursor-pointer items-center gap-md rounded-sm px-xl font-sans text-body-md font-medium text-fg hover:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",K="pointer-events-none absolute start-xl end-xl bottom-0 h-[5px] rounded-full",W="inline-flex min-h-5xl w-full cursor-pointer flex-col justify-center gap-xxs rounded-sm px-xl py-sm text-start text-body-md font-normal text-fg transition-colors hover:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",G="inline-flex min-h-11xl w-full cursor-pointer flex-col justify-center gap-xs rounded-md border border-border bg-card px-2xl py-xl text-start transition-colors hover:border-primary hover:bg-primary-faint focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",Z="relative flex min-h-7xl w-full cursor-pointer items-center gap-lg rounded-md px-xl py-md text-start text-body-md font-medium text-fg transition-colors hover:bg-neutral-light active:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",X="flex min-h-6xl w-full cursor-pointer flex-col justify-center gap-xxs rounded-md px-xl py-md text-start text-body-md text-fg transition-colors hover:bg-neutral-light active:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus";class g{host=p(q);baseHref=p(Y,{optional:!0})??p(Q).getBaseHrefFromDOM()??"/";closeTimer=null;dropdownSyncFrame=null;lastDropdownStyleKey="";collapseId="dga-nav-collapse";dropLink=W;dropTile=G;mobileLink=X;brand=o("",...ngDevMode?[{debugName:"brand"}]:[]);brandSlogan=o("",...ngDevMode?[{debugName:"brandSlogan"}]:[]);brandLogo=o("",...ngDevMode?[{debugName:"brandLogo"}]:[]);brandLogoAlt=o("\u0634\u0639\u0627\u0631 \u0627\u0644\u062C\u0647\u0629",...ngDevMode?[{debugName:"brandLogoAlt"}]:[]);brandPlaceholder=o(!1,{...ngDevMode?{debugName:"brandPlaceholder"}:{},transform:y});brandHref=o("#",...ngDevMode?[{debugName:"brandHref"}]:[]);navLabel=o("\u0627\u0644\u062A\u0646\u0642\u0644 \u0627\u0644\u0631\u0626\u064A\u0633\u064A",...ngDevMode?[{debugName:"navLabel"}]:[]);menuToggleLabel=o("\u0641\u062A\u062D \u0642\u0627\u0626\u0645\u0629 \u0627\u0644\u062A\u0646\u0642\u0644",...ngDevMode?[{debugName:"menuToggleLabel"}]:[]);menuCloseLabel=o("\u0625\u063A\u0644\u0627\u0642 \u0642\u0627\u0626\u0645\u0629 \u0627\u0644\u062A\u0646\u0642\u0644",...ngDevMode?[{debugName:"menuCloseLabel"}]:[]);appearance=o("default",...ngDevMode?[{debugName:"appearance"}]:[]);mobileNav=o("sheet",...ngDevMode?[{debugName:"mobileNav"}]:[]);sticky=o(!0,{...ngDevMode?{debugName:"sticky"}:{},transform:y});items=o([],...ngDevMode?[{debugName:"items"}]:[]);actions=o([],...ngDevMode?[{debugName:"actions"}]:[]);search=o(null,...ngDevMode?[{debugName:"search"}]:[]);searchQuery=w("",...ngDevMode?[{debugName:"searchQuery"}]:[]);notifications=o(null,...ngDevMode?[{debugName:"notifications"}]:[]);login=o(null,...ngDevMode?[{debugName:"login"}]:[]);user=o(null,...ngDevMode?[{debugName:"user"}]:[]);authenticated=w(!1,...ngDevMode?[{debugName:"authenticated"}]:[]);actionClick=u();searchSubmit=u();searchSuggestionSelect=u();searchVoice=u();notificationAction=u();loginSubmit=u();logout=u();userLinkClick=u();navLinkClick=u();mobileOpen=l(!1,...ngDevMode?[{debugName:"mobileOpen"}]:[]);openDropdown=l(null,...ngDevMode?[{debugName:"openDropdown"}]:[]);searchOpen=l(!1,...ngDevMode?[{debugName:"searchOpen"}]:[]);notificationsOpen=l(!1,...ngDevMode?[{debugName:"notificationsOpen"}]:[]);loginOpen=l(!1,...ngDevMode?[{debugName:"loginOpen"}]:[]);userMenuOpen=l(!1,...ngDevMode?[{debugName:"userMenuOpen"}]:[]);voiceListening=l(!1,...ngDevMode?[{debugName:"voiceListening"}]:[]);expandedNotificationId=l(null,...ngDevMode?[{debugName:"expandedNotificationId"}]:[]);loginEmail=l("",...ngDevMode?[{debugName:"loginEmail"}]:[]);loginPassword=l("",...ngDevMode?[{debugName:"loginPassword"}]:[]);showLoginPassword=l(!1,...ngDevMode?[{debugName:"showLoginPassword"}]:[]);loginSubmitting=l(!1,...ngDevMode?[{debugName:"loginSubmitting"}]:[]);dropdownPanelStyle=l({},...ngDevMode?[{debugName:"dropdownPanelStyle"}]:[]);dismissedNotificationIds=l(new Set,...ngDevMode?[{debugName:"dismissedNotificationIds"}]:[]);readNotificationIds=l(new Set,...ngDevMode?[{debugName:"readNotificationIds"}]:[]);dropdownTrigger=null;dropdownActionId=null;injector=p(R);doc=p(_);destroyRef=p(U);searchInputRef=k("searchInput",...ngDevMode?[{debugName:"searchInputRef"}]:[]);utilLayerRef=k("utilLayer",...ngDevMode?[{debugName:"utilLayerRef"}]:[]);searchPanelId="dga-header-search-panel";notificationsPanelId="dga-header-notifications-panel";loginPanelId="dga-header-login-panel";userPanelId="dga-header-user-panel";isPortal=n(()=>this.appearance()==="portal",...ngDevMode?[{debugName:"isPortal"}]:[]);appHref(e){return N(e,this.baseHref)}searchConfig=n(()=>this.search(),...ngDevMode?[{debugName:"searchConfig"}]:[]);searchActionId=n(()=>this.search()?.actionId??"search",...ngDevMode?[{debugName:"searchActionId"}]:[]);notificationsConfig=n(()=>this.notifications(),...ngDevMode?[{debugName:"notificationsConfig"}]:[]);notificationsActionId=n(()=>this.notifications()?.actionId??"notifications",...ngDevMode?[{debugName:"notificationsActionId"}]:[]);loginConfig=n(()=>this.login(),...ngDevMode?[{debugName:"loginConfig"}]:[]);loginActionId=n(()=>this.login()?.actionId??"login",...ngDevMode?[{debugName:"loginActionId"}]:[]);userConfig=n(()=>this.user(),...ngDevMode?[{debugName:"userConfig"}]:[]);utilityOverlayOpen=n(()=>this.notificationsOpen()||this.loginOpen()||this.userMenuOpen(),...ngDevMode?[{debugName:"utilityOverlayOpen"}]:[]);visibleNotifications=n(()=>{const e=this.notifications()?.items??[],t=this.dismissedNotificationIds(),i=this.readNotificationIds();return e.filter(s=>!t.has(s.id)).map(s=>({...s,read:!!s.read||i.has(s.id)}))},...ngDevMode?[{debugName:"visibleNotifications"}]:[]);unreadNotificationCount=n(()=>this.visibleNotifications().filter(e=>!e.read).length,...ngDevMode?[{debugName:"unreadNotificationCount"}]:[]);constructor(){this.destroyRef.onDestroy(()=>this.removePortaledUtilLayer()),L(()=>{this.mobileNav(),T(()=>{this.mobileOpen()&&this.closeAll()})}),L(()=>{if(!this.utilityOverlayOpen())return;this.utilLayerRef()?.nativeElement&&this.portalUtilLayer(),b(()=>this.portalUtilLayer(),{injector:this.injector})})}portalUtilLayer(){const e=this.utilLayerRef()?.nativeElement;!e||e.parentElement===this.doc.body||this.doc.body.appendChild(e)}removePortaledUtilLayer(){const e=this.utilLayerRef()?.nativeElement;e?.parentElement===this.doc.body&&e.remove()}activeWideDropdown=n(()=>{if(!this.hoverMenus()&&this.isMobileViewport())return null;const e=this.openDropdown();if(e===null)return null;const t=this.items()[e];if(!t?.dropdown)return null;const i=this.resolveVariant(t);return i==="menu"?null:{index:e,item:t,variant:i}},...ngDevMode?[{debugName:"activeWideDropdown"}]:[]);hostClasses=n(()=>r("relative z-header block overflow-visible border-b border-border-subtle bg-nav font-sans text-fg",this.sticky()&&"sticky top-0 shadow-md"),...ngDevMode?[{debugName:"hostClasses"}]:[]);innerClasses=n(()=>r("relative flex w-full gap-lg px-(--wrapper-padding)",this.appearance()==="default"&&"min-h-6xl items-center py-md",this.appearance()==="portal"&&"h-(--size-header-portal) items-stretch"),...ngDevMode?[{debugName:"innerClasses"}]:[]);desktopNavClasses=n(()=>r("min-w-0 flex-1",this.appearance()==="default"&&"flex flex-wrap items-center gap-lg self-center",this.appearance()==="portal"&&"hidden md:flex md:items-stretch"),...ngDevMode?[{debugName:"desktopNavClasses"}]:[]);actionsClasses=n(()=>r("ms-auto flex shrink-0 items-stretch empty:hidden",this.isPortal()&&this.items().length>0&&"max-md:hidden"),...ngDevMode?[{debugName:"actionsClasses"}]:[]);mobilePanelClass(){const e=this.mobileOpen(),t=this.mobileNav();return r("flex flex-col overflow-hidden bg-nav md:hidden",t==="sheet"&&"fixed top-0 bottom-0 end-0 z-20 w-[min(16rem,70vw)] max-w-[16rem] rounded-s-xl border-s border-border shadow-2xl",t==="fullscreen"&&"fixed inset-0 z-40 rounded-none border-0 shadow-none",t==="push"&&"absolute inset-x-0 top-full z-20 max-h-[min(70dvh,28rem)] border-b border-border shadow-lg",e?"dga-mobile-nav-open":"dga-mobile-nav-closed",e&&t==="sheet"&&"dga-mobile-sheet-open",e&&t==="fullscreen"&&"dga-mobile-fs-open",e&&t==="push"&&"dga-mobile-push-open")}hoverMenus(){return typeof matchMedia!="function"?!1:matchMedia("(hover: hover) and (pointer: fine)").matches}isMobileViewport(){return typeof matchMedia!="function"?!1:matchMedia("(max-width: 767px)").matches}resolveVariant(e){const t=e.dropdown;return t?t.variant?t.variant:t.featured?"featured":t.columns?.length||t.layout==="columns"||t.layout==="rows"?"mega":"menu":"menu"}resolveLayout(e){const t=e.dropdown;return t?t.layout?t.layout:t.columns?.length?"columns":"list":"list"}colCount(e){return e.dropdown?.columns?.length??0}flatLinks(e){const t=e.dropdown;return t?t.links?.length?t.links:t.columns?.flatMap(i=>i.links)??[]:[]}columnsGridClass(e){return r("grid w-full gap-2xl py-lg",e>1&&"sm:grid-cols-2",e>2&&"lg:grid-cols-3",e>3&&"xl:grid-cols-4")}featuredGridClass(e,t){return r("grid w-full gap-3xl",e==="featured"&&t&&"lg:grid-cols-[minmax(0,1fr)_minmax(14rem,18rem)]")}navItemClass(e,t=!1){return r(H,"justify-center",e&&"text-fg-primary",t&&"bg-neutral-light")}mobileItemClass(e,t=!1){return r(Z,e&&"bg-primary-faint",t&&"bg-neutral-light")}indicatorClass(e){return r(K,e?"bg-primary group-hover:bg-primary":"bg-transparent group-hover:bg-fg-disabled")}actionClass(e){return r(H,"relative justify-center")}badgeClass(){return r("dga-action-badge absolute top-lg end-md flex h-lg min-w-lg","items-center justify-center rounded-full bg-error px-xxs","text-body-2xs font-medium text-on-color")}isIconOnly(e){return e.iconOnly!==!1}isSearchAction(e){return!!this.search()&&e.id===this.searchActionId()}isNotificationsAction(e){return!!this.notifications()&&e.id===this.notificationsActionId()}isLoginAction(e){return!!this.login()&&e.id===this.loginActionId()}actionTooltip(e){return this.isLoginAction(e)&&this.authenticated()&&this.user()?.name||e.label}actionAriaLabel(e){return this.actionTooltip(e)}actionExpanded(e){return this.isSearchAction(e)?this.searchOpen():this.isNotificationsAction(e)?this.notificationsOpen():this.isLoginAction(e)?this.authenticated()?this.userMenuOpen():this.loginOpen():null}actionControls(e){return this.isSearchAction(e)?this.searchPanelId:this.isNotificationsAction(e)?this.notificationsPanelId:this.isLoginAction(e)?this.authenticated()?this.userPanelId:this.loginPanelId:null}actionIndicatorActive(e){return this.isSearchAction(e)?this.searchOpen():this.isNotificationsAction(e)?this.notificationsOpen():this.isLoginAction(e)?this.authenticated()?this.userMenuOpen():this.loginOpen():!1}clearCloseTimer(){this.closeTimer!==null&&(clearTimeout(this.closeTimer),this.closeTimer=null)}scheduleClose(){this.clearCloseTimer(),this.closeTimer=setTimeout(()=>{this.openDropdown.set(null),this.closeTimer=null},120)}setBodyScrollLocked(e){typeof document>"u"||document.documentElement.classList.toggle("dga-nav-locked",e)}unlockBodyIfIdle(){this.mobileOpen()||this.utilityOverlayOpen()||this.setBodyScrollLocked(!1)}onItemEnter(e){if(!this.isMobileViewport()){if(!this.items()[e]?.dropdown){this.hoverMenus()&&this.scheduleClose();return}this.clearCloseTimer(),this.hoverMenus()&&this.openDropdown.set(e)}}onPanelEnter(){this.clearCloseTimer()}onHostLeave(e){if(!this.hoverMenus()||this.isMobileViewport())return;const t=e.relatedTarget;t&&this.host.nativeElement.contains(t)||this.scheduleClose()}toggleMobile(){this.mobileOpen.update(e=>!e),this.openDropdown.set(null),this.setBodyScrollLocked(this.mobileOpen())}toggleDropdown(e,t){t.stopPropagation(),!(this.hoverMenus()&&!this.isMobileViewport()&&this.openDropdown()===e)&&(this.clearCloseTimer(),this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.openDropdown.update(i=>i===e?null:e))}closeAll(){this.clearCloseTimer(),this.openDropdown.set(null),this.mobileOpen.set(!1),this.closeSearch(!1),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.setBodyScrollLocked(!1)}onAction(e,t){const i=this.triggerFromEvent(t);if(this.isSearchAction(e)){this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.toggleSearch(),this.actionClick.emit(e);return}if(this.isNotificationsAction(e)){this.closeSearch(),this.closeLogin(),this.closeUserMenu(),this.toggleNotifications(i),this.actionClick.emit(e);return}if(this.isLoginAction(e)){this.closeSearch(),this.closeNotifications(),this.authenticated()?(this.closeLogin(),this.toggleUserMenu(i)):(this.closeUserMenu(),this.toggleLogin(i)),this.actionClick.emit(e);return}this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.actionClick.emit(e)}onMobileAction(e,t){const i=this.triggerFromEvent(t);if(this.isSearchAction(e)){this.mobileOpen.set(!1),this.setBodyScrollLocked(!1),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.toggleSearch(),this.actionClick.emit(e);return}if(this.isNotificationsAction(e)){this.mobileOpen.set(!1),this.closeSearch(),this.closeLogin(),this.closeUserMenu(),this.toggleNotifications(i),this.isMobileViewport()&&this.setBodyScrollLocked(!0),this.actionClick.emit(e);return}if(this.isLoginAction(e)){this.mobileOpen.set(!1),this.closeSearch(),this.closeNotifications(),this.authenticated()?(this.closeLogin(),this.toggleUserMenu(i)):(this.closeUserMenu(),this.toggleLogin(i)),this.isMobileViewport()&&this.setBodyScrollLocked(!0),this.actionClick.emit(e);return}this.actionClick.emit(e),this.closeAll()}closeUtilityOverlays(){this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closeUserMenu()}closePortalChromeMenus(){typeof document>"u"||document.dispatchEvent(new CustomEvent("dga-close-portal-chrome-menus"))}onCloseHeaderOverlays(){this.closeUtilityOverlays()}toggleSearch(){if(this.searchOpen()){this.closeSearch();return}this.openDropdown.set(null),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.closePortalChromeMenus(),this.searchOpen.set(!0)}onSearchModalOpenChange(e){if(e){this.searchOpen.set(!0);return}this.closeSearch()}focusSearchInput(){b(()=>this.searchInputRef()?.nativeElement.focus(),{injector:this.injector})}closeSearch(e=!0){this.searchOpen.set(!1),e&&this.stopVoice()}toggleNotifications(e){if(this.notificationsOpen()){this.closeNotifications();return}this.openDropdown.set(null),this.closeSearch(),this.closeLogin(),this.closeUserMenu(),this.closePortalChromeMenus(),this.notificationsOpen.set(!0);const t=this.visibleNotifications()[0];this.expandedNotificationId.set(t?.id??null),this.scheduleDropdownSync(this.notificationsActionId(),e),this.isMobileViewport()&&this.setBodyScrollLocked(!0)}closeNotifications(){this.notificationsOpen.set(!1),this.expandedNotificationId.set(null),this.clearDropdownAnchor(),this.unlockBodyIfIdle()}toggleLogin(e){if(this.loginOpen()){this.closeLogin();return}this.openDropdown.set(null),this.closeSearch(),this.closeNotifications(),this.closeUserMenu(),this.closePortalChromeMenus(),this.loginOpen.set(!0),this.scheduleDropdownSync(this.loginActionId(),e),this.isMobileViewport()&&this.setBodyScrollLocked(!0)}closeLogin(){this.loginOpen.set(!1),this.loginSubmitting.set(!1),this.showLoginPassword.set(!1),this.clearDropdownAnchor(),this.unlockBodyIfIdle()}toggleUserMenu(e){if(this.userMenuOpen()){this.closeUserMenu();return}this.openDropdown.set(null),this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closePortalChromeMenus(),this.userMenuOpen.set(!0),this.scheduleDropdownSync(this.loginActionId(),e),this.isMobileViewport()&&this.setBodyScrollLocked(!0)}closeUserMenu(){this.userMenuOpen.set(!1),this.clearDropdownAnchor(),this.unlockBodyIfIdle()}onLoginSubmit(e){e.preventDefault();const t=this.loginEmail().trim(),i=this.loginPassword();!t||!i||(this.loginSubmitting.set(!0),this.loginSubmit.emit({email:t,password:i}),setTimeout(()=>{this.loginOpen()&&(this.authenticated.set(!0),this.loginEmail.set(""),this.loginPassword.set(""),this.loginSubmitting.set(!1),this.closeLogin())},600))}onUserLink(e){if(this.userLinkClick.emit(e),e.id==="logout"||e.danger){this.authenticated.set(!1),this.logout.emit(),this.closeUserMenu();return}this.closeUserMenu()}toggleNotificationExpand(e){this.expandedNotificationId.update(t=>t===e.id?null:e.id),this.notificationAction.emit({item:e,action:"select"})}onNotificationAction(e,t){t==="read"&&this.readNotificationIds.update(i=>new Set([...i,e.id])),t==="dismiss"&&(this.dismissedNotificationIds.update(i=>new Set([...i,e.id])),this.expandedNotificationId.update(i=>i===e.id?null:i)),t==="view"&&e.href&&B(e.href,this.baseHref),this.notificationAction.emit({item:e,action:t})}markAllNotificationsRead(){const e=this.visibleNotifications().map(t=>t.id);this.readNotificationIds.update(t=>new Set([...t,...e]))}clearSearchQuery(){this.searchQuery.set(""),queueMicrotask(()=>this.searchInputRef()?.nativeElement.focus())}applySearchSuggestion(e){const t=e.value??e.label;this.searchQuery.set(t),this.searchSuggestionSelect.emit(e),queueMicrotask(()=>this.searchInputRef()?.nativeElement.focus())}onSearchFormSubmit(e){e.preventDefault();const t=this.searchQuery().trim();this.searchSubmit.emit(t);const i=this.search();if(i?.resultsHref){const s=i.queryParam??"q",d=new URL(i.resultsHref,typeof window<"u"?window.location.origin:"http://localhost");t?d.searchParams.set(s,t):d.searchParams.delete(s),typeof window<"u"&&window.location.assign(`${d.pathname}${d.search}${d.hash}`)}this.closeSearch()}onSearchVoice(){if(this.searchVoice.emit(),typeof window>"u")return;const e=window,t=e.SpeechRecognition||e.webkitSpeechRecognition;if(!t)return;this.stopVoice();const i=new t;i.lang=typeof document<"u"&&document.documentElement.lang?document.documentElement.lang:"ar-SA",i.interimResults=!1,i.maxAlternatives=1,this.voiceListening.set(!0),i.onresult=s=>{const d=s.results[0]?.[0]?.transcript?.trim();d&&this.searchQuery.set(d),this.voiceListening.set(!1)},i.onerror=()=>this.voiceListening.set(!1),i.onend=()=>this.voiceListening.set(!1),this.speechRecognition=i,i.start()}speechRecognition=null;stopVoice(){this.speechRecognition?.stop(),this.speechRecognition=null,this.voiceListening.set(!1)}triggerFromEvent(e){const t=e?.currentTarget;return t instanceof HTMLElement?t:null}scheduleDropdownSync(e,t){this.dropdownActionId=e,this.dropdownTrigger=t??null,b(()=>this.requestDropdownSync(t),{injector:this.injector})}requestDropdownSync(e){if(typeof requestAnimationFrame!="function"){this.syncDropdownPanel(e);return}this.dropdownSyncFrame===null&&(this.dropdownSyncFrame=requestAnimationFrame(()=>{this.dropdownSyncFrame=null,this.syncDropdownPanel(e)}))}clearDropdownAnchor(){this.notificationsOpen()||this.loginOpen()||this.userMenuOpen()||(this.dropdownTrigger=null,this.dropdownActionId=null,this.lastDropdownStyleKey="",this.dropdownPanelStyle.set({}))}findActionTrigger(e){const t=this.host.nativeElement.querySelectorAll(`[data-dga-action="${CSS.escape(e)}"]`);for(const i of Array.from(t)){const s=i;if(s.getClientRects().length>0)return s}return t[0]??null}syncDropdownPanel(e){if(typeof window>"u")return;if(this.isMobileViewport()){const c={top:"auto",bottom:"max(0.75rem, env(safe-area-inset-bottom, 0px))",left:"0.75rem",right:"0.75rem",width:"auto",maxWidth:"none"},v=`sheet|${c.bottom}`;if(v===this.lastDropdownStyleKey)return;this.lastDropdownStyleKey=v,this.dropdownPanelStyle.set(c);return}const t=e??this.dropdownTrigger??(this.dropdownActionId?this.findActionTrigger(this.dropdownActionId):null);if(!t)return;this.dropdownTrigger=t;const i=t.getBoundingClientRect();if(i.width<1&&i.height<1)return;const s=getComputedStyle(this.host.nativeElement).direction,j=(typeof document<"u"?document.documentElement.getAttribute("dir"):null)==="rtl"||s==="rtl",E=8,h=Math.min(448,window.innerWidth-32),f={top:`${Math.round(i.bottom+E)}px`};if(j){let c=Math.round(i.left);c=Math.max(16,Math.min(c,window.innerWidth-h-16)),f.left=`${c}px`,f.right="auto"}else{let c=Math.round(window.innerWidth-i.right);c=Math.max(16,Math.min(c,window.innerWidth-h-16)),f.right=`${c}px`,f.left="auto"}const x=`${f.top}|${f.left??""}|${f.right??""}`;x!==this.lastDropdownStyleKey&&(this.lastDropdownStyleKey=x,this.dropdownPanelStyle.set(f))}onKey(e){e.key==="Escape"&&this.closeAll()}onScroll(){(this.notificationsOpen()||this.loginOpen()||this.userMenuOpen())&&this.requestDropdownSync()}onResize(){typeof window>"u"||(window.matchMedia("(max-width: 767px)").matches||(this.mobileOpen.set(!1),this.setBodyScrollLocked(!1)),(this.notificationsOpen()||this.loginOpen()||this.userMenuOpen())&&(this.lastDropdownStyleKey="",this.requestDropdownSync()))}onNavLinkClick(e,t){this.navLinkClick.emit(e),e.href||t.preventDefault()}onDocClick(e){this.searchOpen()||this.notificationsOpen()||this.loginOpen()||this.userMenuOpen()||this.hoverMenus()&&!this.isMobileViewport()||this.mobileOpen()||this.host.nativeElement.contains(e.target)||this.openDropdown.set(null)}static \u0275fac=a.\u0275\u0275ngDeclareFactory({minVersion:"12.0.0",version:"22.0.7",ngImport:a,type:g,deps:[],target:a.\u0275\u0275FactoryTarget.Component});static \u0275cmp=a.\u0275\u0275ngDeclareComponent({minVersion:"17.0.0",version:"22.0.7",type:g,isStandalone:!0,selector:"dga-header",inputs:{brand:{classPropertyName:"brand",publicName:"brand",isSignal:!0,isRequired:!1,transformFunction:null},brandSlogan:{classPropertyName:"brandSlogan",publicName:"brandSlogan",isSignal:!0,isRequired:!1,transformFunction:null},brandLogo:{classPropertyName:"brandLogo",publicName:"brandLogo",isSignal:!0,isRequired:!1,transformFunction:null},brandLogoAlt:{classPropertyName:"brandLogoAlt",publicName:"brandLogoAlt",isSignal:!0,isRequired:!1,transformFunction:null},brandPlaceholder:{classPropertyName:"brandPlaceholder",publicName:"brandPlaceholder",isSignal:!0,isRequired:!1,transformFunction:null},brandHref:{classPropertyName:"brandHref",publicName:"brandHref",isSignal:!0,isRequired:!1,transformFunction:null},navLabel:{classPropertyName:"navLabel",publicName:"navLabel",isSignal:!0,isRequired:!1,transformFunction:null},menuToggleLabel:{classPropertyName:"menuToggleLabel",publicName:"menuToggleLabel",isSignal:!0,isRequired:!1,transformFunction:null},menuCloseLabel:{classPropertyName:"menuCloseLabel",publicName:"menuCloseLabel",isSignal:!0,isRequired:!1,transformFunction:null},appearance:{classPropertyName:"appearance",publicName:"appearance",isSignal:!0,isRequired:!1,transformFunction:null},mobileNav:{classPropertyName:"mobileNav",publicName:"mobileNav",isSignal:!0,isRequired:!1,transformFunction:null},sticky:{classPropertyName:"sticky",publicName:"sticky",isSignal:!0,isRequired:!1,transformFunction:null},items:{classPropertyName:"items",publicName:"items",isSignal:!0,isRequired:!1,transformFunction:null},actions:{classPropertyName:"actions",publicName:"actions",isSignal:!0,isRequired:!1,transformFunction:null},search:{classPropertyName:"search",publicName:"search",isSignal:!0,isRequired:!1,transformFunction:null},searchQuery:{classPropertyName:"searchQuery",publicName:"searchQuery",isSignal:!0,isRequired:!1,transformFunction:null},notifications:{classPropertyName:"notifications",publicName:"notifications",isSignal:!0,isRequired:!1,transformFunction:null},login:{classPropertyName:"login",publicName:"login",isSignal:!0,isRequired:!1,transformFunction:null},user:{classPropertyName:"user",publicName:"user",isSignal:!0,isRequired:!1,transformFunction:null},authenticated:{classPropertyName:"authenticated",publicName:"authenticated",isSignal:!0,isRequired:!1,transformFunction:null}},outputs:{searchQuery:"searchQueryChange",authenticated:"authenticatedChange",actionClick:"actionClick",searchSubmit:"searchSubmit",searchSuggestionSelect:"searchSuggestionSelect",searchVoice:"searchVoice",notificationAction:"notificationAction",loginSubmit:"loginSubmit",logout:"logout",userLinkClick:"userLinkClick",navLinkClick:"navLinkClick"},host:{attributes:{role:"banner"},listeners:{mouseleave:"onHostLeave($event)","document:dga-close-header-overlays":"onCloseHeaderOverlays()","document:keydown":"onKey($event)","window:scroll":"onScroll()","window:resize":"onResize()","document:click":"onDocClick($event)"},properties:{class:"hostClasses()","attr.data-appearance":"appearance()","attr.data-mobile-nav":"mobileNav()","attr.data-mobile-open":"mobileOpen() || null"}},viewQueries:[{propertyName:"searchInputRef",first:!0,predicate:["searchInput"],descendants:!0,isSignal:!0},{propertyName:"utilLayerRef",first:!0,predicate:["utilLayer"],descendants:!0,isSignal:!0}],ngImport:a,template:`
+import*as i from"@angular/core";import{Directive as y,inject as g,ElementRef as B,input as n,booleanAttribute as I,model as w,output as u,signal as l,contentChild as M,Injector as Y,DOCUMENT as Q,DestroyRef as W,viewChild as P,computed as s,effect as L,untracked as z,afterNextRender as S,HostListener as b,ChangeDetectionStrategy as K,Component as G}from"@angular/core";import{APP_BASE_HREF as Z,PlatformLocation as X}from"@angular/common";import{dgaSafeHref as O,dgaCx as c,DgaAvatar as A,DgaBadge as E,DgaField as H,DgaFormControl as F,DgaFormEnd as $,DgaIcon as R,DgaIconBadge as j,DgaModal as q,DgaTooltip as V}from"@a.nemreen/dga-ui";function J(k,e="/"){if(typeof window>"u")return!1;const t=O(k.trim(),e);if(!t)return!1;try{const o=new URL(t,window.location.origin);return o.protocol!=="http:"&&o.protocol!=="https:"||o.origin!==window.location.origin?!1:(window.location.assign(`${o.pathname}${o.search}${o.hash}`),!0)}catch{return!1}}class h{static ɵfac=i.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:h,deps:[],target:i.ɵɵFactoryTarget.Directive});static ɵdir=i.ɵɵngDeclareDirective({minVersion:"14.0.0",version:"22.0.7",type:h,isStandalone:!0,selector:"[dgaHeaderLoginBeforeForm]",ngImport:i})}i.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:h,decorators:[{type:y,args:[{selector:"[dgaHeaderLoginBeforeForm]",standalone:!0}]}]});class x{static ɵfac=i.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:x,deps:[],target:i.ɵɵFactoryTarget.Directive});static ɵdir=i.ɵɵngDeclareDirective({minVersion:"14.0.0",version:"22.0.7",type:x,isStandalone:!0,selector:"[dgaHeaderLoginAfterFields]",ngImport:i})}i.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:x,decorators:[{type:y,args:[{selector:"[dgaHeaderLoginAfterFields]",standalone:!0}]}]});class p{static ɵfac=i.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:p,deps:[],target:i.ɵɵFactoryTarget.Directive});static ɵdir=i.ɵɵngDeclareDirective({minVersion:"14.0.0",version:"22.0.7",type:p,isStandalone:!0,selector:"[dgaHeaderLoginFooter]",ngImport:i})}i.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:p,decorators:[{type:y,args:[{selector:"[dgaHeaderLoginFooter]",standalone:!0}]}]});class m{static ɵfac=i.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:m,deps:[],target:i.ɵɵFactoryTarget.Directive});static ɵdir=i.ɵɵngDeclareDirective({minVersion:"14.0.0",version:"22.0.7",type:m,isStandalone:!0,selector:"[dgaHeaderLoginForm]",ngImport:i})}i.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:m,decorators:[{type:y,args:[{selector:"[dgaHeaderLoginForm]",standalone:!0}]}]});function ee(k,e){const t=k.trim();if(t.endsWith("rem")){const o=Number.parseFloat(t);return Number.isFinite(o)?o*16:e}if(t.endsWith("px")){const o=Number.parseFloat(t);return Number.isFinite(o)?o:e}return e}const T="group relative inline-flex h-(--size-header-portal) shrink-0 cursor-pointer items-center gap-md rounded-sm px-xl font-sans text-body-md font-medium text-fg hover:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",te="pointer-events-none absolute start-xl end-xl bottom-0 h-[5px] rounded-full",ie="inline-flex min-h-5xl w-full cursor-pointer flex-col justify-center gap-xxs rounded-sm px-xl py-sm text-start text-body-md font-normal text-fg transition-colors hover:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",oe="inline-flex min-h-11xl w-full cursor-pointer flex-col justify-center gap-xs rounded-md border border-border bg-card px-2xl py-xl text-start transition-colors hover:border-primary hover:bg-primary-faint focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",ae="relative flex min-h-7xl w-full cursor-pointer items-center gap-lg rounded-md px-xl py-md text-start text-body-md font-medium text-fg transition-colors hover:bg-neutral-light active:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus",ne="flex min-h-6xl w-full cursor-pointer flex-col justify-center gap-xxs rounded-md px-xl py-md text-start text-body-md text-fg transition-colors hover:bg-neutral-light active:bg-neutral-light focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-focus";class v{host=g(B);baseHref=g(Z,{optional:!0})??g(X).getBaseHrefFromDOM()??"/";closeTimer=null;dropdownSyncFrame=null;lastDropdownStyleKey="";collapseId="dga-nav-collapse";dropLink=ie;dropTile=oe;mobileLink=ne;brand=n("",...ngDevMode?[{debugName:"brand"}]:[]);brandSlogan=n("",...ngDevMode?[{debugName:"brandSlogan"}]:[]);brandLogo=n("",...ngDevMode?[{debugName:"brandLogo"}]:[]);brandLogoAlt=n("شعار الجهة",...ngDevMode?[{debugName:"brandLogoAlt"}]:[]);brandPlaceholder=n(!1,{...ngDevMode?{debugName:"brandPlaceholder"}:{},transform:I});brandHref=n("#",...ngDevMode?[{debugName:"brandHref"}]:[]);navLabel=n("التنقل الرئيسي",...ngDevMode?[{debugName:"navLabel"}]:[]);menuToggleLabel=n("فتح قائمة التنقل",...ngDevMode?[{debugName:"menuToggleLabel"}]:[]);menuCloseLabel=n("إغلاق قائمة التنقل",...ngDevMode?[{debugName:"menuCloseLabel"}]:[]);appearance=n("default",...ngDevMode?[{debugName:"appearance"}]:[]);mobileNav=n("sheet",...ngDevMode?[{debugName:"mobileNav"}]:[]);sticky=n(!0,{...ngDevMode?{debugName:"sticky"}:{},transform:I});items=n([],...ngDevMode?[{debugName:"items"}]:[]);actions=n([],...ngDevMode?[{debugName:"actions"}]:[]);search=n(null,...ngDevMode?[{debugName:"search"}]:[]);searchQuery=w("",...ngDevMode?[{debugName:"searchQuery"}]:[]);notifications=n(null,...ngDevMode?[{debugName:"notifications"}]:[]);login=n(null,...ngDevMode?[{debugName:"login"}]:[]);user=n(null,...ngDevMode?[{debugName:"user"}]:[]);authenticated=w(!1,...ngDevMode?[{debugName:"authenticated"}]:[]);loginSubmitting=w(!1,...ngDevMode?[{debugName:"loginSubmitting"}]:[]);loginError=w("",...ngDevMode?[{debugName:"loginError"}]:[]);actionClick=u();searchSubmit=u();searchSuggestionSelect=u();searchVoice=u();notificationAction=u();loginSubmit=u();logout=u();userLinkClick=u();navLinkClick=u();mobileOpen=l(!1,...ngDevMode?[{debugName:"mobileOpen"}]:[]);openDropdown=l(null,...ngDevMode?[{debugName:"openDropdown"}]:[]);searchOpen=l(!1,...ngDevMode?[{debugName:"searchOpen"}]:[]);notificationsOpen=l(!1,...ngDevMode?[{debugName:"notificationsOpen"}]:[]);loginOpen=l(!1,...ngDevMode?[{debugName:"loginOpen"}]:[]);userMenuOpen=l(!1,...ngDevMode?[{debugName:"userMenuOpen"}]:[]);voiceListening=l(!1,...ngDevMode?[{debugName:"voiceListening"}]:[]);expandedNotificationId=l(null,...ngDevMode?[{debugName:"expandedNotificationId"}]:[]);loginEmail=l("",...ngDevMode?[{debugName:"loginEmail"}]:[]);loginPassword=l("",...ngDevMode?[{debugName:"loginPassword"}]:[]);showLoginPassword=l(!1,...ngDevMode?[{debugName:"showLoginPassword"}]:[]);loginEmailError=l("",...ngDevMode?[{debugName:"loginEmailError"}]:[]);loginPasswordError=l("",...ngDevMode?[{debugName:"loginPasswordError"}]:[]);dropdownPanelStyle=l({},...ngDevMode?[{debugName:"dropdownPanelStyle"}]:[]);customLoginForm=M(m,...ngDevMode?[{debugName:"customLoginForm"}]:[]);customLoginFooter=M(p,...ngDevMode?[{debugName:"customLoginFooter"}]:[]);dismissedNotificationIds=l(new Set,...ngDevMode?[{debugName:"dismissedNotificationIds"}]:[]);readNotificationIds=l(new Set,...ngDevMode?[{debugName:"readNotificationIds"}]:[]);dropdownTrigger=null;dropdownActionId=null;injector=g(Y);doc=g(Q);destroyRef=g(W);searchInputRef=P("searchInput",...ngDevMode?[{debugName:"searchInputRef"}]:[]);utilLayerRef=P("utilLayer",...ngDevMode?[{debugName:"utilLayerRef"}]:[]);searchPanelId="dga-header-search-panel";notificationsPanelId="dga-header-notifications-panel";loginPanelId="dga-header-login-panel";userPanelId="dga-header-user-panel";isPortal=s(()=>this.appearance()==="portal",...ngDevMode?[{debugName:"isPortal"}]:[]);appHref(e){return O(e,this.baseHref)}searchConfig=s(()=>this.search(),...ngDevMode?[{debugName:"searchConfig"}]:[]);searchActionId=s(()=>this.search()?.actionId??"search",...ngDevMode?[{debugName:"searchActionId"}]:[]);notificationsConfig=s(()=>this.notifications(),...ngDevMode?[{debugName:"notificationsConfig"}]:[]);notificationsActionId=s(()=>this.notifications()?.actionId??"notifications",...ngDevMode?[{debugName:"notificationsActionId"}]:[]);loginConfig=s(()=>this.login(),...ngDevMode?[{debugName:"loginConfig"}]:[]);loginActionId=s(()=>this.login()?.actionId??"login",...ngDevMode?[{debugName:"loginActionId"}]:[]);userConfig=s(()=>this.user(),...ngDevMode?[{debugName:"userConfig"}]:[]);hasCustomLoginForm=s(()=>!!this.customLoginForm(),...ngDevMode?[{debugName:"hasCustomLoginForm"}]:[]);hasCustomLoginFooter=s(()=>!!this.customLoginFooter(),...ngDevMode?[{debugName:"hasCustomLoginFooter"}]:[]);utilityOverlayOpen=s(()=>this.notificationsOpen()||this.loginOpen()||this.userMenuOpen(),...ngDevMode?[{debugName:"utilityOverlayOpen"}]:[]);visibleNotifications=s(()=>{const e=this.notifications()?.items??[],t=this.dismissedNotificationIds(),o=this.readNotificationIds();return e.filter(a=>!t.has(a.id)).map(a=>({...a,read:!!a.read||o.has(a.id)}))},...ngDevMode?[{debugName:"visibleNotifications"}]:[]);unreadNotificationCount=s(()=>this.visibleNotifications().filter(e=>!e.read).length,...ngDevMode?[{debugName:"unreadNotificationCount"}]:[]);constructor(){this.destroyRef.onDestroy(()=>this.removePortaledUtilLayer()),L(()=>{this.mobileNav(),z(()=>{this.mobileOpen()&&this.closeAll()})}),L(()=>{if(!this.utilityOverlayOpen())return;this.utilLayerRef()?.nativeElement&&this.portalUtilLayer(),S(()=>this.portalUtilLayer(),{injector:this.injector})}),L(()=>{this.authenticated()&&this.loginOpen()&&z(()=>this.closeLogin())})}portalUtilLayer(){const e=this.utilLayerRef()?.nativeElement;!e||e.parentElement===this.doc.body||this.doc.body.appendChild(e)}removePortaledUtilLayer(){const e=this.utilLayerRef()?.nativeElement;e?.parentElement===this.doc.body&&e.remove()}activeWideDropdown=s(()=>{if(!this.hoverMenus()&&this.isMobileViewport())return null;const e=this.openDropdown();if(e===null)return null;const t=this.items()[e];if(!t?.dropdown)return null;const o=this.resolveVariant(t);return o==="menu"?null:{index:e,item:t,variant:o}},...ngDevMode?[{debugName:"activeWideDropdown"}]:[]);hostClasses=s(()=>c("relative z-header block overflow-visible border-b border-border-subtle bg-nav font-sans text-fg",this.sticky()&&"sticky top-0 shadow-md"),...ngDevMode?[{debugName:"hostClasses"}]:[]);innerClasses=s(()=>c("relative flex w-full gap-lg px-(--wrapper-padding)",this.appearance()==="default"&&"min-h-6xl items-center py-md",this.appearance()==="portal"&&"h-(--size-header-portal) items-stretch"),...ngDevMode?[{debugName:"innerClasses"}]:[]);desktopNavClasses=s(()=>c("min-w-0 flex-1",this.appearance()==="default"&&"flex flex-wrap items-center gap-lg self-center",this.appearance()==="portal"&&"hidden md:flex md:items-stretch"),...ngDevMode?[{debugName:"desktopNavClasses"}]:[]);actionsClasses=s(()=>c("ms-auto flex shrink-0 items-stretch empty:hidden",this.isPortal()&&this.items().length>0&&"max-md:hidden"),...ngDevMode?[{debugName:"actionsClasses"}]:[]);mobilePanelClass(){const e=this.mobileOpen(),t=this.mobileNav();return c("flex flex-col overflow-hidden bg-nav md:hidden",t==="sheet"&&"fixed top-0 bottom-0 end-0 z-20 w-[min(16rem,70vw)] max-w-[16rem] rounded-s-xl border-s border-border shadow-2xl",t==="fullscreen"&&"fixed inset-0 z-40 rounded-none border-0 shadow-none",t==="push"&&"absolute inset-x-0 top-full z-20 max-h-[min(70dvh,28rem)] border-b border-border shadow-lg",e?"dga-mobile-nav-open":"dga-mobile-nav-closed",e&&t==="sheet"&&"dga-mobile-sheet-open",e&&t==="fullscreen"&&"dga-mobile-fs-open",e&&t==="push"&&"dga-mobile-push-open")}hoverMenus(){return typeof matchMedia!="function"?!1:matchMedia("(hover: hover) and (pointer: fine)").matches}isMobileViewport(){return typeof matchMedia!="function"?!1:matchMedia("(max-width: 767px)").matches}resolveVariant(e){const t=e.dropdown;return t?t.variant?t.variant:t.featured?"featured":t.columns?.length||t.layout==="columns"||t.layout==="rows"?"mega":"menu":"menu"}resolveLayout(e){const t=e.dropdown;return t?t.layout?t.layout:t.columns?.length?"columns":"list":"list"}colCount(e){return e.dropdown?.columns?.length??0}flatLinks(e){const t=e.dropdown;return t?t.links?.length?t.links:t.columns?.flatMap(o=>o.links)??[]:[]}columnsGridClass(e){return c("grid w-full gap-2xl py-lg",e>1&&"sm:grid-cols-2",e>2&&"lg:grid-cols-3",e>3&&"xl:grid-cols-4")}featuredGridClass(e,t){return c("grid w-full gap-3xl",e==="featured"&&t&&"lg:grid-cols-[minmax(0,1fr)_minmax(14rem,18rem)]")}navItemClass(e,t=!1){return c(T,"justify-center",e&&"text-fg-primary",t&&"bg-neutral-light")}mobileItemClass(e,t=!1){return c(ae,e&&"bg-primary-faint",t&&"bg-neutral-light")}indicatorClass(e){return c(te,e?"bg-primary group-hover:bg-primary":"bg-transparent group-hover:bg-fg-disabled")}actionClass(e){return c(T,"relative justify-center")}badgeClass(){return c("dga-action-badge absolute top-lg end-md flex h-lg min-w-lg","items-center justify-center rounded-full bg-error px-xxs","text-body-2xs font-medium text-on-color")}isIconOnly(e){return e.iconOnly!==!1}isSearchAction(e){return!!this.search()&&e.id===this.searchActionId()}isNotificationsAction(e){return!!this.notifications()&&e.id===this.notificationsActionId()}isLoginAction(e){return!!this.login()&&e.id===this.loginActionId()}actionTooltip(e){return this.isLoginAction(e)&&this.authenticated()&&this.user()?.name||e.label}actionAriaLabel(e){return this.actionTooltip(e)}actionExpanded(e){return this.isSearchAction(e)?this.searchOpen():this.isNotificationsAction(e)?this.notificationsOpen():this.isLoginAction(e)?this.authenticated()?this.userMenuOpen():this.loginOpen():null}actionControls(e){return this.isSearchAction(e)?this.searchPanelId:this.isNotificationsAction(e)?this.notificationsPanelId:this.isLoginAction(e)?this.authenticated()?this.userPanelId:this.loginPanelId:null}actionIndicatorActive(e){return this.isSearchAction(e)?this.searchOpen():this.isNotificationsAction(e)?this.notificationsOpen():this.isLoginAction(e)?this.authenticated()?this.userMenuOpen():this.loginOpen():!1}clearCloseTimer(){this.closeTimer!==null&&(clearTimeout(this.closeTimer),this.closeTimer=null)}scheduleClose(){this.clearCloseTimer(),this.closeTimer=setTimeout(()=>{this.openDropdown.set(null),this.closeTimer=null},120)}setBodyScrollLocked(e){typeof document>"u"||document.documentElement.classList.toggle("dga-nav-locked",e)}unlockBodyIfIdle(){this.mobileOpen()||this.utilityOverlayOpen()||this.setBodyScrollLocked(!1)}onItemEnter(e){if(!this.isMobileViewport()){if(!this.items()[e]?.dropdown){this.hoverMenus()&&this.scheduleClose();return}this.clearCloseTimer(),this.hoverMenus()&&this.openDropdown.set(e)}}onPanelEnter(){this.clearCloseTimer()}onHostLeave(e){if(!this.hoverMenus()||this.isMobileViewport())return;const t=e.relatedTarget;t&&this.host.nativeElement.contains(t)||this.scheduleClose()}toggleMobile(){this.mobileOpen.update(e=>!e),this.openDropdown.set(null),this.setBodyScrollLocked(this.mobileOpen())}toggleDropdown(e,t){t.stopPropagation(),!(this.hoverMenus()&&!this.isMobileViewport()&&this.openDropdown()===e)&&(this.clearCloseTimer(),this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.openDropdown.update(o=>o===e?null:e))}closeAll(){this.clearCloseTimer(),this.openDropdown.set(null),this.mobileOpen.set(!1),this.closeSearch(!1),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.setBodyScrollLocked(!1)}onAction(e,t){const o=this.triggerFromEvent(t);if(this.isSearchAction(e)){this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.toggleSearch(),this.actionClick.emit(e);return}if(this.isNotificationsAction(e)){this.closeSearch(),this.closeLogin(),this.closeUserMenu(),this.toggleNotifications(o),this.actionClick.emit(e);return}if(this.isLoginAction(e)){this.closeSearch(),this.closeNotifications(),this.authenticated()?(this.closeLogin(),this.toggleUserMenu(o)):(this.closeUserMenu(),this.toggleLogin(o)),this.actionClick.emit(e);return}this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.actionClick.emit(e)}onMobileAction(e,t){const o=this.triggerFromEvent(t);if(this.isSearchAction(e)){this.mobileOpen.set(!1),this.setBodyScrollLocked(!1),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.toggleSearch(),this.actionClick.emit(e);return}if(this.isNotificationsAction(e)){this.mobileOpen.set(!1),this.closeSearch(),this.closeLogin(),this.closeUserMenu(),this.toggleNotifications(o),this.isMobileViewport()&&this.setBodyScrollLocked(!0),this.actionClick.emit(e);return}if(this.isLoginAction(e)){this.mobileOpen.set(!1),this.closeSearch(),this.closeNotifications(),this.authenticated()?(this.closeLogin(),this.toggleUserMenu(o)):(this.closeUserMenu(),this.toggleLogin(o)),this.isMobileViewport()&&this.setBodyScrollLocked(!0),this.actionClick.emit(e);return}this.actionClick.emit(e),this.closeAll()}closeUtilityOverlays(){this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closeUserMenu()}closePortalChromeMenus(){typeof document>"u"||document.dispatchEvent(new CustomEvent("dga-close-portal-chrome-menus"))}onCloseHeaderOverlays(){this.closeUtilityOverlays()}toggleSearch(){if(this.searchOpen()){this.closeSearch();return}this.openDropdown.set(null),this.closeNotifications(),this.closeLogin(),this.closeUserMenu(),this.closePortalChromeMenus(),this.searchOpen.set(!0)}onSearchModalOpenChange(e){if(e){this.searchOpen.set(!0);return}this.closeSearch()}focusSearchInput(){S(()=>this.searchInputRef()?.nativeElement.focus(),{injector:this.injector})}closeSearch(e=!0){this.searchOpen.set(!1),e&&this.stopVoice()}toggleNotifications(e){if(this.notificationsOpen()){this.closeNotifications();return}this.openDropdown.set(null),this.closeSearch(),this.closeLogin(),this.closeUserMenu(),this.closePortalChromeMenus(),this.notificationsOpen.set(!0);const t=this.visibleNotifications()[0];this.expandedNotificationId.set(t?.id??null),this.scheduleDropdownSync(this.notificationsActionId(),e),this.isMobileViewport()&&this.setBodyScrollLocked(!0)}closeNotifications(){this.notificationsOpen.set(!1),this.expandedNotificationId.set(null),this.clearDropdownAnchor(),this.unlockBodyIfIdle()}toggleLogin(e){if(this.loginOpen()){this.closeLogin();return}this.openDropdown.set(null),this.closeSearch(),this.closeNotifications(),this.closeUserMenu(),this.closePortalChromeMenus(),this.loginOpen.set(!0),this.scheduleDropdownSync(this.loginActionId(),e),this.isMobileViewport()&&this.setBodyScrollLocked(!0)}closeLogin(){this.loginOpen.set(!1),this.loginSubmitting.set(!1),this.loginError.set(""),this.loginEmailError.set(""),this.loginPasswordError.set(""),this.loginEmail.set(""),this.loginPassword.set(""),this.showLoginPassword.set(!1),this.clearDropdownAnchor(),this.unlockBodyIfIdle()}toggleUserMenu(e){if(this.userMenuOpen()){this.closeUserMenu();return}this.openDropdown.set(null),this.closeSearch(),this.closeNotifications(),this.closeLogin(),this.closePortalChromeMenus(),this.userMenuOpen.set(!0),this.scheduleDropdownSync(this.loginActionId(),e),this.isMobileViewport()&&this.setBodyScrollLocked(!0)}closeUserMenu(){this.userMenuOpen.set(!1),this.clearDropdownAnchor(),this.unlockBodyIfIdle()}onLoginEmailInput(e){this.loginEmail.set(e),this.loginEmailError()&&this.loginEmailError.set("")}onLoginPasswordInput(e){this.loginPassword.set(e),this.loginPasswordError()&&this.loginPasswordError.set("")}showLoginRegisterRow(e){return!!(e.registerPrompt||e.registerLabel||e.registerHref)}loginPanelOuterStyle(){const e=this.dropdownPanelStyle();if(this.isMobileViewport())return e;const t=this.loginConfig()?.panelWidth??"24rem";return{...e,width:`min(${t}, calc(100vw - 2rem))`}}loginPanelInnerStyle(){return this.isMobileViewport()?{maxHeight:`min(90svh, ${this.loginConfig()?.maxHeight??"44rem"})`}:{}}onLoginSubmit(e){e.preventDefault();const t=this.loginConfig(),o=this.loginEmail().trim(),a=this.loginPassword();this.loginEmailError.set(""),this.loginPasswordError.set(""),this.loginError.set("");let r=!1;o?/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(o)||(this.loginEmailError.set(t?.emailInvalidMessage??"Enter a valid email address"),r=!0):(this.loginEmailError.set(t?.emailRequiredMessage??"Email is required"),r=!0),a||(this.loginPasswordError.set(t?.passwordRequiredMessage??"Password is required"),r=!0),!r&&(this.loginSubmitting.set(!0),this.loginSubmit.emit({email:o,password:a}))}onUserLink(e){if(this.userLinkClick.emit(e),e.id==="logout"||e.danger){this.authenticated.set(!1),this.logout.emit(),this.closeUserMenu();return}this.closeUserMenu()}toggleNotificationExpand(e){this.expandedNotificationId.update(t=>t===e.id?null:e.id),this.notificationAction.emit({item:e,action:"select"})}onNotificationAction(e,t){t==="read"&&this.readNotificationIds.update(o=>new Set([...o,e.id])),t==="dismiss"&&(this.dismissedNotificationIds.update(o=>new Set([...o,e.id])),this.expandedNotificationId.update(o=>o===e.id?null:o)),t==="view"&&e.href&&J(e.href,this.baseHref),this.notificationAction.emit({item:e,action:t})}markAllNotificationsRead(){const e=this.visibleNotifications().map(t=>t.id);this.readNotificationIds.update(t=>new Set([...t,...e]))}clearSearchQuery(){this.searchQuery.set(""),queueMicrotask(()=>this.searchInputRef()?.nativeElement.focus())}applySearchSuggestion(e){const t=e.value??e.label;this.searchQuery.set(t),this.searchSuggestionSelect.emit(e),queueMicrotask(()=>this.searchInputRef()?.nativeElement.focus())}onSearchFormSubmit(e){e.preventDefault();const t=this.searchQuery().trim();this.searchSubmit.emit(t);const o=this.search();if(o?.resultsHref){const a=o.queryParam??"q",r=new URL(o.resultsHref,typeof window<"u"?window.location.origin:"http://localhost");t?r.searchParams.set(a,t):r.searchParams.delete(a),typeof window<"u"&&window.location.assign(`${r.pathname}${r.search}${r.hash}`)}this.closeSearch()}onSearchVoice(){if(this.searchVoice.emit(),typeof window>"u")return;const e=window,t=e.SpeechRecognition||e.webkitSpeechRecognition;if(!t)return;this.stopVoice();const o=new t;o.lang=typeof document<"u"&&document.documentElement.lang?document.documentElement.lang:"ar-SA",o.interimResults=!1,o.maxAlternatives=1,this.voiceListening.set(!0),o.onresult=a=>{const r=a.results[0]?.[0]?.transcript?.trim();r&&this.searchQuery.set(r),this.voiceListening.set(!1)},o.onerror=()=>this.voiceListening.set(!1),o.onend=()=>this.voiceListening.set(!1),this.speechRecognition=o,o.start()}speechRecognition=null;stopVoice(){this.speechRecognition?.stop(),this.speechRecognition=null,this.voiceListening.set(!1)}triggerFromEvent(e){const t=e?.currentTarget;return t instanceof HTMLElement?t:null}scheduleDropdownSync(e,t){this.dropdownActionId=e,this.dropdownTrigger=t??null,S(()=>this.requestDropdownSync(t),{injector:this.injector})}requestDropdownSync(e){if(typeof requestAnimationFrame!="function"){this.syncDropdownPanel(e);return}this.dropdownSyncFrame===null&&(this.dropdownSyncFrame=requestAnimationFrame(()=>{this.dropdownSyncFrame=null,this.syncDropdownPanel(e)}))}clearDropdownAnchor(){this.notificationsOpen()||this.loginOpen()||this.userMenuOpen()||(this.dropdownTrigger=null,this.dropdownActionId=null,this.lastDropdownStyleKey="",this.dropdownPanelStyle.set({}))}findActionTrigger(e){const t=this.host.nativeElement.querySelectorAll(`[data-dga-action="${CSS.escape(e)}"]`);for(const o of Array.from(t)){const a=o;if(a.getClientRects().length>0)return a}return t[0]??null}activeUtilityPanelWidthPx(){if(typeof window>"u")return 448;const e=window.innerWidth-32;if(this.loginOpen()){const t=this.loginConfig()?.panelWidth??"24rem";return Math.min(ee(t,384),e)}return this.userMenuOpen()?Math.min(352,e):(this.notificationsOpen(),Math.min(448,e))}syncDropdownPanel(e){if(typeof window>"u")return;if(this.isMobileViewport()){const d={top:"auto",bottom:"max(0.75rem, env(safe-area-inset-bottom, 0px))",left:"0.75rem",right:"0.75rem",width:"auto",maxWidth:"none"},D=`sheet|${d.bottom}`;if(D===this.lastDropdownStyleKey)return;this.lastDropdownStyleKey=D,this.dropdownPanelStyle.set(d);return}const t=e??this.dropdownTrigger??(this.dropdownActionId?this.findActionTrigger(this.dropdownActionId):null);if(!t)return;this.dropdownTrigger=t;const o=t.getBoundingClientRect();if(o.width<1&&o.height<1)return;const a=getComputedStyle(this.host.nativeElement).direction,U=(typeof document<"u"?document.documentElement.getAttribute("dir"):null)==="rtl"||a==="rtl",_=8,N=this.activeUtilityPanelWidthPx(),f={top:`${Math.round(o.bottom+_)}px`};if(U){let d=Math.round(o.left);d=Math.max(16,Math.min(d,window.innerWidth-N-16)),f.left=`${d}px`,f.right="auto"}else{let d=Math.round(window.innerWidth-o.right);d=Math.max(16,Math.min(d,window.innerWidth-N-16)),f.right=`${d}px`,f.left="auto"}const C=`${f.top}|${f.left??""}|${f.right??""}`;C!==this.lastDropdownStyleKey&&(this.lastDropdownStyleKey=C,this.dropdownPanelStyle.set(f))}onKey(e){e.key==="Escape"&&this.closeAll()}onScroll(){(this.notificationsOpen()||this.loginOpen()||this.userMenuOpen())&&this.requestDropdownSync()}onResize(){typeof window>"u"||(window.matchMedia("(max-width: 767px)").matches||(this.mobileOpen.set(!1),this.setBodyScrollLocked(!1)),(this.notificationsOpen()||this.loginOpen()||this.userMenuOpen())&&(this.lastDropdownStyleKey="",this.requestDropdownSync()))}onNavLinkClick(e,t){this.navLinkClick.emit(e),e.href||t.preventDefault()}onDocClick(e){this.searchOpen()||this.notificationsOpen()||this.loginOpen()||this.userMenuOpen()||this.hoverMenus()&&!this.isMobileViewport()||this.mobileOpen()||this.host.nativeElement.contains(e.target)||this.openDropdown.set(null)}static ɵfac=i.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:v,deps:[],target:i.ɵɵFactoryTarget.Component});static ɵcmp=i.ɵɵngDeclareComponent({minVersion:"17.0.0",version:"22.0.7",type:v,isStandalone:!0,selector:"dga-header",inputs:{brand:{classPropertyName:"brand",publicName:"brand",isSignal:!0,isRequired:!1,transformFunction:null},brandSlogan:{classPropertyName:"brandSlogan",publicName:"brandSlogan",isSignal:!0,isRequired:!1,transformFunction:null},brandLogo:{classPropertyName:"brandLogo",publicName:"brandLogo",isSignal:!0,isRequired:!1,transformFunction:null},brandLogoAlt:{classPropertyName:"brandLogoAlt",publicName:"brandLogoAlt",isSignal:!0,isRequired:!1,transformFunction:null},brandPlaceholder:{classPropertyName:"brandPlaceholder",publicName:"brandPlaceholder",isSignal:!0,isRequired:!1,transformFunction:null},brandHref:{classPropertyName:"brandHref",publicName:"brandHref",isSignal:!0,isRequired:!1,transformFunction:null},navLabel:{classPropertyName:"navLabel",publicName:"navLabel",isSignal:!0,isRequired:!1,transformFunction:null},menuToggleLabel:{classPropertyName:"menuToggleLabel",publicName:"menuToggleLabel",isSignal:!0,isRequired:!1,transformFunction:null},menuCloseLabel:{classPropertyName:"menuCloseLabel",publicName:"menuCloseLabel",isSignal:!0,isRequired:!1,transformFunction:null},appearance:{classPropertyName:"appearance",publicName:"appearance",isSignal:!0,isRequired:!1,transformFunction:null},mobileNav:{classPropertyName:"mobileNav",publicName:"mobileNav",isSignal:!0,isRequired:!1,transformFunction:null},sticky:{classPropertyName:"sticky",publicName:"sticky",isSignal:!0,isRequired:!1,transformFunction:null},items:{classPropertyName:"items",publicName:"items",isSignal:!0,isRequired:!1,transformFunction:null},actions:{classPropertyName:"actions",publicName:"actions",isSignal:!0,isRequired:!1,transformFunction:null},search:{classPropertyName:"search",publicName:"search",isSignal:!0,isRequired:!1,transformFunction:null},searchQuery:{classPropertyName:"searchQuery",publicName:"searchQuery",isSignal:!0,isRequired:!1,transformFunction:null},notifications:{classPropertyName:"notifications",publicName:"notifications",isSignal:!0,isRequired:!1,transformFunction:null},login:{classPropertyName:"login",publicName:"login",isSignal:!0,isRequired:!1,transformFunction:null},user:{classPropertyName:"user",publicName:"user",isSignal:!0,isRequired:!1,transformFunction:null},authenticated:{classPropertyName:"authenticated",publicName:"authenticated",isSignal:!0,isRequired:!1,transformFunction:null},loginSubmitting:{classPropertyName:"loginSubmitting",publicName:"loginSubmitting",isSignal:!0,isRequired:!1,transformFunction:null},loginError:{classPropertyName:"loginError",publicName:"loginError",isSignal:!0,isRequired:!1,transformFunction:null}},outputs:{searchQuery:"searchQueryChange",authenticated:"authenticatedChange",loginSubmitting:"loginSubmittingChange",loginError:"loginErrorChange",actionClick:"actionClick",searchSubmit:"searchSubmit",searchSuggestionSelect:"searchSuggestionSelect",searchVoice:"searchVoice",notificationAction:"notificationAction",loginSubmit:"loginSubmit",logout:"logout",userLinkClick:"userLinkClick",navLinkClick:"navLinkClick"},host:{attributes:{role:"banner"},listeners:{mouseleave:"onHostLeave($event)","document:dga-close-header-overlays":"onCloseHeaderOverlays()","document:keydown":"onKey($event)","window:scroll":"onScroll()","window:resize":"onResize()","document:click":"onDocClick($event)"},properties:{class:"hostClasses()","attr.data-appearance":"appearance()","attr.data-mobile-nav":"mobileNav()","attr.data-mobile-open":"mobileOpen() || null"}},queries:[{propertyName:"customLoginForm",first:!0,predicate:m,descendants:!0,isSignal:!0},{propertyName:"customLoginFooter",first:!0,predicate:p,descendants:!0,isSignal:!0}],viewQueries:[{propertyName:"searchInputRef",first:!0,predicate:["searchInput"],descendants:!0,isSignal:!0},{propertyName:"utilLayerRef",first:!0,predicate:["utilLayer"],descendants:!0,isSignal:!0}],ngImport:i,template:`
     <div [class]="innerClasses()">
       <div class="relative flex min-w-0 shrink-0 items-center self-center">
         <ng-content select="[dgaHeaderBrand]" />
@@ -733,16 +733,17 @@ import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,bo
     @if (loginOpen() && loginConfig(); as lcfg) {
       <div
         [id]="loginPanelId"
-        class="dga-header-util-panel fixed w-[min(24rem,calc(100vw-2rem))] max-md:inset-x-3
-               max-md:bottom-3 max-md:top-auto max-md:w-auto"
+        class="dga-header-util-panel fixed max-md:inset-x-3 max-md:bottom-3 max-md:top-auto
+               max-md:w-auto"
         role="dialog"
         [attr.aria-label]="lcfg.title || 'Login'"
-        [style]="dropdownPanelStyle()"
+        [style]="loginPanelOuterStyle()"
       >
         <div
-          class="dga-panel-enter dga-panel-enter--anchor-end max-h-[min(90svh,44rem)]
-                 overflow-y-auto overscroll-contain rounded-2xl border border-border bg-card
-                 shadow-xl md:max-h-[none] md:overflow-visible md:rounded-md"
+          class="dga-panel-enter dga-panel-enter--anchor-end overflow-y-auto overscroll-contain
+                 rounded-2xl border border-border bg-card shadow-xl md:overflow-visible
+                 md:rounded-md"
+          [style]="loginPanelInnerStyle()"
         >
           <div class="flex items-start justify-between gap-md px-2xl pt-2xl max-md:pt-xl">
             <div class="flex min-w-0 flex-col gap-xs">
@@ -766,115 +767,181 @@ import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,bo
             </button>
           </div>
 
-          <form
-            class="flex flex-col gap-xl px-2xl pb-[max(1.5rem,env(safe-area-inset-bottom))]
-                   pt-xl md:pb-2xl"
-            (submit)="onLoginSubmit($event)"
-          >
-            <dga-field
-              [label]="lcfg.emailLabel || 'Email'"
-              controlId="dga-header-login-email"
-              [hint]="lcfg.emailHint || ''"
-              required
-            >
-              <dga-form-control startIcon="mail" [filled]="!!loginEmail()">
-                <input
-                  id="dga-header-login-email"
-                  type="email"
-                  name="email"
-                  autocomplete="username"
-                  required
-                  class="placeholder:text-muted"
-                  [placeholder]="lcfg.emailPlaceholder || 'name@example.gov.sa'"
-                  [value]="loginEmail()"
-                  (input)="loginEmail.set($any($event.target).value)"
-                />
-              </dga-form-control>
-            </dga-field>
+          <ng-content select="[dgaHeaderLoginBeforeForm]" />
 
-            <dga-field
-              [label]="lcfg.passwordLabel || 'Password'"
-              controlId="dga-header-login-password"
-              [hint]="lcfg.passwordHint || ''"
-              required
+          @if (hasCustomLoginForm()) {
+            <div
+              class="px-2xl pb-[max(1.5rem,env(safe-area-inset-bottom))] pt-xl md:pb-2xl"
             >
-              <dga-form-control [filled]="!!loginPassword()">
-                <input
-                  id="dga-header-login-password"
-                  [type]="showLoginPassword() ? 'text' : 'password'"
-                  name="password"
-                  autocomplete="current-password"
-                  required
-                  class="placeholder:text-muted"
-                  [placeholder]="lcfg.passwordPlaceholder || 'Enter your password'"
-                  [value]="loginPassword()"
-                  (input)="loginPassword.set($any($event.target).value)"
-                />
-                <button
-                  type="button"
-                  dgaEnd
-                  [attr.aria-label]="
-                    showLoginPassword()
-                      ? lcfg.hidePasswordLabel || 'Hide password'
-                      : lcfg.showPasswordLabel || 'Show password'
-                  "
-                  (click)="showLoginPassword.set(!showLoginPassword())"
-                >
-                  <dga-icon [name]="showLoginPassword() ? 'eyeOff' : 'eye'" size="sm" />
-                </button>
-              </dga-form-control>
-            </dga-field>
-
-            @if (lcfg.forgotPasswordHref || lcfg.forgotPasswordLabel) {
-              <a
-                class="self-start text-body-sm font-medium text-fg-primary transition-opacity
-                       hover:opacity-80
-                       focus-visible:outline focus-visible:outline-2
-                       focus-visible:outline-offset-2 focus-visible:outline-focus"
-                [href]="appHref(lcfg.forgotPasswordHref || '#')"
+              <ng-content select="[dgaHeaderLoginForm]" />
+            </div>
+          } @else {
+            <form
+              class="flex flex-col gap-xl px-2xl pb-[max(1.5rem,env(safe-area-inset-bottom))]
+                     pt-xl md:pb-2xl"
+              (submit)="onLoginSubmit($event)"
+            >
+              <dga-field
+                [label]="lcfg.emailLabel || 'Email'"
+                controlId="dga-header-login-email"
+                [hint]="loginEmailError() ? '' : lcfg.emailHint || ''"
+                [error]="loginEmailError()"
+                required
               >
-                {{ lcfg.forgotPasswordLabel || 'Forgot password?' }}
-              </a>
-            }
+                <dga-form-control startIcon="mail" [filled]="!!loginEmail()">
+                  <input
+                    id="dga-header-login-email"
+                    type="email"
+                    name="email"
+                    autocomplete="username"
+                    required
+                    class="placeholder:text-muted"
+                    [placeholder]="lcfg.emailPlaceholder || 'name@example.gov.sa'"
+                    [value]="loginEmail()"
+                    (input)="onLoginEmailInput($any($event.target).value)"
+                  />
+                </dga-form-control>
+              </dga-field>
 
-            <div class="flex flex-col gap-md pt-xs">
-              <button
-                type="submit"
-                class="inline-flex h-5xl w-full cursor-pointer items-center justify-center gap-sm
-                       rounded-sm bg-primary px-xl text-body-md font-medium text-on-color shadow-sm
-                       transition-opacity hover:opacity-90 disabled:cursor-wait disabled:opacity-60
-                       focus-visible:outline focus-visible:outline-2
-                       focus-visible:outline-offset-2 focus-visible:outline-focus"
-                [disabled]="loginSubmitting()"
+              <dga-field
+                [label]="lcfg.passwordLabel || 'Password'"
+                controlId="dga-header-login-password"
+                [hint]="loginPasswordError() ? '' : lcfg.passwordHint || ''"
+                [error]="loginPasswordError()"
+                required
               >
-                @if (loginSubmitting()) {
-                  <span
-                    class="dga-login-spinner size-md rounded-full border-2 border-on-color/30
-                           border-t-on-color"
-                    aria-hidden="true"
-                  ></span>
+                <dga-form-control [filled]="!!loginPassword()">
+                  <input
+                    id="dga-header-login-password"
+                    [type]="showLoginPassword() ? 'text' : 'password'"
+                    name="password"
+                    autocomplete="current-password"
+                    required
+                    class="placeholder:text-muted"
+                    [placeholder]="lcfg.passwordPlaceholder || 'Enter your password'"
+                    [value]="loginPassword()"
+                    (input)="onLoginPasswordInput($any($event.target).value)"
+                  />
+                  <button
+                    type="button"
+                    dgaEnd
+                    [attr.aria-label]="
+                      showLoginPassword()
+                        ? lcfg.hidePasswordLabel || 'Hide password'
+                        : lcfg.showPasswordLabel || 'Show password'
+                    "
+                    (click)="showLoginPassword.set(!showLoginPassword())"
+                  >
+                    <dga-icon [name]="showLoginPassword() ? 'eyeOff' : 'eye'" size="sm" />
+                  </button>
+                </dga-form-control>
+              </dga-field>
+
+              @if (lcfg.forgotPasswordHref || lcfg.forgotPasswordLabel) {
+                <a
+                  class="self-start text-body-sm font-medium text-fg-primary transition-opacity
+                         hover:opacity-80
+                         focus-visible:outline focus-visible:outline-2
+                         focus-visible:outline-offset-2 focus-visible:outline-focus"
+                  [href]="appHref(lcfg.forgotPasswordHref || '#')"
+                >
+                  {{ lcfg.forgotPasswordLabel || 'Forgot password?' }}
+                </a>
+              }
+
+              <ng-content select="[dgaHeaderLoginAfterFields]" />
+
+              @if (loginError() || lcfg.errorMessage) {
+                <p class="m-0 text-body-sm text-fg-error" role="alert">
+                  {{ loginError() || lcfg.errorMessage }}
+                </p>
+              }
+
+              <div class="flex flex-col gap-md pt-xs">
+                <button
+                  type="submit"
+                  class="inline-flex h-5xl w-full cursor-pointer items-center justify-center gap-sm
+                         rounded-sm bg-primary px-xl text-body-md font-medium text-on-color shadow-sm
+                         transition-opacity hover:opacity-90 disabled:cursor-wait disabled:opacity-60
+                         focus-visible:outline focus-visible:outline-2
+                         focus-visible:outline-offset-2 focus-visible:outline-focus"
+                  [disabled]="loginSubmitting()"
+                >
+                  @if (loginSubmitting()) {
+                    <span
+                      class="dga-login-spinner size-md rounded-full border-2 border-on-color/30
+                             border-t-on-color"
+                      aria-hidden="true"
+                    ></span>
+                  }
+                  <span>
+                    {{
+                      loginSubmitting()
+                        ? lcfg.submittingLabel || '…'
+                        : lcfg.submitLabel || 'Login'
+                    }}
+                  </span>
+                </button>
+                @if (lcfg.showCancel !== false) {
+                  <button
+                    type="button"
+                    class="inline-flex h-5xl w-full cursor-pointer items-center justify-center
+                           rounded-sm px-xl text-body-md font-medium text-fg transition-colors
+                           hover:bg-neutral-light
+                           focus-visible:outline focus-visible:outline-2
+                           focus-visible:outline-offset-2 focus-visible:outline-focus"
+                    (click)="closeLogin()"
+                  >
+                    {{ lcfg.cancelLabel || 'Cancel' }}
+                  </button>
                 }
-                <span>
-                  {{
-                    loginSubmitting()
-                      ? '\u2026'
-                      : lcfg.submitLabel || 'Login'
-                  }}
-                </span>
-              </button>
-              <button
-                type="button"
-                class="inline-flex h-5xl w-full cursor-pointer items-center justify-center
-                       rounded-sm px-xl text-body-md font-medium text-fg transition-colors
-                       hover:bg-neutral-light
-                       focus-visible:outline focus-visible:outline-2
-                       focus-visible:outline-offset-2 focus-visible:outline-focus"
-                (click)="closeLogin()"
-              >
-                {{ lcfg.cancelLabel || 'Cancel' }}
-              </button>
+              </div>
+            </form>
+          }
+
+          @if (hasCustomLoginFooter()) {
+            <div
+              class="border-t border-border-subtle px-2xl py-xl pb-[max(1.5rem,env(safe-area-inset-bottom))]"
+            >
+              <ng-content select="[dgaHeaderLoginFooter]" />
             </div>
-          </form>
+          } @else if (showLoginRegisterRow(lcfg) || (lcfg.footerLinks?.length ?? 0) > 0) {
+            <div
+              class="flex flex-col gap-md border-t border-border-subtle px-2xl py-xl
+                     pb-[max(1.5rem,env(safe-area-inset-bottom))]"
+            >
+              @if (showLoginRegisterRow(lcfg)) {
+                <p class="m-0 text-center text-body-sm text-muted">
+                  {{ lcfg.registerPrompt || "Don't have an account?" }}
+                  @if (lcfg.registerLabel || lcfg.registerHref) {
+                    <a
+                      class="ms-xs font-medium text-fg-primary transition-opacity hover:opacity-80
+                             focus-visible:outline focus-visible:outline-2
+                             focus-visible:outline-offset-2 focus-visible:outline-focus"
+                      [href]="appHref(lcfg.registerHref || '#')"
+                    >
+                      {{ lcfg.registerLabel || 'Sign up' }}
+                    </a>
+                  }
+                </p>
+              }
+              @if (lcfg.footerLinks?.length) {
+                <div class="flex flex-col gap-xs">
+                  @for (link of lcfg.footerLinks; track link.id ?? link.label) {
+                    <a
+                      class="text-center text-body-sm font-medium text-fg-primary transition-opacity
+                             hover:opacity-80
+                             focus-visible:outline focus-visible:outline-2
+                             focus-visible:outline-offset-2 focus-visible:outline-focus"
+                      [href]="appHref(link.href || '#')"
+                    >
+                      {{ link.label }}
+                    </a>
+                  }
+                </div>
+              }
+            </div>
+          }
         </div>
       </div>
     }
@@ -1238,8 +1305,7 @@ import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,bo
         }
       </div>
     }
-  `,isInline:!0,styles:[`@keyframes dga-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dga-panel-in{0%{opacity:0;transform:translateY(-.625rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes dga-chip-in{0%{opacity:0;transform:translateY(.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-notif-row-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-expand-fade{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-spin{to{transform:rotate(360deg)}}@keyframes dga-badge-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}@keyframes dga-push-in{0%{opacity:0;transform:translateY(-.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in-ltr{0%{opacity:.85;transform:translate3d(-100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-sheet-in-rtl{0%{opacity:.85;transform:translate3d(100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-fs-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in{0%{opacity:0;transform:translateY(1.25rem)}to{opacity:1;transform:translateY(0)}}:host .dga-util-backdrop,.dga-header-util-layer .dga-util-backdrop{animation:dga-fade-in .22s ease both}.dga-header-util-layer{position:fixed;inset:0;z-index:var(--z-index-urgent, 400);pointer-events:none}.dga-header-util-layer>.dga-util-backdrop,.dga-header-util-layer>.dga-header-util-panel{pointer-events:auto}:host .dga-panel-enter,.dga-header-util-layer .dga-panel-enter{animation:dga-panel-in .28s cubic-bezier(.16,1,.3,1) both;transform-origin:top center;will-change:transform,opacity}:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top right}:host-context([dir="rtl"]) .dga-panel-enter--anchor-end,:host([dir="rtl"]) .dga-panel-enter--anchor-end,:host-context([dir="rtl"]) .dga-header-util-layer .dga-panel-enter--anchor-end,[dir=rtl] .dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top left}@media(max-width:767px){:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{animation-name:dga-sheet-in;transform-origin:bottom center}}:host .dga-search-chip{animation:dga-chip-in .28s cubic-bezier(.16,1,.3,1) both}:host .dga-search-input{-webkit-appearance:none;appearance:none}:host .dga-search-input::-webkit-search-decoration,:host .dga-search-input::-webkit-search-cancel-button,:host .dga-search-input::-webkit-search-results-button,:host .dga-search-input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none;display:none}:host .dga-search-voice.dga-search-voice--active{color:var(--dga-text-primary, #1b8354)!important;background:var(--dga-bg-primary-faint, #f3faf6)!important}:host .dga-notif-item,.dga-header-util-layer .dga-notif-item{animation:dga-notif-row-in .26s cubic-bezier(.16,1,.3,1) both}:host .dga-notif-actions,.dga-header-util-layer .dga-notif-actions{animation:dga-expand-fade .2s ease both}:host .dga-login-spinner,.dga-header-util-layer .dga-login-spinner{animation:dga-spin .7s linear infinite}:host .dga-action-badge{animation:dga-badge-pulse 1.8s ease-in-out infinite;transform-origin:center}@media(prefers-reduced-motion:reduce){:host .dga-util-backdrop,:host .dga-panel-enter,:host .dga-search-chip,:host .dga-notif-item,:host .dga-notif-actions,.dga-header-util-layer .dga-util-backdrop,.dga-header-util-layer .dga-panel-enter{animation-duration:.01ms!important;animation-delay:0ms!important}}:host .dga-burger__box{position:relative;display:block;width:1.375rem;height:1rem}:host .dga-burger__line{position:absolute;inset-inline:0;height:2px;border-radius:1px;background:currentColor;transition:transform .22s cubic-bezier(.4,0,.2,1),opacity .16s ease,top .22s cubic-bezier(.4,0,.2,1)}:host .dga-burger__line:nth-child(1){top:0}:host .dga-burger__line:nth-child(2){top:calc(50% - 1px)}:host .dga-burger__line:nth-child(3){top:calc(100% - 2px)}:host .dga-burger--open{background:var(--color-neutral-light, #f3f4f6)}:host .dga-burger--hidden{visibility:hidden;pointer-events:none}:host .dga-burger--open .dga-burger__line:nth-child(1){top:calc(50% - 1px);transform:rotate(45deg)}:host .dga-burger--open .dga-burger__line:nth-child(2){opacity:0;transform:scaleX(.4)}:host .dga-burger--open .dga-burger__line:nth-child(3){top:calc(50% - 1px);transform:rotate(-45deg)}:host .dga-mobile-nav-closed{display:none}:host .dga-mobile-nav-open{display:flex}:host .dga-mobile-push-open{animation:dga-push-in .24s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-sheet-open{animation:dga-sheet-in-rtl .28s cubic-bezier(.4,0,.2,1) forwards}:host-context([dir="rtl"]) .dga-mobile-sheet-open{animation:dga-sheet-in-ltr .28s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-fs-open{animation:dga-fs-in .24s cubic-bezier(.4,0,.2,1) forwards}@media(prefers-reduced-motion:reduce){:host .dga-action-badge,:host .dga-mobile-push-open,:host .dga-mobile-sheet-open,:host .dga-mobile-fs-open,:host-context([dir="rtl"]) .dga-mobile-sheet-open,:host .dga-burger__line{animation:none;transition:none}}
-`],dependencies:[{kind:"component",type:S,selector:"dga-avatar",inputs:["src","name","size","alt"]},{kind:"component",type:C,selector:"dga-badge",inputs:["variant","size"]},{kind:"component",type:D,selector:"dga-field",inputs:["label","labelHint","hint","error","status","statusMessage","controlId","required"]},{kind:"component",type:I,selector:"dga-form-control",inputs:["size","status","disabled","filled","startIcon","endIcon"]},{kind:"directive",type:z,selector:"[dgaEnd]"},{kind:"component",type:M,selector:"dga-icon",inputs:["name","glyph","size","tone","label"]},{kind:"component",type:A,selector:"dga-icon-badge",inputs:["size","appearance"]},{kind:"component",type:P,selector:"dga-modal",inputs:["open","title","description","size","animation","closeLabel","closeOnBackdrop","closeOnEscape","showClose","scrollable","centered"],outputs:["openChange","closed","opened"]},{kind:"component",type:O,selector:"dga-tooltip",inputs:["text","title","placement","variant","showIcon","disabled","showDelay","hideDelay","dismissMs"]}],changeDetection:a.ChangeDetectionStrategy.OnPush})}a.\u0275\u0275ngDeclareClassMetadata({minVersion:"12.0.0",version:"22.0.7",ngImport:a,type:g,decorators:[{type:V,args:[{selector:"dga-header",standalone:!0,changeDetection:F.OnPush,imports:[S,C,D,I,z,M,A,P,O],template:`
+  `,isInline:!0,styles:["@keyframes dga-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dga-panel-in{0%{opacity:0;transform:translateY(-.625rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes dga-chip-in{0%{opacity:0;transform:translateY(.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-notif-row-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-expand-fade{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-spin{to{transform:rotate(360deg)}}@keyframes dga-badge-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}@keyframes dga-push-in{0%{opacity:0;transform:translateY(-.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in-ltr{0%{opacity:.85;transform:translate3d(-100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-sheet-in-rtl{0%{opacity:.85;transform:translate3d(100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-fs-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in{0%{opacity:0;transform:translateY(1.25rem)}to{opacity:1;transform:translateY(0)}}:host .dga-util-backdrop,.dga-header-util-layer .dga-util-backdrop{animation:dga-fade-in .22s ease both}.dga-header-util-layer{position:fixed;inset:0;z-index:var(--z-index-urgent, 400);pointer-events:none}.dga-header-util-layer>.dga-util-backdrop,.dga-header-util-layer>.dga-header-util-panel{pointer-events:auto}:host .dga-panel-enter,.dga-header-util-layer .dga-panel-enter{animation:dga-panel-in .28s cubic-bezier(.16,1,.3,1) both;transform-origin:top center;will-change:transform,opacity}:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top right}:host-context([dir=\"rtl\"]) .dga-panel-enter--anchor-end,:host([dir=\"rtl\"]) .dga-panel-enter--anchor-end,:host-context([dir=\"rtl\"]) .dga-header-util-layer .dga-panel-enter--anchor-end,[dir=rtl] .dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top left}@media(max-width:767px){:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{animation-name:dga-sheet-in;transform-origin:bottom center}}:host .dga-search-chip{animation:dga-chip-in .28s cubic-bezier(.16,1,.3,1) both}:host .dga-search-input{-webkit-appearance:none;appearance:none}:host .dga-search-input::-webkit-search-decoration,:host .dga-search-input::-webkit-search-cancel-button,:host .dga-search-input::-webkit-search-results-button,:host .dga-search-input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none;display:none}:host .dga-search-voice.dga-search-voice--active{color:var(--dga-text-primary, #1b8354)!important;background:var(--dga-bg-primary-faint, #f3faf6)!important}:host .dga-notif-item,.dga-header-util-layer .dga-notif-item{animation:dga-notif-row-in .26s cubic-bezier(.16,1,.3,1) both}:host .dga-notif-actions,.dga-header-util-layer .dga-notif-actions{animation:dga-expand-fade .2s ease both}:host .dga-login-spinner,.dga-header-util-layer .dga-login-spinner{animation:dga-spin .7s linear infinite}:host .dga-action-badge{animation:dga-badge-pulse 1.8s ease-in-out infinite;transform-origin:center}@media(prefers-reduced-motion:reduce){:host .dga-util-backdrop,:host .dga-panel-enter,:host .dga-search-chip,:host .dga-notif-item,:host .dga-notif-actions,.dga-header-util-layer .dga-util-backdrop,.dga-header-util-layer .dga-panel-enter{animation-duration:.01ms!important;animation-delay:0ms!important}}:host .dga-burger__box{position:relative;display:block;width:1.375rem;height:1rem}:host .dga-burger__line{position:absolute;inset-inline:0;height:2px;border-radius:1px;background:currentColor;transition:transform .22s cubic-bezier(.4,0,.2,1),opacity .16s ease,top .22s cubic-bezier(.4,0,.2,1)}:host .dga-burger__line:nth-child(1){top:0}:host .dga-burger__line:nth-child(2){top:calc(50% - 1px)}:host .dga-burger__line:nth-child(3){top:calc(100% - 2px)}:host .dga-burger--open{background:var(--color-neutral-light, #f3f4f6)}:host .dga-burger--hidden{visibility:hidden;pointer-events:none}:host .dga-burger--open .dga-burger__line:nth-child(1){top:calc(50% - 1px);transform:rotate(45deg)}:host .dga-burger--open .dga-burger__line:nth-child(2){opacity:0;transform:scaleX(.4)}:host .dga-burger--open .dga-burger__line:nth-child(3){top:calc(50% - 1px);transform:rotate(-45deg)}:host .dga-mobile-nav-closed{display:none}:host .dga-mobile-nav-open{display:flex}:host .dga-mobile-push-open{animation:dga-push-in .24s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-sheet-open{animation:dga-sheet-in-rtl .28s cubic-bezier(.4,0,.2,1) forwards}:host-context([dir=\"rtl\"]) .dga-mobile-sheet-open{animation:dga-sheet-in-ltr .28s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-fs-open{animation:dga-fs-in .24s cubic-bezier(.4,0,.2,1) forwards}@media(prefers-reduced-motion:reduce){:host .dga-action-badge,:host .dga-mobile-push-open,:host .dga-mobile-sheet-open,:host .dga-mobile-fs-open,:host-context([dir=\"rtl\"]) .dga-mobile-sheet-open,:host .dga-burger__line{animation:none;transition:none}}\n"],dependencies:[{kind:"component",type:A,selector:"dga-avatar",inputs:["src","name","size","alt"]},{kind:"component",type:E,selector:"dga-badge",inputs:["variant","size"]},{kind:"component",type:H,selector:"dga-field",inputs:["label","labelHint","hint","error","status","statusMessage","controlId","required"]},{kind:"component",type:F,selector:"dga-form-control",inputs:["size","status","disabled","filled","startIcon","endIcon"]},{kind:"directive",type:$,selector:"[dgaEnd]"},{kind:"component",type:R,selector:"dga-icon",inputs:["name","glyph","size","tone","label"]},{kind:"component",type:j,selector:"dga-icon-badge",inputs:["size","appearance"]},{kind:"component",type:q,selector:"dga-modal",inputs:["open","title","description","size","animation","closeLabel","closeOnBackdrop","closeOnEscape","showClose","scrollable","centered"],outputs:["openChange","closed","opened"]},{kind:"component",type:V,selector:"dga-tooltip",inputs:["text","title","placement","variant","showIcon","disabled","showDelay","hideDelay","dismissMs","portaled"]}],changeDetection:i.ChangeDetectionStrategy.OnPush})}i.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"22.0.7",ngImport:i,type:v,decorators:[{type:G,args:[{selector:"dga-header",standalone:!0,changeDetection:K.OnPush,imports:[A,E,H,F,$,R,j,q,V],template:`
     <div [class]="innerClasses()">
       <div class="relative flex min-w-0 shrink-0 items-center self-center">
         <ng-content select="[dgaHeaderBrand]" />
@@ -1974,16 +2040,17 @@ import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,bo
     @if (loginOpen() && loginConfig(); as lcfg) {
       <div
         [id]="loginPanelId"
-        class="dga-header-util-panel fixed w-[min(24rem,calc(100vw-2rem))] max-md:inset-x-3
-               max-md:bottom-3 max-md:top-auto max-md:w-auto"
+        class="dga-header-util-panel fixed max-md:inset-x-3 max-md:bottom-3 max-md:top-auto
+               max-md:w-auto"
         role="dialog"
         [attr.aria-label]="lcfg.title || 'Login'"
-        [style]="dropdownPanelStyle()"
+        [style]="loginPanelOuterStyle()"
       >
         <div
-          class="dga-panel-enter dga-panel-enter--anchor-end max-h-[min(90svh,44rem)]
-                 overflow-y-auto overscroll-contain rounded-2xl border border-border bg-card
-                 shadow-xl md:max-h-[none] md:overflow-visible md:rounded-md"
+          class="dga-panel-enter dga-panel-enter--anchor-end overflow-y-auto overscroll-contain
+                 rounded-2xl border border-border bg-card shadow-xl md:overflow-visible
+                 md:rounded-md"
+          [style]="loginPanelInnerStyle()"
         >
           <div class="flex items-start justify-between gap-md px-2xl pt-2xl max-md:pt-xl">
             <div class="flex min-w-0 flex-col gap-xs">
@@ -2007,115 +2074,181 @@ import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,bo
             </button>
           </div>
 
-          <form
-            class="flex flex-col gap-xl px-2xl pb-[max(1.5rem,env(safe-area-inset-bottom))]
-                   pt-xl md:pb-2xl"
-            (submit)="onLoginSubmit($event)"
-          >
-            <dga-field
-              [label]="lcfg.emailLabel || 'Email'"
-              controlId="dga-header-login-email"
-              [hint]="lcfg.emailHint || ''"
-              required
-            >
-              <dga-form-control startIcon="mail" [filled]="!!loginEmail()">
-                <input
-                  id="dga-header-login-email"
-                  type="email"
-                  name="email"
-                  autocomplete="username"
-                  required
-                  class="placeholder:text-muted"
-                  [placeholder]="lcfg.emailPlaceholder || 'name@example.gov.sa'"
-                  [value]="loginEmail()"
-                  (input)="loginEmail.set($any($event.target).value)"
-                />
-              </dga-form-control>
-            </dga-field>
+          <ng-content select="[dgaHeaderLoginBeforeForm]" />
 
-            <dga-field
-              [label]="lcfg.passwordLabel || 'Password'"
-              controlId="dga-header-login-password"
-              [hint]="lcfg.passwordHint || ''"
-              required
+          @if (hasCustomLoginForm()) {
+            <div
+              class="px-2xl pb-[max(1.5rem,env(safe-area-inset-bottom))] pt-xl md:pb-2xl"
             >
-              <dga-form-control [filled]="!!loginPassword()">
-                <input
-                  id="dga-header-login-password"
-                  [type]="showLoginPassword() ? 'text' : 'password'"
-                  name="password"
-                  autocomplete="current-password"
-                  required
-                  class="placeholder:text-muted"
-                  [placeholder]="lcfg.passwordPlaceholder || 'Enter your password'"
-                  [value]="loginPassword()"
-                  (input)="loginPassword.set($any($event.target).value)"
-                />
-                <button
-                  type="button"
-                  dgaEnd
-                  [attr.aria-label]="
-                    showLoginPassword()
-                      ? lcfg.hidePasswordLabel || 'Hide password'
-                      : lcfg.showPasswordLabel || 'Show password'
-                  "
-                  (click)="showLoginPassword.set(!showLoginPassword())"
-                >
-                  <dga-icon [name]="showLoginPassword() ? 'eyeOff' : 'eye'" size="sm" />
-                </button>
-              </dga-form-control>
-            </dga-field>
-
-            @if (lcfg.forgotPasswordHref || lcfg.forgotPasswordLabel) {
-              <a
-                class="self-start text-body-sm font-medium text-fg-primary transition-opacity
-                       hover:opacity-80
-                       focus-visible:outline focus-visible:outline-2
-                       focus-visible:outline-offset-2 focus-visible:outline-focus"
-                [href]="appHref(lcfg.forgotPasswordHref || '#')"
+              <ng-content select="[dgaHeaderLoginForm]" />
+            </div>
+          } @else {
+            <form
+              class="flex flex-col gap-xl px-2xl pb-[max(1.5rem,env(safe-area-inset-bottom))]
+                     pt-xl md:pb-2xl"
+              (submit)="onLoginSubmit($event)"
+            >
+              <dga-field
+                [label]="lcfg.emailLabel || 'Email'"
+                controlId="dga-header-login-email"
+                [hint]="loginEmailError() ? '' : lcfg.emailHint || ''"
+                [error]="loginEmailError()"
+                required
               >
-                {{ lcfg.forgotPasswordLabel || 'Forgot password?' }}
-              </a>
-            }
+                <dga-form-control startIcon="mail" [filled]="!!loginEmail()">
+                  <input
+                    id="dga-header-login-email"
+                    type="email"
+                    name="email"
+                    autocomplete="username"
+                    required
+                    class="placeholder:text-muted"
+                    [placeholder]="lcfg.emailPlaceholder || 'name@example.gov.sa'"
+                    [value]="loginEmail()"
+                    (input)="onLoginEmailInput($any($event.target).value)"
+                  />
+                </dga-form-control>
+              </dga-field>
 
-            <div class="flex flex-col gap-md pt-xs">
-              <button
-                type="submit"
-                class="inline-flex h-5xl w-full cursor-pointer items-center justify-center gap-sm
-                       rounded-sm bg-primary px-xl text-body-md font-medium text-on-color shadow-sm
-                       transition-opacity hover:opacity-90 disabled:cursor-wait disabled:opacity-60
-                       focus-visible:outline focus-visible:outline-2
-                       focus-visible:outline-offset-2 focus-visible:outline-focus"
-                [disabled]="loginSubmitting()"
+              <dga-field
+                [label]="lcfg.passwordLabel || 'Password'"
+                controlId="dga-header-login-password"
+                [hint]="loginPasswordError() ? '' : lcfg.passwordHint || ''"
+                [error]="loginPasswordError()"
+                required
               >
-                @if (loginSubmitting()) {
-                  <span
-                    class="dga-login-spinner size-md rounded-full border-2 border-on-color/30
-                           border-t-on-color"
-                    aria-hidden="true"
-                  ></span>
+                <dga-form-control [filled]="!!loginPassword()">
+                  <input
+                    id="dga-header-login-password"
+                    [type]="showLoginPassword() ? 'text' : 'password'"
+                    name="password"
+                    autocomplete="current-password"
+                    required
+                    class="placeholder:text-muted"
+                    [placeholder]="lcfg.passwordPlaceholder || 'Enter your password'"
+                    [value]="loginPassword()"
+                    (input)="onLoginPasswordInput($any($event.target).value)"
+                  />
+                  <button
+                    type="button"
+                    dgaEnd
+                    [attr.aria-label]="
+                      showLoginPassword()
+                        ? lcfg.hidePasswordLabel || 'Hide password'
+                        : lcfg.showPasswordLabel || 'Show password'
+                    "
+                    (click)="showLoginPassword.set(!showLoginPassword())"
+                  >
+                    <dga-icon [name]="showLoginPassword() ? 'eyeOff' : 'eye'" size="sm" />
+                  </button>
+                </dga-form-control>
+              </dga-field>
+
+              @if (lcfg.forgotPasswordHref || lcfg.forgotPasswordLabel) {
+                <a
+                  class="self-start text-body-sm font-medium text-fg-primary transition-opacity
+                         hover:opacity-80
+                         focus-visible:outline focus-visible:outline-2
+                         focus-visible:outline-offset-2 focus-visible:outline-focus"
+                  [href]="appHref(lcfg.forgotPasswordHref || '#')"
+                >
+                  {{ lcfg.forgotPasswordLabel || 'Forgot password?' }}
+                </a>
+              }
+
+              <ng-content select="[dgaHeaderLoginAfterFields]" />
+
+              @if (loginError() || lcfg.errorMessage) {
+                <p class="m-0 text-body-sm text-fg-error" role="alert">
+                  {{ loginError() || lcfg.errorMessage }}
+                </p>
+              }
+
+              <div class="flex flex-col gap-md pt-xs">
+                <button
+                  type="submit"
+                  class="inline-flex h-5xl w-full cursor-pointer items-center justify-center gap-sm
+                         rounded-sm bg-primary px-xl text-body-md font-medium text-on-color shadow-sm
+                         transition-opacity hover:opacity-90 disabled:cursor-wait disabled:opacity-60
+                         focus-visible:outline focus-visible:outline-2
+                         focus-visible:outline-offset-2 focus-visible:outline-focus"
+                  [disabled]="loginSubmitting()"
+                >
+                  @if (loginSubmitting()) {
+                    <span
+                      class="dga-login-spinner size-md rounded-full border-2 border-on-color/30
+                             border-t-on-color"
+                      aria-hidden="true"
+                    ></span>
+                  }
+                  <span>
+                    {{
+                      loginSubmitting()
+                        ? lcfg.submittingLabel || '…'
+                        : lcfg.submitLabel || 'Login'
+                    }}
+                  </span>
+                </button>
+                @if (lcfg.showCancel !== false) {
+                  <button
+                    type="button"
+                    class="inline-flex h-5xl w-full cursor-pointer items-center justify-center
+                           rounded-sm px-xl text-body-md font-medium text-fg transition-colors
+                           hover:bg-neutral-light
+                           focus-visible:outline focus-visible:outline-2
+                           focus-visible:outline-offset-2 focus-visible:outline-focus"
+                    (click)="closeLogin()"
+                  >
+                    {{ lcfg.cancelLabel || 'Cancel' }}
+                  </button>
                 }
-                <span>
-                  {{
-                    loginSubmitting()
-                      ? '\u2026'
-                      : lcfg.submitLabel || 'Login'
-                  }}
-                </span>
-              </button>
-              <button
-                type="button"
-                class="inline-flex h-5xl w-full cursor-pointer items-center justify-center
-                       rounded-sm px-xl text-body-md font-medium text-fg transition-colors
-                       hover:bg-neutral-light
-                       focus-visible:outline focus-visible:outline-2
-                       focus-visible:outline-offset-2 focus-visible:outline-focus"
-                (click)="closeLogin()"
-              >
-                {{ lcfg.cancelLabel || 'Cancel' }}
-              </button>
+              </div>
+            </form>
+          }
+
+          @if (hasCustomLoginFooter()) {
+            <div
+              class="border-t border-border-subtle px-2xl py-xl pb-[max(1.5rem,env(safe-area-inset-bottom))]"
+            >
+              <ng-content select="[dgaHeaderLoginFooter]" />
             </div>
-          </form>
+          } @else if (showLoginRegisterRow(lcfg) || (lcfg.footerLinks?.length ?? 0) > 0) {
+            <div
+              class="flex flex-col gap-md border-t border-border-subtle px-2xl py-xl
+                     pb-[max(1.5rem,env(safe-area-inset-bottom))]"
+            >
+              @if (showLoginRegisterRow(lcfg)) {
+                <p class="m-0 text-center text-body-sm text-muted">
+                  {{ lcfg.registerPrompt || "Don't have an account?" }}
+                  @if (lcfg.registerLabel || lcfg.registerHref) {
+                    <a
+                      class="ms-xs font-medium text-fg-primary transition-opacity hover:opacity-80
+                             focus-visible:outline focus-visible:outline-2
+                             focus-visible:outline-offset-2 focus-visible:outline-focus"
+                      [href]="appHref(lcfg.registerHref || '#')"
+                    >
+                      {{ lcfg.registerLabel || 'Sign up' }}
+                    </a>
+                  }
+                </p>
+              }
+              @if (lcfg.footerLinks?.length) {
+                <div class="flex flex-col gap-xs">
+                  @for (link of lcfg.footerLinks; track link.id ?? link.label) {
+                    <a
+                      class="text-center text-body-sm font-medium text-fg-primary transition-opacity
+                             hover:opacity-80
+                             focus-visible:outline focus-visible:outline-2
+                             focus-visible:outline-offset-2 focus-visible:outline-focus"
+                      [href]="appHref(link.href || '#')"
+                    >
+                      {{ link.label }}
+                    </a>
+                  }
+                </div>
+              }
+            </div>
+          }
         </div>
       </div>
     }
@@ -2479,5 +2612,4 @@ import*as a from"@angular/core";import{inject as p,ElementRef as q,input as o,bo
         }
       </div>
     }
-  `,host:{role:"banner","[class]":"hostClasses()","[attr.data-appearance]":"appearance()","[attr.data-mobile-nav]":"mobileNav()","[attr.data-mobile-open]":"mobileOpen() || null","(mouseleave)":"onHostLeave($event)"},styles:[`@keyframes dga-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dga-panel-in{0%{opacity:0;transform:translateY(-.625rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes dga-chip-in{0%{opacity:0;transform:translateY(.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-notif-row-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-expand-fade{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-spin{to{transform:rotate(360deg)}}@keyframes dga-badge-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}@keyframes dga-push-in{0%{opacity:0;transform:translateY(-.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in-ltr{0%{opacity:.85;transform:translate3d(-100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-sheet-in-rtl{0%{opacity:.85;transform:translate3d(100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-fs-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in{0%{opacity:0;transform:translateY(1.25rem)}to{opacity:1;transform:translateY(0)}}:host .dga-util-backdrop,.dga-header-util-layer .dga-util-backdrop{animation:dga-fade-in .22s ease both}.dga-header-util-layer{position:fixed;inset:0;z-index:var(--z-index-urgent, 400);pointer-events:none}.dga-header-util-layer>.dga-util-backdrop,.dga-header-util-layer>.dga-header-util-panel{pointer-events:auto}:host .dga-panel-enter,.dga-header-util-layer .dga-panel-enter{animation:dga-panel-in .28s cubic-bezier(.16,1,.3,1) both;transform-origin:top center;will-change:transform,opacity}:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top right}:host-context([dir="rtl"]) .dga-panel-enter--anchor-end,:host([dir="rtl"]) .dga-panel-enter--anchor-end,:host-context([dir="rtl"]) .dga-header-util-layer .dga-panel-enter--anchor-end,[dir=rtl] .dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top left}@media(max-width:767px){:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{animation-name:dga-sheet-in;transform-origin:bottom center}}:host .dga-search-chip{animation:dga-chip-in .28s cubic-bezier(.16,1,.3,1) both}:host .dga-search-input{-webkit-appearance:none;appearance:none}:host .dga-search-input::-webkit-search-decoration,:host .dga-search-input::-webkit-search-cancel-button,:host .dga-search-input::-webkit-search-results-button,:host .dga-search-input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none;display:none}:host .dga-search-voice.dga-search-voice--active{color:var(--dga-text-primary, #1b8354)!important;background:var(--dga-bg-primary-faint, #f3faf6)!important}:host .dga-notif-item,.dga-header-util-layer .dga-notif-item{animation:dga-notif-row-in .26s cubic-bezier(.16,1,.3,1) both}:host .dga-notif-actions,.dga-header-util-layer .dga-notif-actions{animation:dga-expand-fade .2s ease both}:host .dga-login-spinner,.dga-header-util-layer .dga-login-spinner{animation:dga-spin .7s linear infinite}:host .dga-action-badge{animation:dga-badge-pulse 1.8s ease-in-out infinite;transform-origin:center}@media(prefers-reduced-motion:reduce){:host .dga-util-backdrop,:host .dga-panel-enter,:host .dga-search-chip,:host .dga-notif-item,:host .dga-notif-actions,.dga-header-util-layer .dga-util-backdrop,.dga-header-util-layer .dga-panel-enter{animation-duration:.01ms!important;animation-delay:0ms!important}}:host .dga-burger__box{position:relative;display:block;width:1.375rem;height:1rem}:host .dga-burger__line{position:absolute;inset-inline:0;height:2px;border-radius:1px;background:currentColor;transition:transform .22s cubic-bezier(.4,0,.2,1),opacity .16s ease,top .22s cubic-bezier(.4,0,.2,1)}:host .dga-burger__line:nth-child(1){top:0}:host .dga-burger__line:nth-child(2){top:calc(50% - 1px)}:host .dga-burger__line:nth-child(3){top:calc(100% - 2px)}:host .dga-burger--open{background:var(--color-neutral-light, #f3f4f6)}:host .dga-burger--hidden{visibility:hidden;pointer-events:none}:host .dga-burger--open .dga-burger__line:nth-child(1){top:calc(50% - 1px);transform:rotate(45deg)}:host .dga-burger--open .dga-burger__line:nth-child(2){opacity:0;transform:scaleX(.4)}:host .dga-burger--open .dga-burger__line:nth-child(3){top:calc(50% - 1px);transform:rotate(-45deg)}:host .dga-mobile-nav-closed{display:none}:host .dga-mobile-nav-open{display:flex}:host .dga-mobile-push-open{animation:dga-push-in .24s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-sheet-open{animation:dga-sheet-in-rtl .28s cubic-bezier(.4,0,.2,1) forwards}:host-context([dir="rtl"]) .dga-mobile-sheet-open{animation:dga-sheet-in-ltr .28s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-fs-open{animation:dga-fs-in .24s cubic-bezier(.4,0,.2,1) forwards}@media(prefers-reduced-motion:reduce){:host .dga-action-badge,:host .dga-mobile-push-open,:host .dga-mobile-sheet-open,:host .dga-mobile-fs-open,:host-context([dir="rtl"]) .dga-mobile-sheet-open,:host .dga-burger__line{animation:none;transition:none}}
-`]}]}],ctorParameters:()=>[],propDecorators:{brand:[{type:a.Input,args:[{isSignal:!0,alias:"brand",required:!1}]}],brandSlogan:[{type:a.Input,args:[{isSignal:!0,alias:"brandSlogan",required:!1}]}],brandLogo:[{type:a.Input,args:[{isSignal:!0,alias:"brandLogo",required:!1}]}],brandLogoAlt:[{type:a.Input,args:[{isSignal:!0,alias:"brandLogoAlt",required:!1}]}],brandPlaceholder:[{type:a.Input,args:[{isSignal:!0,alias:"brandPlaceholder",required:!1}]}],brandHref:[{type:a.Input,args:[{isSignal:!0,alias:"brandHref",required:!1}]}],navLabel:[{type:a.Input,args:[{isSignal:!0,alias:"navLabel",required:!1}]}],menuToggleLabel:[{type:a.Input,args:[{isSignal:!0,alias:"menuToggleLabel",required:!1}]}],menuCloseLabel:[{type:a.Input,args:[{isSignal:!0,alias:"menuCloseLabel",required:!1}]}],appearance:[{type:a.Input,args:[{isSignal:!0,alias:"appearance",required:!1}]}],mobileNav:[{type:a.Input,args:[{isSignal:!0,alias:"mobileNav",required:!1}]}],sticky:[{type:a.Input,args:[{isSignal:!0,alias:"sticky",required:!1}]}],items:[{type:a.Input,args:[{isSignal:!0,alias:"items",required:!1}]}],actions:[{type:a.Input,args:[{isSignal:!0,alias:"actions",required:!1}]}],search:[{type:a.Input,args:[{isSignal:!0,alias:"search",required:!1}]}],searchQuery:[{type:a.Input,args:[{isSignal:!0,alias:"searchQuery",required:!1}]},{type:a.Output,args:["searchQueryChange"]}],notifications:[{type:a.Input,args:[{isSignal:!0,alias:"notifications",required:!1}]}],login:[{type:a.Input,args:[{isSignal:!0,alias:"login",required:!1}]}],user:[{type:a.Input,args:[{isSignal:!0,alias:"user",required:!1}]}],authenticated:[{type:a.Input,args:[{isSignal:!0,alias:"authenticated",required:!1}]},{type:a.Output,args:["authenticatedChange"]}],actionClick:[{type:a.Output,args:["actionClick"]}],searchSubmit:[{type:a.Output,args:["searchSubmit"]}],searchSuggestionSelect:[{type:a.Output,args:["searchSuggestionSelect"]}],searchVoice:[{type:a.Output,args:["searchVoice"]}],notificationAction:[{type:a.Output,args:["notificationAction"]}],loginSubmit:[{type:a.Output,args:["loginSubmit"]}],logout:[{type:a.Output,args:["logout"]}],userLinkClick:[{type:a.Output,args:["userLinkClick"]}],navLinkClick:[{type:a.Output,args:["navLinkClick"]}],searchInputRef:[{type:a.ViewChild,args:["searchInput",{isSignal:!0}]}],utilLayerRef:[{type:a.ViewChild,args:["utilLayer",{isSignal:!0}]}],onCloseHeaderOverlays:[{type:m,args:["document:dga-close-header-overlays"]}],onKey:[{type:m,args:["document:keydown",["$event"]]}],onScroll:[{type:m,args:["window:scroll"]}],onResize:[{type:m,args:["window:resize"]}],onDocClick:[{type:m,args:["document:click",["$event"]]}]}});export{g as DgaHeader};
+  `,host:{role:"banner","[class]":"hostClasses()","[attr.data-appearance]":"appearance()","[attr.data-mobile-nav]":"mobileNav()","[attr.data-mobile-open]":"mobileOpen() || null","(mouseleave)":"onHostLeave($event)"},styles:["@keyframes dga-fade-in{0%{opacity:0}to{opacity:1}}@keyframes dga-panel-in{0%{opacity:0;transform:translateY(-.625rem) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes dga-chip-in{0%{opacity:0;transform:translateY(.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-notif-row-in{0%{opacity:0;transform:translateY(.35rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-expand-fade{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-spin{to{transform:rotate(360deg)}}@keyframes dga-badge-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}@keyframes dga-push-in{0%{opacity:0;transform:translateY(-.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in-ltr{0%{opacity:.85;transform:translate3d(-100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-sheet-in-rtl{0%{opacity:.85;transform:translate3d(100%,0,0)}to{opacity:1;transform:translateZ(0)}}@keyframes dga-fs-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes dga-sheet-in{0%{opacity:0;transform:translateY(1.25rem)}to{opacity:1;transform:translateY(0)}}:host .dga-util-backdrop,.dga-header-util-layer .dga-util-backdrop{animation:dga-fade-in .22s ease both}.dga-header-util-layer{position:fixed;inset:0;z-index:var(--z-index-urgent, 400);pointer-events:none}.dga-header-util-layer>.dga-util-backdrop,.dga-header-util-layer>.dga-header-util-panel{pointer-events:auto}:host .dga-panel-enter,.dga-header-util-layer .dga-panel-enter{animation:dga-panel-in .28s cubic-bezier(.16,1,.3,1) both;transform-origin:top center;will-change:transform,opacity}:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top right}:host-context([dir=\"rtl\"]) .dga-panel-enter--anchor-end,:host([dir=\"rtl\"]) .dga-panel-enter--anchor-end,:host-context([dir=\"rtl\"]) .dga-header-util-layer .dga-panel-enter--anchor-end,[dir=rtl] .dga-header-util-layer .dga-panel-enter--anchor-end{transform-origin:top left}@media(max-width:767px){:host .dga-panel-enter--anchor-end,.dga-header-util-layer .dga-panel-enter--anchor-end{animation-name:dga-sheet-in;transform-origin:bottom center}}:host .dga-search-chip{animation:dga-chip-in .28s cubic-bezier(.16,1,.3,1) both}:host .dga-search-input{-webkit-appearance:none;appearance:none}:host .dga-search-input::-webkit-search-decoration,:host .dga-search-input::-webkit-search-cancel-button,:host .dga-search-input::-webkit-search-results-button,:host .dga-search-input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none;display:none}:host .dga-search-voice.dga-search-voice--active{color:var(--dga-text-primary, #1b8354)!important;background:var(--dga-bg-primary-faint, #f3faf6)!important}:host .dga-notif-item,.dga-header-util-layer .dga-notif-item{animation:dga-notif-row-in .26s cubic-bezier(.16,1,.3,1) both}:host .dga-notif-actions,.dga-header-util-layer .dga-notif-actions{animation:dga-expand-fade .2s ease both}:host .dga-login-spinner,.dga-header-util-layer .dga-login-spinner{animation:dga-spin .7s linear infinite}:host .dga-action-badge{animation:dga-badge-pulse 1.8s ease-in-out infinite;transform-origin:center}@media(prefers-reduced-motion:reduce){:host .dga-util-backdrop,:host .dga-panel-enter,:host .dga-search-chip,:host .dga-notif-item,:host .dga-notif-actions,.dga-header-util-layer .dga-util-backdrop,.dga-header-util-layer .dga-panel-enter{animation-duration:.01ms!important;animation-delay:0ms!important}}:host .dga-burger__box{position:relative;display:block;width:1.375rem;height:1rem}:host .dga-burger__line{position:absolute;inset-inline:0;height:2px;border-radius:1px;background:currentColor;transition:transform .22s cubic-bezier(.4,0,.2,1),opacity .16s ease,top .22s cubic-bezier(.4,0,.2,1)}:host .dga-burger__line:nth-child(1){top:0}:host .dga-burger__line:nth-child(2){top:calc(50% - 1px)}:host .dga-burger__line:nth-child(3){top:calc(100% - 2px)}:host .dga-burger--open{background:var(--color-neutral-light, #f3f4f6)}:host .dga-burger--hidden{visibility:hidden;pointer-events:none}:host .dga-burger--open .dga-burger__line:nth-child(1){top:calc(50% - 1px);transform:rotate(45deg)}:host .dga-burger--open .dga-burger__line:nth-child(2){opacity:0;transform:scaleX(.4)}:host .dga-burger--open .dga-burger__line:nth-child(3){top:calc(50% - 1px);transform:rotate(-45deg)}:host .dga-mobile-nav-closed{display:none}:host .dga-mobile-nav-open{display:flex}:host .dga-mobile-push-open{animation:dga-push-in .24s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-sheet-open{animation:dga-sheet-in-rtl .28s cubic-bezier(.4,0,.2,1) forwards}:host-context([dir=\"rtl\"]) .dga-mobile-sheet-open{animation:dga-sheet-in-ltr .28s cubic-bezier(.4,0,.2,1) forwards}:host .dga-mobile-fs-open{animation:dga-fs-in .24s cubic-bezier(.4,0,.2,1) forwards}@media(prefers-reduced-motion:reduce){:host .dga-action-badge,:host .dga-mobile-push-open,:host .dga-mobile-sheet-open,:host .dga-mobile-fs-open,:host-context([dir=\"rtl\"]) .dga-mobile-sheet-open,:host .dga-burger__line{animation:none;transition:none}}\n"]}]}],ctorParameters:()=>[],propDecorators:{brand:[{type:i.Input,args:[{isSignal:!0,alias:"brand",required:!1}]}],brandSlogan:[{type:i.Input,args:[{isSignal:!0,alias:"brandSlogan",required:!1}]}],brandLogo:[{type:i.Input,args:[{isSignal:!0,alias:"brandLogo",required:!1}]}],brandLogoAlt:[{type:i.Input,args:[{isSignal:!0,alias:"brandLogoAlt",required:!1}]}],brandPlaceholder:[{type:i.Input,args:[{isSignal:!0,alias:"brandPlaceholder",required:!1}]}],brandHref:[{type:i.Input,args:[{isSignal:!0,alias:"brandHref",required:!1}]}],navLabel:[{type:i.Input,args:[{isSignal:!0,alias:"navLabel",required:!1}]}],menuToggleLabel:[{type:i.Input,args:[{isSignal:!0,alias:"menuToggleLabel",required:!1}]}],menuCloseLabel:[{type:i.Input,args:[{isSignal:!0,alias:"menuCloseLabel",required:!1}]}],appearance:[{type:i.Input,args:[{isSignal:!0,alias:"appearance",required:!1}]}],mobileNav:[{type:i.Input,args:[{isSignal:!0,alias:"mobileNav",required:!1}]}],sticky:[{type:i.Input,args:[{isSignal:!0,alias:"sticky",required:!1}]}],items:[{type:i.Input,args:[{isSignal:!0,alias:"items",required:!1}]}],actions:[{type:i.Input,args:[{isSignal:!0,alias:"actions",required:!1}]}],search:[{type:i.Input,args:[{isSignal:!0,alias:"search",required:!1}]}],searchQuery:[{type:i.Input,args:[{isSignal:!0,alias:"searchQuery",required:!1}]},{type:i.Output,args:["searchQueryChange"]}],notifications:[{type:i.Input,args:[{isSignal:!0,alias:"notifications",required:!1}]}],login:[{type:i.Input,args:[{isSignal:!0,alias:"login",required:!1}]}],user:[{type:i.Input,args:[{isSignal:!0,alias:"user",required:!1}]}],authenticated:[{type:i.Input,args:[{isSignal:!0,alias:"authenticated",required:!1}]},{type:i.Output,args:["authenticatedChange"]}],loginSubmitting:[{type:i.Input,args:[{isSignal:!0,alias:"loginSubmitting",required:!1}]},{type:i.Output,args:["loginSubmittingChange"]}],loginError:[{type:i.Input,args:[{isSignal:!0,alias:"loginError",required:!1}]},{type:i.Output,args:["loginErrorChange"]}],actionClick:[{type:i.Output,args:["actionClick"]}],searchSubmit:[{type:i.Output,args:["searchSubmit"]}],searchSuggestionSelect:[{type:i.Output,args:["searchSuggestionSelect"]}],searchVoice:[{type:i.Output,args:["searchVoice"]}],notificationAction:[{type:i.Output,args:["notificationAction"]}],loginSubmit:[{type:i.Output,args:["loginSubmit"]}],logout:[{type:i.Output,args:["logout"]}],userLinkClick:[{type:i.Output,args:["userLinkClick"]}],navLinkClick:[{type:i.Output,args:["navLinkClick"]}],customLoginForm:[{type:i.ContentChild,args:[i.forwardRef(()=>m),{isSignal:!0}]}],customLoginFooter:[{type:i.ContentChild,args:[i.forwardRef(()=>p),{isSignal:!0}]}],searchInputRef:[{type:i.ViewChild,args:["searchInput",{isSignal:!0}]}],utilLayerRef:[{type:i.ViewChild,args:["utilLayer",{isSignal:!0}]}],onCloseHeaderOverlays:[{type:b,args:["document:dga-close-header-overlays"]}],onKey:[{type:b,args:["document:keydown",["$event"]]}],onScroll:[{type:b,args:["window:scroll"]}],onResize:[{type:b,args:["window:resize"]}],onDocClick:[{type:b,args:["document:click",["$event"]]}]}});export{v as DgaHeader,x as DgaHeaderLoginAfterFields,h as DgaHeaderLoginBeforeForm,p as DgaHeaderLoginFooter,m as DgaHeaderLoginForm};