.jarl-anchored-element__arrow{--_width:var(--jarl-anchored-element-arrow-width,.625rem);--_height:var(--jarl-anchored-element-arrow-height,.625rem);--_border-width:var(--jarl-anchored-element-arrow-border-width,1px);--_border-color:var(--jarl-anchored-element-arrow-border-color,#ccc);--_offset:calc(-1 * (var(--_height) / 2 + var(--_border-width)));--_center-x:calc(50% - (var(--_width) / 2 + var(--_border-width)));--_center-y:calc(50% - (var(--_height) / 2 + var(--_border-width)));position:absolute;width:var(--_width);height:var(--_height);background-color:var(--jarl-anchored-element-arrow-bg,#fff);border-style:var(--jarl-anchored-element-arrow-border-style,solid);border-width:var(--_border-width);border-color:transparent;transform:rotate(45deg)}.jarl-anchored-element__arrow[data-position^=top]{bottom:var(--_offset);border-right-color:var(--_border-color);border-bottom-color:var(--_border-color)}.jarl-anchored-element__arrow[data-position=bottom],.jarl-anchored-element__arrow[data-position=top]{left:var(--_center-x)}.jarl-anchored-element__arrow[data-position=bottom_left],.jarl-anchored-element__arrow[data-position=top_left]{left:var(--_width)}.jarl-anchored-element__arrow[data-position=bottom_right],.jarl-anchored-element__arrow[data-position=top_right]{right:var(--_width)}.jarl-anchored-element__arrow[data-position^=bottom]{top:var(--_offset);border-top-color:var(--_border-color);border-left-color:var(--_border-color)}.jarl-anchored-element__arrow[data-position^=left]{right:var(--_offset);border-top-color:var(--_border-color);border-right-color:var(--_border-color)}.jarl-anchored-element__arrow[data-position=left],.jarl-anchored-element__arrow[data-position=right]{top:var(--_center-y)}.jarl-anchored-element__arrow[data-position=left_bottom],.jarl-anchored-element__arrow[data-position=right_bottom]{bottom:calc(var(--_height) / 2)}.jarl-anchored-element__arrow[data-position^=right]{left:var(--_offset);border-top-color:var(--_border-color);border-left-color:var(--_border-color);transform:rotate(-45deg)}.jarl-anchored-element__arrow[data-position=left_top],.jarl-anchored-element__arrow[data-position=right_top]{top:calc(var(--_height) / 2)}.jarl-anchored-element{position:absolute;inset-block:0 auto;inset-inline:0 auto;z-index:var(--jarl-anchored-element-z-index,100);white-space:nowrap}.jarl-anchored-element .jarl-anchored-element__content{position:relative;padding-block:var(--jarl-anchored-element-py,.5rem);padding-inline:var(--jarl-anchored-element-px,.5rem);color:var(--jarl-anchored-element-color,#111);background-color:var(--jarl-anchored-element-bg,#fff);border-color:var(--jarl-anchored-element-border-color,#ccc);border-style:var(--jarl-anchored-element-border-style,solid);border-width:var(--jarl-anchored-element-border-width,1px);border-radius:var(--jarl-anchored-element-border-radius,.25rem);will-change:transform,visibility,opacity}.jarl-anchored-element .jarl-anchored-element__content[data-state=closed]{opacity:0}.jarl-anchored-element .jarl-anchored-element__content[data-state=opened]{opacity:1}.jarl-anchored-element .jarl-anchored-element__content[data-state=opening]{animation:fadeInAnimation .3s backwards}.jarl-anchored-element .jarl-anchored-element__content[data-state=closing]{animation:fadeOutAnimation .3s forwards}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}@keyframes fadeOutAnimation{0%{opacity:1}to{opacity:0}}