@layer design-system.components{.vds-header{--header-background:transparent;--header-text-color:inherit;--header-sticky-offset:0px;--header-top-sticky-height:0px;--header-main-sticky-height:0px;--header-bottom-sticky-height:0px;--header-z-top:32;--header-z-main:31;--header-z-bottom:30;--header-transition-duration:var(--vds-duration-normal,.2s);--header-transition-easing:var(--vds-ease-out,cubic-bezier(0, 0, .2, 1))}.vds-header__row{--row-block-size:var(--vds-app-chrome-row,var(--vds-size-lg,2.5rem));--row-padding-inline:var(--vds-section-gutter-md,1.5rem);--row-section-gap:var(--vds-space-4,1rem);--row-section-item-gap:var(--vds-space-3,.75rem);--row-container-width:var(--vds-container-width-default,80rem);--row-background:var(--vds-color-surface,#fff);--row-text-color:var(--vds-color-text,#111827);--row-border-color:var(--vds-color-border-muted,#e5e7eb);--row-border-block-end:1px solid var(--row-border-color)}.vds-header__row[data-height=sm]{--row-block-size:var(--vds-app-chrome-row,var(--vds-size-lg,2.5rem))}.vds-header__row[data-height=md]{--row-block-size:3.5rem}.vds-header__row[data-height=lg]{--row-block-size:4rem}.vds-header__row[data-height=xl]{--row-block-size:5rem}.vds-header__row[data-background=none]{--row-background:transparent;--row-border-block-end:0}.vds-header__row[data-background=subtle]{--row-background:var(--vds-color-bg-subtle,#f9fafb)}.vds-header__row[data-background=muted]{--row-background:var(--vds-color-bg-muted,#f3f4f6)}.vds-header__row[data-background=emphasis]{--row-background:var(--vds-color-bg-emphasis,var(--vds-color-text,#111827));--row-text-color:var(--vds-color-on-emphasis,var(--vds-color-surface,#fff));--row-border-color:transparent}.vds-header__row[data-transparent=true]{--row-background:transparent;--row-border-block-end:0}.vds-header__row[data-gutter=none]{--row-padding-inline:0}.vds-header__row[data-gutter=xs]{--row-padding-inline:var(--vds-section-gutter-xs,.75rem)}.vds-header__row[data-gutter=sm]{--row-padding-inline:var(--vds-section-gutter-sm,1rem)}.vds-header__row[data-gutter=md]{--row-padding-inline:var(--vds-section-gutter-md,1.5rem)}.vds-header__row[data-gutter=lg]{--row-padding-inline:var(--vds-section-gutter-lg,2rem)}.vds-header__row[data-gutter=xl]{--row-padding-inline:var(--vds-section-gutter-xl,3rem)}.vds-header__row[data-width=xs]{--row-container-width:var(--vds-container-width-xs,20rem)}.vds-header__row[data-width=sm]{--row-container-width:var(--vds-container-width-sm,40rem)}.vds-header__row[data-width=md]{--row-container-width:var(--vds-container-width-md,48rem)}.vds-header__row[data-width=lg]{--row-container-width:var(--vds-container-width-lg,64rem)}.vds-header__row[data-width=xl]{--row-container-width:var(--vds-container-width-xl,80rem)}.vds-header__row[data-width="2xl"]{--row-container-width:var(--vds-container-width-2xl,96rem)}.vds-header__row[data-width=full]{--row-container-width:100%}.vds-header__row[data-gap=none]{--row-section-gap:0}.vds-header__row[data-gap=xs]{--row-section-gap:var(--vds-space-2,.5rem)}.vds-header__row[data-gap=sm]{--row-section-gap:var(--vds-space-3,.75rem)}.vds-header__row[data-gap=md]{--row-section-gap:var(--vds-space-4,1rem)}.vds-header__row[data-gap=lg]{--row-section-gap:var(--vds-space-6,1.5rem)}.vds-header__row[data-gap=xl]{--row-section-gap:var(--vds-space-8,2rem)}}
@layer design-system.components{.vds-header{color:var(--header-text-color);display:contents}.vds-header__row{background-color:var(--row-background);inline-size:100%;color:var(--row-text-color);border-block-end:var(--row-border-block-end);transition:transform var(--header-transition-duration) var(--header-transition-easing), background-color var(--header-transition-duration) var(--header-transition-easing), border-color var(--header-transition-duration) var(--header-transition-easing);will-change:transform;display:block}.vds-header__row-inner{align-items:center;column-gap:var(--row-section-gap);block-size:var(--row-block-size);inline-size:100%;max-inline-size:var(--row-container-width);padding-inline:var(--row-padding-inline);transition:block-size var(--header-transition-duration) var(--header-transition-easing), padding-block var(--header-transition-duration) var(--header-transition-easing);grid-template-columns:auto 1fr auto;margin-inline:auto;display:grid}.vds-header__row[data-center=true]>.vds-header__row-inner{grid-template-columns:1fr auto 1fr}.vds-header__row[data-contained=false]>.vds-header__row-inner{max-inline-size:none}.vds-header__row[data-sticky=always],.vds-header__row[data-sticky=smart],.vds-header__row[data-sticky=collapse]{position:sticky}.vds-header__row[data-slot=top][data-sticky=always],.vds-header__row[data-slot=top][data-sticky=smart],.vds-header__row[data-slot=top][data-sticky=collapse]{z-index:var(--header-z-top);inset-block-start:var(--header-sticky-offset)}.vds-header__row[data-slot=main][data-sticky=always],.vds-header__row[data-slot=main][data-sticky=smart],.vds-header__row[data-slot=main][data-sticky=collapse]{z-index:var(--header-z-main);inset-block-start:calc(var(--header-sticky-offset) + var(--header-top-sticky-height))}.vds-header__row[data-slot=bottom][data-sticky=always],.vds-header__row[data-slot=bottom][data-sticky=smart],.vds-header__row[data-slot=bottom][data-sticky=collapse]{z-index:var(--header-z-bottom);inset-block-start:calc(var(--header-sticky-offset) + var(--header-top-sticky-height) + var(--header-main-sticky-height))}.vds-header__row[data-sticky=smart][data-hidden=true]{pointer-events:none;transform:translateY(-100%)}.vds-header__row[data-sticky=collapse]{overflow:hidden}.vds-header__row[data-sticky=collapse][data-collapsed=true]{--row-border-block-end:0}.vds-header__row[data-sticky=collapse][data-collapsed=true]>.vds-header__row-inner{block-size:0;padding-block:0}.vds-header__section{align-items:center;gap:var(--row-section-item-gap);min-inline-size:0;display:flex}.vds-header__section[data-side=start]{justify-content:flex-start}.vds-header__section[data-side=center]{justify-content:center}.vds-header__section[data-side=end]{justify-content:flex-end}@media (prefers-reduced-motion:reduce){.vds-header__row,.vds-header__row-inner{transition:none}}}
