@layer components{:root{--twentyone--breadcrumb--gap: var(--twentyone--spacing--8);--twentyone--breadcrumb--margin: 0;--twentyone--breadcrumb--padding: 0;--twentyone--breadcrumb--font-size: var(--twentyone--font-size--level-6);--twentyone--breadcrumb--line-height: var(--twentyone--element--line-height);--twentyone--breadcrumb--letter-spacing: var(--twentyone--element--letter-spacing);--twentyone--breadcrumb--text-transform: none;--twentyone--breadcrumb--item-gap: var(--twentyone--spacing--6);--twentyone--breadcrumb--delimiter: '/';--twentyone--breadcrumb--delimiter-color: var(--twentyone--color--grey);--twentyone--breadcrumb--inverted-delimiter-color: rgba(var(--twentyone--color--white-rgb), .5);--twentyone--breadcrumb--delimiter-font-size: 1em;--twentyone--breadcrumb--link-color: var(--twentyone--color--grey);--twentyone--breadcrumb--link-color-hover: var(--twentyone--color--primary);--twentyone--breadcrumb--link-text-decoration: none;--twentyone--breadcrumb--link-text-decoration-hover: underline;--twentyone--breadcrumb--inverted-link-color: rgba(var(--twentyone--color--white-rgb), .8);--twentyone--breadcrumb--inverted-link-color-hover: var(--twentyone--color--white);--twentyone--breadcrumb--icon-color: var(--twentyone--color--grey);--twentyone--breadcrumb--icon-color-hover: var(--twentyone--color--primary);--twentyone--breadcrumb--inverted-icon-color: rgba(var(--twentyone--color--white-rgb), .8);--twentyone--breadcrumb--inverted-icon-color-hover: var(--twentyone--color--white);--twentyone--breadcrumb--active-color: var(--twentyone--color--black);--twentyone--breadcrumb--inverted-active-color: var(--twentyone--color--white)}.twentyone-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:var(--twentyone--breadcrumb--gap);list-style:none;margin:var(--twentyone--breadcrumb--margin);padding:var(--twentyone--breadcrumb--padding);font-size:var(--twentyone--breadcrumb--font-size);line-height:var(--twentyone--breadcrumb--line-height);letter-spacing:var(--twentyone--breadcrumb--letter-spacing);text-transform:var(--twentyone--breadcrumb--text-transform)}.twentyone-breadcrumb .twentyone-breadcrumb-item{display:inline-flex;align-items:center;gap:var(--twentyone--breadcrumb--item-gap)}.twentyone-breadcrumb .twentyone-breadcrumb-item:not(:last-child)::after{content:var(--twentyone--breadcrumb--delimiter);display:inline-flex;align-items:center;justify-content:center;color:var(--twentyone--breadcrumb--delimiter-color);font-size:var(--twentyone--breadcrumb--delimiter-font-size)}.twentyone-breadcrumb .twentyone-breadcrumb-item:last-child .twentyone-breadcrumb-link{color:var(--twentyone--breadcrumb--active-color);pointer-events:none}.twentyone-breadcrumb .twentyone-breadcrumb-link{display:inline-flex;align-items:center;gap:var(--twentyone--breadcrumb--item-gap);color:var(--twentyone--breadcrumb--link-color);text-decoration:var(--twentyone--breadcrumb--link-text-decoration);transition:var(--twentyone--element--transition)}.twentyone-breadcrumb .twentyone-breadcrumb-link .twentyone-icon{fill:var(--twentyone--breadcrumb--icon-color);transition:var(--twentyone--element--transition)}.twentyone-breadcrumb .twentyone-breadcrumb-link:hover,.twentyone-breadcrumb .twentyone-breadcrumb-link:focus{color:var(--twentyone--breadcrumb--link-color-hover);text-decoration:var(--twentyone--breadcrumb--link-text-decoration-hover)}.twentyone-breadcrumb .twentyone-breadcrumb-link:hover .twentyone-icon,.twentyone-breadcrumb .twentyone-breadcrumb-link:focus .twentyone-icon{fill:var(--twentyone--breadcrumb--icon-color-hover)}.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-item:not(:last-child)::after{color:var(--twentyone--breadcrumb--inverted-delimiter-color)}.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-link{color:var(--twentyone--breadcrumb--inverted-link-color)}.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-link .twentyone-icon{fill:var(--twentyone--breadcrumb--inverted-icon-color)}.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-link:hover,.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-link:focus{color:var(--twentyone--breadcrumb--inverted-link-color-hover)}.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-link:hover .twentyone-icon,.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-link:focus .twentyone-icon{fill:var(--twentyone--breadcrumb--inverted-icon-color-hover)}.twentyone-breadcrumb.is--inverted .twentyone-breadcrumb-item:last-child .twentyone-breadcrumb-link{color:var(--twentyone--breadcrumb--inverted-active-color)}}