$cadmin-nav-font-size: 14px !default;

$cadmin-nav-link-padding-x: 16px !default; // 16px
$cadmin-nav-link-padding-y: 10px !default; // 10px

$cadmin-nav-link-disabled-color: $cadmin-gray-500 !default;
$cadmin-nav-link-disabled-cursor: $cadmin-disabled-cursor !default;

$cadmin-nav-link: () !default;
$cadmin-nav-link: map-deep-merge(
	(
		display: block,
		padding-bottom: $cadmin-nav-link-padding-y,
		padding-left: $cadmin-nav-link-padding-x,
		padding-right: $cadmin-nav-link-padding-x,
		padding-top: $cadmin-nav-link-padding-y,
		position: relative,

		hover: (
			text-decoration: none,
		),

		focus: (
			text-decoration: none,
			z-index: 1,
		),

		disabled: (
			color: $cadmin-nav-link-disabled-color,
			box-shadow: none,
			cursor: $cadmin-nav-link-disabled-cursor,

			active: (
				pointer-events: none,
			),
		),
	),
	$cadmin-nav-link
);

$cadmin-nav-link-btn-unstyled: () !default;
$cadmin-nav-link-btn-unstyled: map-deep-merge(
	(
		width: 100%,

		focus: (
			box-shadow: $cadmin-component-focus-box-shadow,
		),

		disabled: (
			opacity: 1,
		),

		c-inner: (
			width: auto,
		),
	),
	$cadmin-nav-link-btn-unstyled
);

$cadmin-nav-item-monospaced-size: 32px !default; // 32px

// @deprecated after v3.4.0 use the Sass map `$cadmin-nav-btn` instead

$cadmin-nav-btn-margin-x: 4px !default; // 4px

// @deprecated after v3.4.0 use the Sass map `$cadmin-nav-btn` instead

$cadmin-nav-btn-margin-y: calc(
	(
			#{$cadmin-line-height-base} * #{$cadmin-font-size-base} + #{$cadmin-nav-link-padding-y} *
				2 - #{$cadmin-nav-item-monospaced-size}
		) * 0.5
) !default;

// @deprecated after v3.4.0 use the Sass map `$cadmin-nav-btn` instead

$cadmin-nav-btn-padding-x: $cadmin-btn-padding-x-sm !default;

// @deprecated after v3.4.0 use the Sass map `$cadmin-nav-btn` instead

$cadmin-nav-btn-padding-y: 0px !default;

$cadmin-nav-btn: () !default;
$cadmin-nav-btn: map-deep-merge(
	(
		align-items: center,
		display: flex,
		height: $cadmin-nav-item-monospaced-size,
		justify-content: center,
		line-height: $cadmin-line-height-base,
		margin: $cadmin-nav-btn-margin-y $cadmin-nav-btn-margin-x,
		min-width: $cadmin-nav-item-monospaced-size,
		padding: $cadmin-nav-btn-padding-y $cadmin-nav-btn-padding-x,
		position: relative,
		text-align: center,
		width: auto,

		focus: (
			z-index: 1,
		),

		disabled: (
			opacity: 1,
		),

		c-inner: (
			margin-bottom: 0px,
			margin-left: calc(#{$cadmin-nav-btn-padding-x} * -1),
			margin-right: calc(#{$cadmin-nav-btn-padding-x} * -1),
			margin-top: calc(#{$cadmin-btn-border-width} * -1),
		),

		btn-link: (
			margin-left: 0px,
			margin-right: 0px,
		),

		lexicon-icon: (
			margin-top: 0px,
		),
	),
	$cadmin-nav-btn
);

$cadmin-nav-btn-monospaced: () !default;
$cadmin-nav-btn-monospaced: map-deep-merge(
	(
		padding: 0px,

		c-inner: (
			margin-left: calc(#{$cadmin-btn-border-width} * -1),
			margin-right: calc(#{$cadmin-btn-border-width} * -1),
		),
	),
	$cadmin-nav-btn-monospaced
);

$cadmin-nav-link-monospaced: () !default;
$cadmin-nav-link-monospaced: map-deep-merge(
	(
		align-items: center,
		display: flex,
		height: $cadmin-nav-item-monospaced-size,
		justify-content: center,
		margin: $cadmin-nav-btn-margin-y $cadmin-nav-btn-margin-x,
		min-width: $cadmin-nav-item-monospaced-size,
		padding: 0px,

		lexicon-icon: (
			margin-top: 0px,
		),
	),
	$cadmin-nav-link-monospaced
);

// .nav-item

$cadmin-nav-item: () !default;
$cadmin-nav-item: map-deep-merge(
	(
		word-wrap: break-word,
	),
	$cadmin-nav-item
);

// .nav-divider

$cadmin-nav-divider-color: $cadmin-gray-600 !default;
$cadmin-nav-divider-margin-y: calc(#{$cadmin-spacer} * 0.5) !default;

$cadmin-nav-divider: () !default;
$cadmin-nav-divider: map-deep-merge(
	(
		margin-left: 8px,
		padding-left: 8px,
		position: relative,

		before: (
			background-color: $cadmin-nav-divider-color,
			content: '',
			display: block,
			height: 16px,
			left: 0px,
			margin-top: -8px,
			position: absolute,
			top: 50%,
			width: 1px,
			z-index: 2,
		),
	),
	$cadmin-nav-divider
);

$cadmin-nav-divider-end: () !default;
$cadmin-nav-divider-end: map-deep-merge(
	(
		margin-right: 8px,
		padding-right: 8px,
		position: relative,

		after: (
			background-color: $cadmin-nav-divider-color,
			content: '',
			display: block,
			height: 16px,
			margin-top: -8px,
			position: absolute,
			right: 0px,
			top: 50%,
			width: 1px,
			z-index: 2,
		),
	),
	$cadmin-nav-divider-end
);

// .nav-text-truncate

$cadmin-nav-text-truncate: () !default;
$cadmin-nav-text-truncate: map-deep-merge(
	(
		display: inline-block,
		margin-bottom: -6px,
		max-width: 100%,
		overflow: hidden,
		text-overflow: ellipsis,
		white-space: nowrap,
	),
	$cadmin-nav-text-truncate
);

// .nav .nav-form

$cadmin-nav-form-padding-bottom: 0px !default;
$cadmin-nav-form-padding-left: $cadmin-nav-link-padding-x !default;
$cadmin-nav-form-padding-right: $cadmin-nav-link-padding-x !default;
$cadmin-nav-form-padding-top: 0px !default;

$cadmin-nav-form: () !default;
$cadmin-nav-form: map-merge(
	(
		padding-bottom: $cadmin-nav-form-padding-bottom,
		padding-left: $cadmin-nav-form-padding-left,
		padding-right: $cadmin-nav-form-padding-right,
		padding-top: $cadmin-nav-form-padding-top,
	),
	$cadmin-nav-form
);

// .nav

$cadmin-nav: () !default;
$cadmin-nav: map-deep-merge(
	(
		display: flex,
		flex-wrap: wrap,
		font-size: $cadmin-nav-font-size,
		list-style: none,
		margin-bottom: 0px,
		padding-left: 0px,
	),
	$cadmin-nav
);

// .nav-stacked

$cadmin-nav-stacked-nav-form-padding-bottom: $cadmin-nav-link-padding-y !default;
$cadmin-nav-stacked-nav-form-padding-left: 8px !default;
$cadmin-nav-stacked-nav-form-padding-right: 8px !default;
$cadmin-nav-stacked-nav-form-padding-top: $cadmin-nav-link-padding-y !default;

$cadmin-nav-stacked: () !default;
$cadmin-nav-stacked: map-deep-merge(
	(
		display: block,

		nav-form: (
			padding-bottom: $cadmin-nav-stacked-nav-form-padding-bottom,
			padding-left: $cadmin-nav-stacked-nav-form-padding-left,
			padding-right: $cadmin-nav-stacked-nav-form-padding-right,
			padding-top: $cadmin-nav-stacked-nav-form-padding-top,
		),
	),
	$cadmin-nav-stacked
);

// .nav-unstyled

$cadmin-nav-unstyled: () !default;
$cadmin-nav-unstyled: map-deep-merge(
	(
		flex-wrap: nowrap,

		nav-link: (
			line-height: $cadmin-nav-item-monospaced-size,
			padding-bottom: 0px,
			padding-left: 4px,
			padding-right: 4px,
			padding-top: 0px,
		),

		nav-link-monospaced: (
			margin: 0px 4px,
		),

		nav-btn: (
			margin: 0px 4px,
			padding-bottom: 0px,
			padding-left: 4px,
			padding-right: 4px,
			padding-top: 0px,
		),
	),
	$cadmin-nav-unstyled
);

// Nav Nested

$cadmin-nav-nested-margins-spacer-x: $cadmin-nav-link-padding-x !default;
$cadmin-nav-nested-spacer-x: 16px !default; // 16px

// Nav Tabs

$cadmin-nav-tabs-font-size: 14px !default; // 14px

// Nav Tabs Link

$cadmin-nav-tabs-border-color: $cadmin-gray-400 !default;
$cadmin-nav-tabs-border-radius: $cadmin-border-radius $cadmin-border-radius 0px
	0px !default;
$cadmin-nav-tabs-border-width: $cadmin-border-width !default;

$cadmin-nav-tabs-link-color: $cadmin-gray-600 !default;
$cadmin-nav-tabs-link-padding-x: null !default;
$cadmin-nav-tabs-link-padding-y: 4.5px !default; // 4.5px

$cadmin-nav-tabs-link-hover-border-color: transparent !default;

$cadmin-nav-tabs-link-active-bg: $cadmin-white !default;
$cadmin-nav-tabs-link-active-border-color: $cadmin-gray-400 $cadmin-gray-400
	$cadmin-nav-tabs-link-active-bg !default;
$cadmin-nav-tabs-link-active-color: $cadmin-gray-900 !default;

$cadmin-nav-tabs-link-show-bg: $cadmin-white !default;
$cadmin-nav-tabs-link-show-border-color: $cadmin-nav-tabs-link-active-border-color !default;
$cadmin-nav-tabs-link-show-color: $cadmin-nav-tabs-link-active-color !default;

// .nav-tabs .nav-link[aria-expanded="true"]

$cadmin-nav-tabs-link-show: () !default;
$cadmin-nav-tabs-link-show: map-deep-merge(
	(
		background-color: $cadmin-nav-tabs-link-show-bg,
		border-color: $cadmin-nav-tabs-link-show-border-color,
		color: $cadmin-nav-tabs-link-show-color,
	),
	$cadmin-nav-tabs-link-show
);

$cadmin-nav-tabs-link: () !default;
$cadmin-nav-tabs-link: map-deep-merge(
	(
		border-color: transparent,
		border-style: solid,
		border-width: $cadmin-nav-tabs-border-width,
		border-radius: $cadmin-nav-tabs-border-radius,
		color: $cadmin-nav-tabs-link-color,
		font-weight: $cadmin-font-weight-semi-bold,
		padding-bottom: $cadmin-nav-tabs-link-padding-y,
		padding-left: $cadmin-nav-tabs-link-padding-x,
		padding-right: $cadmin-nav-tabs-link-padding-x,
		padding-top: $cadmin-nav-tabs-link-padding-y,
		transition: box-shadow 0.15s ease-in-out,
		white-space: nowrap,

		hover: (
			border-color: $cadmin-nav-tabs-link-hover-border-color,
		),

		focus: (
			border-color: $cadmin-nav-tabs-link-hover-border-color,
			box-shadow: $cadmin-component-focus-box-shadow,
			outline: 0,
		),

		active: (
			background-color: $cadmin-nav-tabs-link-active-bg,
			border-color: $cadmin-nav-tabs-link-active-border-color,
			color: $cadmin-nav-tabs-link-active-color,
		),

		show: $cadmin-nav-tabs-link-show,

		disabled: (
			background-color: transparent,
			border-color: transparent,
			box-shadow: none,
			color: $cadmin-nav-link-disabled-color,
		),

		inline-item-after: (
			margin-left: 4px,
		),

		inline-item-before: (
			margin-right: 4px,
		),
	),
	$cadmin-nav-tabs-link
);

// .nav-tabs

$cadmin-nav-tabs: () !default;
$cadmin-nav-tabs: map-deep-merge(
	(
		border-bottom: 1px solid $cadmin-gray-400,
		padding-left: 24px,
		padding-right: 24px,
		padding-top: 7px,
		font-size: $cadmin-nav-tabs-font-size,

		nav-item: (
			margin-bottom: calc(#{$cadmin-nav-tabs-border-width} * -1),
		),

		nav-link: $cadmin-nav-tabs-link,
	),
	$cadmin-nav-tabs
);

// Nav Tabs Tab Pane

$cadmin-nav-tabs-tab-pane-bg: $cadmin-white !default;
$cadmin-nav-tabs-tab-pane-border-radius: 4px !default;
$cadmin-nav-tabs-tab-pane-padding: 32px !default;

// Nav Variants

$cadmin-nav-palette: () !default;