@use '../_mixin' as mixin;

// has--border?
// bdc だけとかの指定でも -bd:出力？
/*

	使用される環境（resetCSS）によって挙動が変わりやすいので 各プロパティを変数で管理する。
	ブラウザのデフォルト挙動では、bds指定でborder出現してくるが、nextraのresetCSSみたいな特殊な環境だとbdwの指定でborderでてきたりする。

	borderはLismの中でも特殊な仕様になっている。
	--bds, --bdw, --bdc で管理できるようにしていて、そのために .-bd: クラスを使う。
*/

// bdc, bdw などでカラーや太さを上書きできるように border 自体を変数管理
// :where(.has--bd),
@include mixin.maybe_where('.-bd,[class*="-bd:"]', 'base') {
	--bds: solid;
	--bdw: 1px;
	--bdc: currentColor;
	--bd: var(--bdw) var(--bds) var(--bdc);
}
// .has--bd:where(:not([class*='-bd:'])) {
.-bd {
	border-style: var(--bds) #{mixin.$maybe_important};
	border-width: var(--bdw) #{mixin.$maybe_important};
	border-color: var(--bdc) #{mixin.$maybe_important};
}

/* stylelint-disable */
.-bd\:n {
	border: none #{mixin.$maybe_important};
}
.-bd\:inherit {
	border: inherit #{mixin.$maybe_important};
}

// 方向指定
.-bd\:l {
	border-left: var(--bd) #{mixin.$maybe_important};
}
.-bd\:r {
	border-right: var(--bd) #{mixin.$maybe_important};
}
.-bd\:t {
	border-top: var(--bd) #{mixin.$maybe_important};
}
.-bd\:b {
	border-bottom: var(--bd) #{mixin.$maybe_important};
}
.-bd\:x {
	border-inline: var(--bd) #{mixin.$maybe_important};
}
.-bd\:y {
	border-block: var(--bd) #{mixin.$maybe_important};
}
.-bd\:is {
	border-inline-start: var(--bd) #{mixin.$maybe_important};
}
.-bd\:ie {
	border-inline-end: var(--bd) #{mixin.$maybe_important};
}
.-bd\:bs {
	border-block-start: var(--bd) #{mixin.$maybe_important};
}
.-bd\:be {
	border-block-end: var(--bd) #{mixin.$maybe_important};
}