.littlefoot{--button-background-color:var(--color-accent);--button-text-color:var(--color-on-accent);--button-active-background-color:var(--color-accent-secondary);--button-active-text-color:var(--color-midnight-navy);--button-border-radius:0;--button-height:1rem;--button-width:1rem;--button-margin:0 .1rem;--button-padding:0 .4rem;--button-font-size:.7rem;--button-transition:background-color .15s ease, color .15s ease;--popover-background-color:var(--color-background);--popover-text-color:var(--color-text);--popover-border:1px solid var(--color-divider);--popover-border-radius:0;--popover-max-height:15em;--popover-max-width:90%;--popover-horizontal-padding:1.4rem;--popover-vertical-padding:.1rem;--popover-shadow:none;--popover-transform-origin:50% 0;--popover-transform:scale(.1) translateZ(0);--popover-active-transform:scale(1) translateZ(0);--popover-transition:opacity 10ms ease, transform 10ms ease;--popover-width:22em;--popover-scroll-indicator-color:var(--color-signal);--popover-tooltip-size:.2rem;--popover-font-family:var(--font-family-body);--popover-font-size:.8em;position:relative}.littlefoot__button{background-color:var(--button-background-color);border-radius:var(--button-border-radius);border:var(--button-border,0);color:var(--button-text-color);cursor:pointer;font-size:var(--button-font-size,.75rem);font-weight:var(--button-font-weight,initial);height:var(--button-height);margin:var(--button-margin);padding:var(--button-padding);transition:var(--button-transition);vertical-align:.2em;text-decoration:none;display:inline-block;&:hover,&:focus,&:active,&.is-active{background-color:var(--button-active-background-color);color:var(--button-active-text-color)}&:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}& svg{float:left;height:.3rem}}.littlefoot__popover{border:var(--popover-border);border-radius:var(--popover-border-radius);box-shadow:var(--popover-shadow);margin:calc(var(--popover-tooltip-size) + var(--button-height)) 0;max-width:var(--popover-max-width);transform-origin:var(--popover-transform-origin);transform:var(--popover-transform);transition:var(--popover-transition);width:var(--popover-width);z-index:9999;position:absolute;top:0;&.is-above{top:auto;bottom:0}&.is-active{transform:var(--popover-active-transform)}}.littlefoot__wrapper{border-radius:var(--popover-border-radius);z-index:1;position:relative}.littlefoot__content{-webkit-overflow-scrolling:touch;background-color:var(--popover-background-color);border-radius:var(--popover-border-radius);box-sizing:border-box;color:var(--popover-text-color);font-family:var(--popover-font-family,initial);font-size:var(--popover-font-size,initial);font-style:var(--popover-font-style,initial);font-weight:var(--popover-font-weight,initial);line-height:var(--popover-line-height,normal);max-height:var(--popover-max-height);padding:var(--popover-vertical-padding) var(--popover-horizontal-padding);width:100%;overflow:auto;& img{max-width:100%}&:focus{outline:none}}.is-scrollable{--arrow-x:calc(-1 * var(--popover-horizontal-padding));--arrow-y:calc(var(--popover-vertical-padding) / 2);& .littlefoot__content:after{color:var(--popover-scroll-indicator-color);content:"⇣";opacity:1;text-align:center;transform:translateX(var(--arrow-x)) translateY(var(--arrow-y));transition:var(--popover-transition);width:var(--popover-horizontal-padding);display:block;position:sticky;bottom:0;left:0}&.is-fully-scrolled .littlefoot__content:after{opacity:0}}.littlefoot__tooltip{--tooltip-margin:calc(-1 * var(--popover-tooltip-size));background-color:var(--popover-background-color);border:var(--popover-border);box-shadow:var(--popover-shadow);height:calc(2 * var(--popover-tooltip-size));margin-left:var(--tooltip-margin);width:calc(2 * var(--popover-tooltip-size));position:absolute;transform:rotate(45deg)}.is-below .littlefoot__tooltip{top:var(--tooltip-margin)}.is-above .littlefoot__tooltip{bottom:var(--tooltip-margin)}@media (width<=767px){.littlefoot__popover{border-width:1px 0 0;border-radius:0;width:100%;margin:0;position:fixed;transform:translateY(100%);max-width:100%!important;inset:auto 0 0!important;&.is-active{transform:translateY(0)}}.littlefoot__wrapper{border-radius:0;transform:none;max-width:100%!important}.littlefoot__tooltip{display:none}}@media not print{.littlefoot--print{display:none}}@media print{.littlefoot__popover,.littlefoot__button{display:none}}