@volverjs/style/dist/components/vv-breadcrumb.css

@volverjs/style is a lightweight responsive CSS utility library to accompany @volverjs/ui-* and static webpages as well.

:where(:host,:root,.theme){--vv-breadcrumb-position:relative;--vv-breadcrumb-min-width:0;--vv-breadcrumb-pseudo-after-position:absolute;--vv-breadcrumb-pseudo-after-top:0;--vv-breadcrumb-pseudo-after-bottom:0;--vv-breadcrumb-pseudo-after-right:0;--vv-breadcrumb-pseudo-after-display:block;--vv-breadcrumb-pseudo-after-width:var(--spacing-sm);--vv-breadcrumb-pseudo-after-background:linear-gradient(45deg, transparent, var(--color-surface));--vv-breadcrumb-element-list-position:relative;--vv-breadcrumb-element-list-overflow:auto hidden;--vv-breadcrumb-element-list-overscroll-behavior-x:contain;--vv-breadcrumb-element-list-scroll-behavior:smooth;--vv-breadcrumb-element-list-scroll-snap-type:x mandatory;--vv-breadcrumb-element-list-scrollbar-width:none;--vv-breadcrumb-element-list-display:flex;--vv-breadcrumb-element-list-flex-wrap:nowrap;--vv-breadcrumb-element-list-list-style:none;--vv-breadcrumb-element-list-padding:0;--vv-breadcrumb-element-list-background:var(--color-surface);--vv-breadcrumb-element-list-white-space:nowrap;--vv-breadcrumb-element-list-pseudo--webkit-scrollbar-width:0;--vv-breadcrumb-element-list-pseudo--webkit-scrollbar-height:0;--vv-breadcrumb-element-item-display:inline-flex;--vv-breadcrumb-element-item-align-items:center;--vv-breadcrumb-element-item-color:var(--color-word-2);--vv-breadcrumb-element-item-pseudo-after-display:block;--vv-breadcrumb-element-item-pseudo-after-margin-inline:1ch;--vv-breadcrumb-element-item-pseudo-after-width:calc(var(--leading-normal) * 1em);--vv-breadcrumb-element-item-pseudo-after-height:calc(var(--leading-normal) * 1em);--vv-breadcrumb-element-item-pseudo-after-background-image:var(--bg-chevron);--vv-breadcrumb-element-item-pseudo-after-background-position:center;--vv-breadcrumb-element-item-pseudo-after-background-size:1em;--vv-breadcrumb-element-item-pseudo-after-background-repeat:no-repeat;--vv-breadcrumb-element-item-pseudo-after-rotate:-90deg;--vv-breadcrumb-element-item-active-display:inline-flex;--vv-breadcrumb-element-item-active-align-items:center;--vv-breadcrumb-element-item-active-font-weight:var(--font-bold);--vv-breadcrumb-element-item-active-padding-right:var(--spacing-16);--vv-breadcrumb-element-link-state-hover-text-decoration:underline;--vv-breadcrumb-element-link-state-focus-within-text-decoration:underline;--vv-breadcrumb-element-link-state-active-color:var(--color-brand-darken-2);--vv-breadcrumb-modifier-multiline-element-list-flex-wrap:wrap;--vv-breadcrumb-modifier-multiline-element-item-font-size:var(--text-12);--vv-breadcrumb-modifier-multiline-element-item-active-width:100%;--vv-breadcrumb-modifier-multiline-element-item-active-font-size:var(--text-18);--vv-breadcrumb-modifier-multiline-element-item-active-line-height:var(--leading-relaxed)}:where(.vv-breadcrumb){position:var(--vv-breadcrumb-position);min-width:var(--vv-breadcrumb-min-width)}:where(.vv-breadcrumb):after{content:"";position:var(--vv-breadcrumb-pseudo-after-position);top:var(--vv-breadcrumb-pseudo-after-top);bottom:var(--vv-breadcrumb-pseudo-after-bottom);right:var(--vv-breadcrumb-pseudo-after-right);display:var(--vv-breadcrumb-pseudo-after-display);width:var(--vv-breadcrumb-pseudo-after-width);background:var(--vv-breadcrumb-pseudo-after-background)}:where(.vv-breadcrumb__list,.vv-breadcrumb>ol){position:var(--vv-breadcrumb-element-list-position);overflow:var(--vv-breadcrumb-element-list-overflow);overscroll-behavior-x:var(--vv-breadcrumb-element-list-overscroll-behavior-x);scroll-behavior:var(--vv-breadcrumb-element-list-scroll-behavior);scroll-snap-type:var(--vv-breadcrumb-element-list-scroll-snap-type);scrollbar-width:var(--vv-breadcrumb-element-list-scrollbar-width);display:var(--vv-breadcrumb-element-list-display);flex-wrap:var(--vv-breadcrumb-element-list-flex-wrap);list-style:var(--vv-breadcrumb-element-list-list-style);padding:var(--vv-breadcrumb-element-list-padding);background:var(--vv-breadcrumb-element-list-background);white-space:var(--vv-breadcrumb-element-list-white-space)}:where(.vv-breadcrumb__list,.vv-breadcrumb>ol)::-webkit-scrollbar{content:"";width:var(--vv-breadcrumb-element-list-pseudo--webkit-scrollbar-width);height:var(--vv-breadcrumb-element-list-pseudo--webkit-scrollbar-height)}:where(.vv-breadcrumb__item,.vv-breadcrumb>ol>li:has(a)){display:var(--vv-breadcrumb-element-item-display);align-items:var(--vv-breadcrumb-element-item-align-items);color:var(--vv-breadcrumb-element-item-color)}:where(.vv-breadcrumb__item,.vv-breadcrumb>ol>li:has(a)):after{content:"";display:var(--vv-breadcrumb-element-item-pseudo-after-display);margin-inline:var(--vv-breadcrumb-element-item-pseudo-after-margin-inline);width:var(--vv-breadcrumb-element-item-pseudo-after-width);height:var(--vv-breadcrumb-element-item-pseudo-after-height);background-image:var(--vv-breadcrumb-element-item-pseudo-after-background-image);background-position:var(--vv-breadcrumb-element-item-pseudo-after-background-position);background-size:var(--vv-breadcrumb-element-item-pseudo-after-background-size);background-repeat:var(--vv-breadcrumb-element-item-pseudo-after-background-repeat);rotate:var(--vv-breadcrumb-element-item-pseudo-after-rotate)}:where(.vv-breadcrumb__item-active,.vv-breadcrumb>ol>li:not(:has(a))){display:var(--vv-breadcrumb-element-item-active-display);align-items:var(--vv-breadcrumb-element-item-active-align-items);font-weight:var(--vv-breadcrumb-element-item-active-font-weight);padding-right:var(--vv-breadcrumb-element-item-active-padding-right)}:where(.vv-breadcrumb__link--hover,.vv-breadcrumb__link.hover,.vv-breadcrumb>ol>li>a.hover,.vv-breadcrumb__link:not([disabled]):hover,.vv-breadcrumb>ol>li>a:not([disabled]):hover){-webkit-text-decoration:var(--vv-breadcrumb-element-link-state-hover-text-decoration);-webkit-text-decoration:var(--vv-breadcrumb-element-link-state-hover-text-decoration);text-decoration:var(--vv-breadcrumb-element-link-state-hover-text-decoration)}:where(.vv-breadcrumb__link--focus-within,.vv-breadcrumb__link.focus-within,.vv-breadcrumb>ol>li>a.focus-within,.vv-breadcrumb__link:not([disabled]):focus-within,.vv-breadcrumb>ol>li>a:not([disabled]):focus-within){-webkit-text-decoration:var(--vv-breadcrumb-element-link-state-focus-within-text-decoration);-webkit-text-decoration:var(--vv-breadcrumb-element-link-state-focus-within-text-decoration);text-decoration:var(--vv-breadcrumb-element-link-state-focus-within-text-decoration)}:where(.vv-breadcrumb__link--active,.vv-breadcrumb__link.active,.vv-breadcrumb>ol>li>a.active,.vv-breadcrumb__link:not([disabled]):active,.vv-breadcrumb>ol>li>a:not([disabled]):active){color:var(--vv-breadcrumb-element-link-state-active-color)}:where(.vv-breadcrumb--multiline>.vv-breadcrumb__list,.vv-breadcrumb--multiline>ol){flex-wrap:var(--vv-breadcrumb-modifier-multiline-element-list-flex-wrap)}:where(.vv-breadcrumb--multiline .vv-breadcrumb__item,.vv-breadcrumb--multiline>ol>li:has(a)){font-size:var(--vv-breadcrumb-modifier-multiline-element-item-font-size)}:where(.vv-breadcrumb--multiline .vv-breadcrumb__item-active,.vv-breadcrumb--multiline>ol>li:not(:has(a))){width:var(--vv-breadcrumb-modifier-multiline-element-item-active-width);font-size:var(--vv-breadcrumb-modifier-multiline-element-item-active-font-size);line-height:var(--vv-breadcrumb-modifier-multiline-element-item-active-line-height)}