@use "pkg:iro-design/core.vars" as core;
@use "pkg:iro-design/objects/backdrop.vars" as backdrop;
@use "pkg:iro-sass/props";

$z-index: props.def(--c-site-header--z-index, calc(props.get(backdrop.$z-index) - 10));
$block-size: props.def(--c-site-header--block-size, props.get(core.$size--800));
$spacing: props.def(--c-site-header--spacing, props.get(core.$size--500));
$nav-pull: props.def(--c-site-header--nav-pull, props.get(core.$size--300));

$spacing--md: props.def(--c-site-header--spacing, props.get(core.$size--400), "md");
$nav-pull--md: props.def(--c-site-header--nav-pull, props.get(core.$size--200), "md");

$block-size--sm: props.def(--c-site-header--block-size, props.get(core.$size--700), "sm");
$spacing--sm: props.def(--c-site-header--spacing, props.get(core.$size--300), "sm");