.popout{position:relative}.popout__wrapper{display:none;opacity:0;transition:opacity .2s ease-in-out;position:absolute;top:100%;padding-top:1rem;z-index:1000}.popout__content{background-color:#fff;box-shadow:4px 4px 8px #0000001a;border-radius:1rem;border:1px solid rgb(221,221,221);position:relative;min-width:360px}.popout__content:before{content:"";position:absolute;top:-.75rem;right:2.25rem;width:1.5rem;height:1.5rem;background-color:#fff;border-left:1px solid rgb(221,221,221);border-top:1px solid rgb(221,221,221);transform:rotate(45deg);box-shadow:-2px -2px 4px #0000000d}@media (hover: hover){.popout__toggle:hover~.popout__wrapper{display:block;opacity:1;visibility:visible}@starting-style{.popout__toggle:hover~.popout__wrapper{opacity:0}}.popout__wrapper:hover{display:block;opacity:1;visibility:visible}}.popout__footer{padding:1rem 2rem;margin-top:1.5rem;text-align:center;border-top:1px solid rgb(221,221,221);display:flex;flex-direction:column;gap:.75rem}.popout--left .popout__wrapper{left:0}.popout:has(.popout__separator) .popout__footer{border-top:none;margin-top:0}.popout__separator{display:flex;align-items:center;text-align:center;text-transform:uppercase;font-weight:600}.popout__separator:before,.popout__separator:after{content:"";flex:1;border-bottom:1px solid rgb(221,221,221)}.popout__separator:has(.popout__separator-text):before{margin-right:.5rem}.popout__separator:has(.popout__separator-text):after{margin-left:.5rem}@media only screen and (max-width: 64rem){.popout__modal{position:fixed;top:0;left:0;right:0!important;bottom:0;z-index:1001;background-color:#0000004d;display:flex;justify-content:center;align-items:center}.popout__modal.show{visibility:visible;opacity:1}.popout__modal .popout__content{width:-moz-fit-content;width:fit-content;margin-top:0;border-radius:1rem;box-shadow:none;max-width:19.5rem}.popout__modal .popout__content:before{display:none}}
