@oiz/stzh-components 3.1.0 → 3.2.0-beta1

package/dist/cjs/stzh-popover_2.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"stzh-popover.stzh-text.entry.cjs.js","mappings":";;;;;;;;;;;;;AAAA,MAAM,cAAc,GAAG,ihVAAihV;;ACyCxiV,MAAM,uBAAuB,GAAG,GAAG,CAAC;AACpC,MAAM,uBAAuB,GAAG,GAAG,CAAC;AACpC,MAAM,6BAA6B,GAAG,GAAG,CAAC;AAC1C,MAAM,6BAA6B,GAAG,GAAG,CAAC;AAE1C,SAAS,2BAA2B;EAClC,MAAM,OAAO,GAAGA,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;EACvC,OAAO;IACL,SAAS,EAAE;MACT,EAAE,OAAO,EAAE,GAAG,EAAE;MAChB,EAAE,OAAO,EAAE,GAAG,EAAE;KACjB;IACD,OAAO,EAAE;MACP,QAAQ,EAAE,OAAO,GAAG,6BAA6B,GAAG,uBAAuB;MAC3E,MAAM,EAAE,QAAQ;KACjB;GACF,CAAC;AACJ,CAAC;AAED,SAAS,2BAA2B;EAClC,MAAM,OAAO,GAAGA,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;EACvC,OAAO;IACL,SAAS,EAAE;MACT,EAAE,OAAO,EAAE,GAAG,EAAE;MAChB,EAAE,OAAO,EAAE,GAAG,EAAE;KACjB;IACD,OAAO,EAAE;MACP,QAAQ,EAAE,OAAO,GAAG,6BAA6B,GAAG,uBAAuB;MAC3E,MAAM,EAAE,QAAQ;KACjB;GACF,CAAC;AACJ,CAAC;AAED,SAAS,mBAAmB;EAC1B,MAAM,OAAO,GAAGA,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;EACvC,OAAO;IACL,SAAS,EAAE;MACT,EAAE,SAAS,EAAE,OAAO,GAAG,kBAAkB,GAAG,kBAAkB,EAAE;MAChE,EAAE,SAAS,EAAE,iBAAiB,EAAE;KACjC;IACD,OAAO,EAAE;MACP,QAAQ,EAAE,OAAO,GAAG,6BAA6B,GAAG,uBAAuB;MAC3E,MAAM,EAAE,QAAQ;KACjB;GACF,CAAC;AACJ,CAAC;AAED,SAAS,mBAAmB;EAC1B,MAAM,OAAO,GAAGA,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC;EACvC,OAAO;IACL,SAAS,EAAE;MACT,EAAE,SAAS,EAAE,iBAAiB,EAAE;MAChC,EAAE,SAAS,EAAE,OAAO,GAAG,kBAAkB,GAAG,kBAAkB,EAAE;KACjE;IACD,OAAO,EAAE;MACP,QAAQ,EAAE,OAAO,GAAG,6BAA6B,GAAG,uBAAuB;MAC3E,MAAM,EAAE,QAAQ;KACjB;GACF,CAAC;AACJ,CAAC;AAED,MAAM,OAAO,GAAG;EACd,GAAG,EAAE,EAAE;CACR,CAAC;AAEF,MAAM,eAAe,GAAG,mBAAmB,CAAC;AAE5C,IAAI,cAAc,GAAG,CAAC,CAAC;MAaV,WAAW;;;;;;;IAiNd,kBAAa,GAAW,IAAI,CAAA;IAC5B,kBAAa,GAAW,IAAI,CAAA;IAM5B,kBAAa,GAAG,CAAC,KAAoB;MAC3C,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC,GAAG,EAAE;QACjC,IAAI,CAAC,IAAI,EAAE,CAAA;OACZ;KACF,CAAA;IAEO,mBAAc,GAAG;MACvB,IAAI,CAAC,MAAM,EAAE,CAAC;KACf,CAAA;IAEO,oBAAe,GAAG;MACxB,IAAIA,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE;QAC1B,MAAM,UAAU,GAAG;UACjBC,YAAM,CAAC;YACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,SAAS,EAAE,IAAI,CAAC,QAAQ;WACzB,CAAC;UACFC,UAAI,CAAC;YACH,OAAO,EAAE,CAAC;WACX,CAAC;UACFC,WAAK,CAAC;YACJ,OAAO,EAAE,CAAC;WACX,CAAC;SACH,CAAC;QAEF,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE;UAC9B,UAAU,CAAC,IAAI,CACbC,WAAK,CAAC;YACJ,OAAO,EAAE,IAAI,CAAC,YAAY;YAC1B,OAAO,EAAE,CAAC;WACX,CAAC,CACH,CAAC;SACH;QAED,MAAM,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,QAAQ,GAAG,UAAU,EAAE,SAAS,EAAE,cAAc,EAAE,GACpE,MAAMC,qBAAe,CAAC,IAAI,CAAC,mBAAmB,EAAE,IAAI,CAAC,aAAa,EAAE;UACpE,QAAQ,EAAE,IAAI,CAAC,QAAQ;UACvB,SAAS,EAAE,IAAI,CAAC,SAAS;UACzB,UAAU;SACX,CAAC,CAAC;QAEL,IAAI,CAAC,iBAAiB,GAAG,SAAS,CAAC;QAEnC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE;UACtC,QAAQ,EAAE,QAAQ;UAClB,IAAI,EAAE,GAAG,CAAC,IAAI;UACd,GAAG,EAAE,GAAG,CAAC,IAAI;SACd,CAAC,CAAC;QAEH,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE;UAC9B,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;YACrC,IAAI,EAAE,CAAC,IAAI,IAAI,GAAG,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI,GAAG,EAAE;YACpD,GAAG,EAAE,CAAC,IAAI,IAAI,GAAG,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC,IAAI,GAAG,EAAE;WACpD,CAAC,CAAC;SACJ;OACF;WAAM;QACL,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE;UACtC,QAAQ,EAAE,IAAI;UACd,IAAI,EAAE,IAAI;UACV,GAAG,EAAE,IAAI;SACV,CAAC,CAAC;QAEH,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE;UAC9B,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;YACrC,IAAI,EAAE,IAAI;YACV,GAAG,EAAE,IAAI;WACV,CAAC,CAAC;SACJ;OACF;KACF,CAAA;IAEO,qBAAgB,GAAG,CAAC,KAAiB;MAC3C,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAA;MACrC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,KAAK,CAAA;MAChC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC,KAAK,CAAA;KACjC,CAAA;;;;IAMO,mBAAc,GAAG,CAAC,KAAiB;MACzC,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAA;MACrC,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAA;MAC9C,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAA;MAC9C,MAAM,SAAS,GAAG,EAAE,CAAA;MAEpB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,SAAS;WACxC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC;MAElC,IAAI,QAAQ,EAAE;QACZ,IAAI,CAAC,IAAI,EAAE,CAAC;OACb;MAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAA;MACzB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAA;KAC1B,CAAA;IAEO,SAAI,GAAG;;MACb,IAAI,OAAO,GAAG,MAAA,IAAI,CAAC,cAAc,0CAAE,iBAAgC,CAAC;MAEpE,IAAI,CAAC,OAAO,EAAE;QACZ,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC;WAClD,IAAI,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,CAAgB,CAAA;QAE5D,OAAO,GAAG,WAAW,CAAC;OACvB;MAED,IAAI,OAAO,EAAE;QACX,IAAI,CAAC,mBAAmB,GAAG,OAAO,CAAC;QACnC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;OACxD;KACF,CAAA;gBAtUuD,KAAK;qBAGb,QAAQ;qBAGa,EAAE;mBAGC,SAAS;gBAG5B,SAAS;oBAGnC,CAAC;;iBAMJ,EAAE;oBAGe,UAAU;;;;;EAqBnD,MAAM,IAAI;IACR,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,OAAO;KACR;IAED,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAC5B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACjB,OAAOC,uBAAY,CAAC,IAAI,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;GACjD;;EAID,MAAM,IAAI;IACR,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACd,OAAO;KACR;IAED,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAC5B,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAClB,OAAOA,uBAAY,CAAC,IAAI,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;GACjD;;EAID,MAAM,MAAM;IACV,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,OAAO,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;KAC1B;SAAM;MACL,OAAO,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;KAC1B;GACF;EAGD,MAAM,MAAM;IACV,OAAO,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;GACrC;EAGD,kBAAkB,CAAC,KAAiB;IAClC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;MACd,OAAM;KACP;IAED,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,aAAa;SACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAqB,CAAC,KAAK,KAAK,CAAA;IAEvE,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,cAAc;SACtD,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAqB,CAAC,CAAA;IAE9D,IAAI,cAAc,IAAI,CAAC,cAAc,EAAE;MACrC,IAAI,CAAC,IAAI,EAAE,CAAA;KACZ;GACF;EAGD,MAAM,WAAW,CAAC,QAAiB;IACjC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;MACvB,OAAO;KACR;IAED,IAAI,QAAQ,EAAE;MACZ,IAAI,IAAI,CAAC,eAAe,EAAE;QACxB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;UACjB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;OACJ;MAED,MAAM,aAAa,GAAG,2BAA2B,EAAE,CAAC;MACpD,MAAM,mBAAmB,GAAG,mBAAmB,EAAE,CAAC;MAElD,MAAM,OAAO,CAAC,GAAG,CAAC;QAChBC,6BAAc,CAAC,IAAI,CAAC,qBAAqB,CAAC;QAC1CA,6BAAc,CAAC,IAAI,CAAC,cAAc,CAAC;QACnCA,6BAAc,CAAC,IAAI,CAAC,aAAa,CAAC;OACnC,CAAC,CAAC;;;MAIH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,UAAU,GAAG,wDAAwD,CAAC;MAC/F,IAAI,CAAC,qBAAqB,CAAC,MAAM,GAAG,KAAK,CAAC;MAE1C,MAAM,OAAO,CAAC,GAAG,CAAC;QAChBC,wBAAS,CACPR,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,qBAAqB,EACxE,aAAa,CAAC,SAAS,EACvB,aAAa,CAAC,OAAO,CACtB;QACDQ,wBAAS,CACPR,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,cAAc,EACjE,mBAAmB,CAAC,SAAS,EAC7B,mBAAmB,CAAC,OAAO,CAC5B;OACF,CAAC,CAAC;MAEH,IAAI,IAAI,CAAC,eAAe,EAAE;QACxB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;UACnB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;OACJ;KACF;SAAM;MACL,IAAI,IAAI,CAAC,eAAe,EAAE;QACxB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;UAClB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;OACJ;MAED,MAAM,aAAa,GAAG,2BAA2B,EAAE,CAAC;MACpD,MAAM,mBAAmB,GAAG,mBAAmB,EAAE,CAAC;MAElD,MAAM,OAAO,CAAC,GAAG,CAAC;QAChBO,6BAAc,CAAC,IAAI,CAAC,qBAAqB,CAAC;QAC1CA,6BAAc,CAAC,IAAI,CAAC,cAAc,CAAC;QACnCA,6BAAc,CAAC,IAAI,CAAC,aAAa,CAAC;OACnC,CAAC,CAAC;MAEH,MAAM,OAAO,CAAC,GAAG,CAAC;QAChBC,wBAAS,CACPR,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,qBAAqB,EACxE,aAAa,CAAC,SAAS,EACvB,aAAa,CAAC,OAAO,CACtB;QACDQ,wBAAS,CACPR,gBAAK,CAAC,OAAO,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,cAAc,EACjE,mBAAmB,CAAC,SAAS,EAC7B,mBAAmB,CAAC,OAAO,CAC5B;OACJ,CAAC,CAAC;MAED,IAAI,CAAC,qBAAqB,CAAC,MAAM,GAAG,IAAI,CAAC;MACzC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM,CAAC;MAE7C,IAAI,IAAI,CAAC,eAAe,EAAE;QACxB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;UACnB,SAAS,EAAE,cAAc;SAC1B,CAAC,CAAC;OACJ;KACF;IAED,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;GAC9B;EAGD,eAAe,CAAC,QAAgB;IAC9B,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MAChC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;KAC1B;SAAM;MACL,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,KAAK,SAAS,GAAG,EAAE,GAAG,CAAC,CAAC;KACrD;GACF;EAuID,MAAM,iBAAiB;IACrB,IAAI,CAAC,EAAE,GAAG,gBAAgB,cAAc,EAAE,EAAE,CAAC;IAE7C,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAEpC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;MACtB,IAAI,CAAC,YAAY,GAAG,MAAM,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;KAClG;GACF;EAEO,YAAY;IAClB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IAE7C,MAAM,MAAM,GAAGS,mBAAa,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAEvD,IAAI,CAAC,mBAAmB;OACrB,YAAY,CAAC,MAAM,GAAG,eAAe,GAAG,eAAe,EAAE,MAAM,CAAC,CAAC;IAEpE,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;KACtB;GACF;EAEO,aAAa;IACnB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC;IAEhD,MAAM,MAAM,GAAGA,mBAAa,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAEvD,IAAI,CAAC,mBAAmB;OACrB,YAAY,CAAC,MAAM,GAAG,eAAe,GAAG,eAAe,EAAE,OAAO,CAAC,CAAC;IAErE,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;KACxB;GACF;EAED,kBAAkB;IAChB,IAAI,CAAC,eAAe,EAAE,CAAC;IACvB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;IAEvD,MAAM,MAAM,GAAGA,mBAAa,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;IAEvD,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,kBAAkB,CAAC;UACnE,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC,EAC1E;MACA,IAAI,CAAC,mBAAmB;SACrB,YAAY,CAAC,MAAM,GAAG,kBAAkB,GAAG,kBAAkB,EAAE,GAAG,IAAI,CAAC,EAAE,sBAAsB,CAAC,CAAC;KACrG;IAED,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,YAAY,CAAC;UAC7D,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC,EACpE;MACA,IAAI,CAAC,mBAAmB;SACrB,YAAY,CAAC,MAAM,GAAG,YAAY,GAAG,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;KACnE;IAED,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,cAAc,CAAC;UAC/D,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC,EACrE;MACA,IAAI,CAAC,mBAAmB;SACrB,YAAY,CAAC,MAAM,GAAG,cAAc,GAAG,aAAa,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;KACtE;GACF;EAED,kBAAkB;IAChB,IAAI,CAAC,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;GACvD;EAED,gBAAgB;IACd,IAAI,CAAC,iBAAiB,GAAGC,gBAAU,CACjC,IAAI,CAAC,mBAAmB,EACxB,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,eAAe,CACrB,CAAC;IAEF,IAAI,CAAC,qBAAqB,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IAE/C,IAAI,CAAC,IAAI,GAAGC,6BAAe,CAAC,IAAI,CAAC,aAAa,EAAE;MAC9C,aAAa,EAAE,IAAI,CAAC,aAAa;MACjC,uBAAuB,EAAE,IAAI;MAC7B,uBAAuB,EAAE,IAAI;KAC9B,CAAC,CAAC;IAEH,IAAI,IAAI,CAAC,IAAI,EAAE;MACb,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;GACF;EAED,iBAAiB;IACf,IAAI,CAAC,IAAI,EAAE,CAAC;IAEZ,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAChD,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE;MAClC,SAAS,EAAE,IAAI;MACf,OAAO,EAAE,IAAI;KACd,CAAC,CAAC;GACJ;EAED,oBAAoB;IAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;MACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;KAC5B;IAED,IAAI,IAAI,CAAC,iBAAiB,EAAE;MAC1B,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAC1B;IAED,IAAI,IAAI,CAAC,mBAAmB,EAAE;MAC5B,IAAI,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;KAC5E;GACF;EAED,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,cAAc,EAAE,IAAI;MACpB,CAAC,oBAAoB,GAAG,IAAI,CAAC,IAAI;MACjC,CAAC,2BAA2B,IAAI,CAAC,iBAAiB,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,iBAAiB;MAC/E,CAAC,2BAA2B,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS;MAC/D,CAAC,iBAAiB,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;MAC3C,CAAC,iBAAiB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;KAClD,CAAC;IAEF,QACEC,QAACC,UAAI,QACHD,iBACE,KAAK,EAAE,OAAO,EACd,YAAY,EAAE,IAAI,CAAC,gBAAgB,EACnC,UAAU,EAAE,IAAI,CAAC,cAAc,IAE/BA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,cAAc,GAAG,EAAoB,CAAC,EACzD,KAAK,EAAC,uBAAuB,IAE7BA,qBAAa,CACT,EACNA,iBAAK,KAAK,EAAC,uBAAuB,EAAC,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,sBAAsB,IACpE,IAAI,CAAC,YAAY,CAAC,IAAI,CACnB,EACNA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,qBAAqB,GAAG,EAAoB,CAAC,EAChE,KAAK,EAAC,+BAA+B,IAErCA,iBAAK,KAAK,EAAC,wBAAwB,GAAO,EAC1CA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,cAAc,GAAG,EAAoB,CAAC,EACzD,KAAK,EAAC,uBAAuB,IAE7BA,iBACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,aAAa,GAAG,EAAoB,CAAC,EACxD,KAAK,EAAC,sBAAsB,EAC5B,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAC,IAAI,gBACF,MAAM,qBACA,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,iBAC1C,IAAI,CAAC,IAAI,GAAG,OAAO,GAAG,MAAM,EACzC,SAAS,EAAE,IAAI,CAAC,aAAa,IAE5B,IAAI,CAAC,OAAO,KAAK,SAAS;MACzBA,iBACE,KAAK,EAAC,qBAAqB,EAC3B,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,YAAY,GAAG,EAAoB,CAAC,EACvD,SAAS,EAAEE,WAAK,GACX,EAETF,iBAAK,KAAK,EAAC,6BAA6B,IACtCA,iBAAK,KAAK,EAAC,6BAA6B,IACtCA,gBAAI,EAAE,EAAE,GAAG,IAAI,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAC,qBAAqB,IACpD,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAGA,kBAAM,IAAI,EAAC,OAAO,GAAQ,CAClD,EACLA,oBACE,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,MAAM,IAAI,CAAC,IAAI,EAAE,EAC1B,IAAI,EAAC,QAAQ,IAEbA,uBAAW,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,oBAAoB,GAAa,EAC/DA,kBAAM,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,YAAY,CAAC,KAAK,CAAQ,CAC7D,CACL,EACNA,iBAAK,KAAK,EAAC,oCAAoC,IAC7CA,iBAAK,KAAK,EAAC,4BAA4B,IACrCA,kBAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,EACNA,iBAAK,KAAK,EAAC,2BAA2B,IACpCA,kBAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACF,CACF,CACF,CACF,CACF,CACD,EACP;GACH;;;;;;;;;ACpoBH,MAAM,WAAW,GAAG,o8oCAAo8oC;;MCkB38oC,QAAQ;;;gBAEQ,SAAS;iBAGU,SAAS;gBAGd,KAAK;iBAG6C,SAAS;gBAG7D,SAAS;qBAEJ,SAAS;sBAER,SAAS;qBAEV,SAAS;qBAET,SAAS;;EAErD,MAAM;IACJ,QACEA,QAACC,UAAI,QACHD,iBACE,KAAK,EAAE;QACL,WAAW,EAAE,IAAI;QACjB,oBAAoB,EAAE,IAAI,CAAC,IAAI;QAC/B,CAAC,mBAAmB,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;QAC7C,CAAC,oBAAoB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;QAChD,CAAC,mBAAmB,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;QAC7C,CAAC,yBAAyB,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS;QAC7D,CAAC,0BAA0B,IAAI,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,UAAU;QAChE,CAAC,yBAAyB,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS;QAC7D,CAAC,yBAAyB,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS;OAC9D,IAEDA,iBAAK,KAAK,EAAC,iBAAiB,IAC1BA,iBAAK,KAAK,EAAC,iBAAiB,IAC1BA,kBAAM,IAAI,EAAC,MAAM,GAAQ,CACrB,EACNA,iBAAK,KAAK,EAAC,uBAAuB,IAChCA,qBAAa,CACT,CACF,CACF,CACD,EACP;GACH;;;;;;;","names":["media","offset","flip","shift","arrow","computePosition","waitForEvent","stopAnimations","animateTo","isStzhElement","autoUpdate","createFocusTrap","h","Host","Arrow"],"sources":["src/components/stzh-popover/stzh-popover.scss?tag=stzh-popover&encapsulation=scoped","src/components/stzh-popover/stzh-popover.tsx","src/components/stzh-text/stzh-text.scss?tag=stzh-text&encapsulation=scoped","src/components/stzh-text/stzh-text.tsx"],"sourcesContent":["/**\n * @prop --width: Width of popover above small breakpoint\n * @prop --min-width: Minimum width of popover above small breakpoint\n * @prop --max-width: Maximum width of popover above small breakpoint\n * @prop --padding: Padding of popover\n * @prop --content-padding: Padding of popover content\n * @prop --border-radius: Border radius of popover\n * @prop --backdrop-opacity: Opacity of popover backdrop (used on mikro breakpoint)\n *\n * @prop --stzh-popover-width: **Global**: Width of popover above small breakpoint (default `223px`)\n * @prop --stzh-popover-min-width: **Global**: Minimum width of popover above small breakpoint (default `initial`)\n * @prop --stzh-popover-max-width: **Global**: Maximum width of popover above small breakpoint (default `initial`)\n * @prop --stzh-popover-padding: **Global**: Padding of popover (default `0px`)\n * @prop --stzh-popover-content-padding: **Global**: Padding of popover content (default `8px 0px`)\n * @prop --stzh-popover-border-radius: **Global**: Border radius of popover above small breakpoint (default `3px`)\n *\n * @prop --stzh-dialog-backdrop-opacity: **Global**: Opacity of backdrops\n * @prop --stzh-dialog-backdrop-background-color: **Global**: Background color of backdrops\n */\n\n:host {\n  display: contents;\n\n  --color: #{$colorBlack};\n  --width: #{$popoverWidth};\n  --min-width: #{$popoverMinWidth};\n  --max-width: #{$popoverMaxWidth};\n  --height: auto;\n  --min-height: initial;\n  --max-height: initial;\n  --padding: #{$popoverPadding};\n  --content-padding: #{$popoverContentPadding};\n  --border-radius: #{$popoverBorderRadius};\n  --background-color: #{$popoverBackgroundColor};\n  --backdrop-opacity: #{$dialogBackdropOpacity};\n  --backdrop-background-color: #{$dialogBackdropBackgroundColor};\n\n  &[size=\"large\"] {\n    --content-padding: #{$popoverLargeContentPadding};\n  }\n\n  &[variant=\"secondary\"] {\n    --background-color: #{$colorSecondary20};\n  }\n\n  &[variant=\"tooltip\"] {\n    --width: #{$tooltipWidth};\n    --min-width: #{$tooltipMinWidth};\n    --max-width: #{$tooltipMaxWidth};\n    --content-padding: #{space('small')} #{space('large')};\n    --border-radius: #{$tooltipBorderRadius};\n\n    @include mq($from: small) {\n      --content-padding: #{$tooltipPadding};\n      --color: #{$colorWhite};\n      --link-color: #{$colorWhite};\n      --hover-link-color: #{$colorWhite70op};\n      --background-color: #{$colorCoolgrey60};\n    }\n  }\n}\n\n.stzh-popover {\n  @include tooltip-arrow;\n  display: contents;\n\n  &__trigger {\n    display: contents;\n  }\n\n  &__content-wrapper {\n    // position: absolute;\n    // width: 100%;\n    // height: 100%;\n    // pointer-events: none;\n    display: contents;\n\n    @include mq($to: small) {\n      z-index: $zIndexDialog;\n      display: flex;\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      flex-direction: column;\n      align-items: stretch;\n      justify-content: stretch;\n    }\n  }\n\n  &__backdrop {\n    display: contents;\n\n    @include mq($to: small) {\n      z-index: 1;\n      position: absolute;\n      display: block;\n      top: 0px;\n      left: 0px;\n      width: 100%;\n      height: 100%;\n      overflow-x: hidden;\n      overflow-y: auto;\n      text-align: center;\n      background-color: var(--backdrop-background-color);\n      opacity: var(--backdrop-opacity);\n    }\n  }\n\n  &__content {\n    // pointer-events: all;\n    display: contents;\n\n    @include mq($to: small) {\n      z-index: 2;\n      position: relative;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      flex-grow: 1;\n      overflow: auto;\n    }\n  }\n\n  &__dialog {\n    margin-top: auto;\n    width: 100%;\n    overflow: visible;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n    background-color: var(--background-color);\n    touch-action: none;\n    outline: none;\n    border-bottom: 2px solid $colorOldGrey13;\n    color: var(--color);\n\n    --stzh-base-color: var(--color);\n    --stzh-link-color: var(--link-color);\n    // TODO: check with designer\n    --stzh-link-hover-color: var(--hover-link-color);\n\n    @include mq($from: small) {\n      z-index: $zIndexPopover;\n      position: absolute;\n      display: flex;\n      width: var(--width);\n      min-width: var(--min-width);\n      max-width: var(--max-width);\n      // max-width: calc(100vw - var(--stzh-scrollbar-width) - #{space('small')});\n      height: var(--height);\n      min-height: var(--min-height);\n      max-height: var(--max-height);\n      left: auto;\n      right: auto;\n      bottom: auto;\n      border-radius: var(--border-radius);\n      box-shadow: $boxShadowPopover;\n      border: none;\n    }\n  }\n\n  &__content-inner,\n  &__content-slot-wrapper {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n  }\n\n  &__content-slot-wrapper {\n    padding: var(--padding);\n  }\n\n  &__content-slot {\n    overflow-y: auto;\n    overflow-x: hidden;\n    overflow-scrolling: touch;\n    padding: var(--content-padding);\n  }\n\n  &__action-slot {\n    display: flex;\n    flex-direction: column;\n\n    // &:not(:empty) {\n    //   margin: space('xsmall') space('small');\n    //   margin-bottom: space('medium');\n    // }\n  }\n\n  &__label-wrapper {\n    display: flex;\n    align-items: center;\n    padding: space('small') space('large');\n    padding-right: space('medium');\n    border-bottom: 1px solid $baseBorderColor;\n    color: $colorOldGrey70;\n\n    @include mq($from: small) {\n      padding: 0;\n      border-bottom: 0;\n    }\n  }\n\n  &__label {\n    @include font('heavy');\n    @include fontCurve('p2');\n    margin: 0;\n    margin-right: space('small');\n\n    @include mq($from: small) {\n      @include visuallyhidden;\n    }\n  }\n\n  &__close {\n    visibility: $popoverCloseVisibility;\n    cursor: pointer;\n    display: flex;\n    appearance: none;\n    font-family: inherit;\n    border: none;\n    background-color: transparent;\n    padding: 0;\n    margin-left: auto;\n    border-radius: 50%;\n    color: $baseLeadColor;\n    padding: space('xxsmall');\n  }\n\n  &__icon {\n    --size: #{iconSize('xsmall')};\n  }\n\n  &__arrow {\n    position: absolute;\n    display: none;\n\n    @include mq($from: small) {\n      display: flex;\n    }\n  }\n\n  &__vhidden {\n    @include visuallyhidden;\n  }\n\n  /* Only non tooltip variants */\n\n  &--default &__close,\n  &--secondary &__close {\n    &:focus {\n      box-shadow: 0 0 0 1px $colorPrimary;\n    }\n\n    @include mq($from: small) {\n      @include visuallyhiddenFocusable;\n      position: absolute;\n      top: 0;\n      right: 0;\n      transform: translate(30%, -30%);\n      background-color: $colorOldGrey5;\n    }\n  }\n\n  /* Tooltip variant */\n\n  &--tooltip &__content-inner {\n    @include mq($from: small) {\n      flex-direction: row-reverse;\n      align-items: flex-start;\n    }\n  }\n\n  &--tooltip &__close {\n    visibility: visible;\n\n    @include mq($from: small) {\n      @include tooltip__close;\n    }\n  }\n\n  &--tooltip &__icon {\n    @include mq($from: small) {\n      @include tooltip__icon;\n    }\n  }\n\n  &--tooltip &__dialog {\n    @include mq($from: small) {\n      @include tooltip-dropshadow;\n    }\n  }\n\n  &--tooltip &__content-slot {\n    @include mq($from: small) {\n      @include tooltip-fontsize;\n    }\n  }\n\n  /* Has fullwidth popover */\n\n  &--popover-fullwidth-horizontal &__dialog {\n    @include mq($from: small) {\n      left: 0 !important;\n      right: 0 !important;\n      width: 100%;\n    }\n  }\n\n  &--popover-fullwidth-vertical &__dialog {\n    @include mq($from: small) {\n      top: 0 !important;\n      bottom: 0 !important;\n      height: 100%;\n    }\n  }\n}\n","import {\n  Host,\n  Element,\n  Component,\n  Prop,\n  Listen,\n  Event,\n  EventEmitter,\n  h,\n  Method,\n  State,\n  Watch,\n} from \"@stencil/core\";\n\nimport {\n  StzhPopoverOpenEvent,\n  StzhPopoverOpenedEvent,\n  StzhPopoverCloseEvent,\n  StzhPopoverClosedEvent\n} from \"../../index\";\n\nimport {\n  computePosition,\n  offset,\n  shift,\n  flip,\n  arrow,\n  autoUpdate,\n  Placement,\n} from \"@floating-ui/dom\";\n\nimport { createFocusTrap, FocusTrap } from \"focus-trap\";\nimport { isStzhElement } from \"../../utils/utils\";\nimport { media } from \"../../utils/media-utils\";\nimport { waitForEvent } from \"../../utils/event-utils\";\nimport { stopAnimations, animateTo } from \"../../utils/animation-utils\";\n\nimport { StzhPopoverLocalizedText } from \"./stzh-popover.localization\";\n\nimport Arrow from \"../stzh-tooltip/assets/arrow.svg\";\n\nconst ANIMATION_SHOW_DURATION = 200;\nconst ANIMATION_HIDE_DURATION = 300;\nconst ANIMATION_SHOW_DURATION_SMALL = 100;\nconst ANIMATION_HIDE_DURATION_SMALL = 200;\n\nfunction animationContentWrapperShow() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [\n      { opacity: \"0\" },\n      { opacity: \"1\" }\n    ],\n    options: {\n      duration: isSmall ? ANIMATION_SHOW_DURATION_SMALL : ANIMATION_SHOW_DURATION,\n      easing: \"linear\"\n    }\n  };\n}\n\nfunction animationContentWrapperHide() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [\n      { opacity: \"1\" },\n      { opacity: \"0\" }\n    ],\n    options: {\n      duration: isSmall ? ANIMATION_HIDE_DURATION_SMALL : ANIMATION_HIDE_DURATION,\n      easing: \"linear\"\n    }\n  };\n}\n\nfunction animationDialogShow() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [\n      { transform: isSmall ? \"translateY(-8px)\" : \"translateY(100%)\" },\n      { transform: \"translateY(0px)\" }\n    ],\n    options: {\n      duration: isSmall ? ANIMATION_SHOW_DURATION_SMALL : ANIMATION_SHOW_DURATION,\n      easing: \"linear\"\n    }\n  };\n}\n\nfunction animationDialogHide() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [\n      { transform: \"translateY(0px)\" },\n      { transform: isSmall ? \"translateY(-8px)\" : \"translateY(100%)\" }\n    ],\n    options: {\n      duration: isSmall ? ANIMATION_HIDE_DURATION_SMALL : ANIMATION_HIDE_DURATION,\n      easing: \"linear\"\n    }\n  };\n}\n\nconst keyCode = {\n  ESC: 27\n};\n\nconst CLASS_BODY_OPEN = \"stzh-popover-open\";\n\nlet popoverCounter = 0;\n\n/**\n * @slot - Trigger element for popover\n * @slot content - Any element used as popover content\n * @slot action - `stzh-button` element\n * @slot label - Label for mobile view (alternative for label property)\n */\n@Component({\n  tag: \"stzh-popover\",\n  styleUrl: \"stzh-popover.scss\",\n  scoped: true\n})\nexport class StzhPopover {\n  /** Whether popover should be open */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Default placement of popover relative to trigger element */\n  @Prop({ reflect: true }) placement: Placement = \"bottom\";\n\n  /** Whether to stretch popover to fullwith of parent */\n  @Prop({ reflect: true }) fullwidth: \"horizontal\" | \"vertical\" | \"\" = \"\";\n\n  /** Variant */\n  @Prop({ reflect: true }) variant: \"default\" | \"secondary\" | \"tooltip\" = \"default\";\n\n  /** Size */\n  @Prop({ reflect: true }) size: \"default\" | \"large\" = \"default\";\n\n  /** Shifting of popover content */\n  @Prop() skidding: number = 0;\n\n  /** Distance from popover content to trigger. \"8\" when default variant, \"16\" when tooltip variant, arrow height (8px) + spacing (4px) = 12. */\n  @Prop() distance: number;\n\n  /** Label for mobile view (use label slot as alternative) */\n  @Prop() label: string = \"\";\n\n  /** Position strategy */\n  @Prop() strategy: \"absolute\" | \"fixed\" = \"absolute\";\n\n  /** Translation strings. */\n  @Prop() localization: StzhPopoverLocalizedText;\n\n  @Element() element: HTMLStzhPopoverElement;\n\n  /** Popover open event */\n  @Event() stzhOpen: EventEmitter<StzhPopoverOpenEvent>;\n\n  /** Popover opened event (after animation) */\n  @Event() stzhOpened: EventEmitter<StzhPopoverOpenedEvent>;\n\n  /** Popover close event */\n  @Event() stzhClose: EventEmitter<StzhPopoverCloseEvent>;\n\n  /** Popover closed event (after animation) */\n  @Event() stzhClosed: EventEmitter<StzhPopoverClosedEvent>;\n\n  /** Show popover content */\n  @Method()\n  async show() {\n    if (this.open) {\n      return;\n    }\n\n    this.toggledByMethod = true;\n    this.open = true;\n    return waitForEvent(this.element, \"stzhOpened\");\n  }\n\n  /** Hide popover content */\n  @Method()\n  async hide() {\n    if (!this.open) {\n      return;\n    }\n\n    this.toggledByMethod = true;\n    this.open = false;\n    return waitForEvent(this.element, \"stzhClosed\");\n  }\n\n  /** Toggle popover content */\n  @Method()\n  async toggle() {\n    if (this.open) {\n      return await this.hide();\n    } else {\n      return await this.show();\n    }\n  }\n\n  @Method()\n  async update() {\n    return await this.computePosition();\n  }\n\n  @Listen(\"click\", { target: \"document\", capture: true })\n  handleOutsideClick(event: MouseEvent) {\n    if (!this.open) {\n      return\n    }\n\n    const isClickOutside = event.target !== this.dialogElement\n      && this.dialogElement.contains(event.target as HTMLElement) === false\n\n    const isClickTrigger = event.target === this.triggerElement\n      || this.triggerElement.contains(event.target as HTMLElement)\n\n    if (isClickOutside && !isClickTrigger) {\n      this.hide()\n    }\n  }\n\n  @Watch(\"open\")\n  async openWatcher(newValue: boolean) {\n    if (!this.dialogElement) {\n      return;\n    }\n\n    if (newValue) {\n      if (this.toggledByMethod) {\n        this.stzhOpen.emit({\n          component: \"stzh-popover\",\n        });\n      }\n\n      const animationShow = animationContentWrapperShow();\n      const animationShowDialog = animationDialogShow();\n\n      await Promise.all([\n        stopAnimations(this.contentWrapperElement),\n        stopAnimations(this.contentElement),\n        stopAnimations(this.dialogElement)\n      ]);\n\n      // safari seems to need will-change,\n      // otherwise it has problems animating the element with the drop shadow\n      this.dialogElement.style.willChange = \"transform, opacity, position, top, left, bottom, right\";\n      this.contentWrapperElement.hidden = false;\n\n      await Promise.all([\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentWrapperElement,\n          animationShow.keyframes,\n          animationShow.options\n        ),\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentElement,\n          animationShowDialog.keyframes,\n          animationShowDialog.options\n        )\n      ]);\n\n      if (this.toggledByMethod) {\n        this.stzhOpened.emit({\n          component: \"stzh-popover\"\n        });\n      }\n    } else {\n      if (this.toggledByMethod) {\n        this.stzhClose.emit({\n          component: \"stzh-popover\",\n        });\n      }\n\n      const animationHide = animationContentWrapperHide();\n      const animationHideDialog = animationDialogHide();\n\n      await Promise.all([\n        stopAnimations(this.contentWrapperElement),\n        stopAnimations(this.contentElement),\n        stopAnimations(this.dialogElement)\n      ]);\n\n      await Promise.all([\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentWrapperElement,\n          animationHide.keyframes,\n          animationHide.options\n        ),\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentElement,\n          animationHideDialog.keyframes,\n          animationHideDialog.options\n        ),\n    ]);\n\n      this.contentWrapperElement.hidden = true;\n      this.dialogElement.style.willChange = \"auto\";\n\n      if (this.toggledByMethod) {\n        this.stzhClosed.emit({\n          component: \"stzh-popover\"\n        });\n      }\n    }\n\n    this.toggledByMethod = false;\n  }\n\n  @Watch(\"distance\")\n  distanceWatcher(newValue: number) {\n    if (typeof newValue === \"number\") {\n      this.distance = newValue;\n    } else {\n      this.distance = this.variant === \"tooltip\" ? 12 : 8;\n    }\n  }\n\n  @State() computedPlacement: Placement;\n\n  private observer: MutationObserver;\n\n  private contentWrapperElement: HTMLElement;\n  private contentElement: HTMLElement;\n  private arrowElement: HTMLElement;\n  private triggerElement: HTMLElement;\n  private triggerFirstElement: HTMLElement;\n  private dialogElement: HTMLElement;\n  private autoUpdateCleanup: Function;\n\n  private initialTouchX: number = null\n  private initialTouchY: number = null\n\n  private id: string;\n  private trap: FocusTrap;\n  private toggledByMethod: boolean;\n\n  private handleKeydown = (event: KeyboardEvent) => {\n    if (event.keyCode === keyCode.ESC) {\n      this.hide()\n    }\n  }\n\n  private onClickTrigger = () => {\n    this.toggle();\n  }\n\n  private computePosition = async () => {\n    if (media(\"small\").matches) {\n      const middleware = [\n        offset({\n          mainAxis: this.distance,\n          crossAxis: this.skidding\n        }),\n        flip({\n          padding: 5\n        }),\n        shift({\n          padding: 5\n        })\n      ];\n\n      if (this.variant === \"tooltip\") {\n        middleware.push(\n          arrow({\n            element: this.arrowElement,\n            padding: 5\n          })\n        );\n      }\n\n      const { x = 0, y = 0, strategy = \"absolute\", placement, middlewareData }\n        = await computePosition(this.triggerFirstElement, this.dialogElement, {\n          strategy: this.strategy,\n          placement: this.placement,\n          middleware,\n        });\n\n      this.computedPlacement = placement;\n\n      Object.assign(this.dialogElement.style, {\n        position: strategy,\n        left: `${x}px`,\n        top: `${y}px`,\n      });\n\n      if (this.variant === \"tooltip\") {\n        Object.assign(this.arrowElement.style, {\n          left: x != null ? `${middlewareData.arrow.x}px` : \"\",\n          top: y != null ? `${middlewareData.arrow.y}px` : \"\",\n        });\n      }\n    } else {\n      Object.assign(this.dialogElement.style, {\n        position: null,\n        left: null,\n        top: null,\n      });\n\n      if (this.variant === \"tooltip\") {\n        Object.assign(this.arrowElement.style, {\n          left: null,\n          top: null,\n        });\n      }\n    }\n  }\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const touch = event.changedTouches[0]\n    this.initialTouchX = touch.pageX\n    this.initialTouchY = touch.pageY\n  }\n\n  // private handleTouchMove = (event: TouchEvent) => {\n  //   event.preventDefault()\n  // }\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const touch = event.changedTouches[0]\n    const distX = touch.pageX - this.initialTouchX // get horizontal dist traveled\n    const distY = touch.pageY - this.initialTouchY // get vertical dist traveled\n    const threshold = 70\n\n    const isYSwipe = Math.abs(distY) >= threshold\n      && Math.abs(distX) <= threshold;\n\n    if (isYSwipe) {\n      this.hide();\n    }\n\n    this.initialTouchY = null\n    this.initialTouchX = null\n  }\n\n  private init = () => {\n    let trigger = this.triggerElement?.firstElementChild as HTMLElement;\n\n    if (!trigger) {\n      const defaultSlot = Array.from(this.element.children)\n        .find(child => !child.hasAttribute(\"slot\")) as HTMLElement\n\n      trigger = defaultSlot;\n    }\n\n    if (trigger) {\n      this.triggerFirstElement = trigger;\n      trigger.addEventListener(\"click\", this.onClickTrigger);\n    }\n  }\n\n  async componentWillLoad() {\n    this.id = `stzh-popover-${popoverCounter++}`;\n\n    this.distanceWatcher(this.distance);\n\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"popover\");\n    }\n  }\n\n  private popoverShown() {\n    document.body.classList.add(CLASS_BODY_OPEN);\n\n    const isStzh = isStzhElement(this.triggerFirstElement);\n\n    this.triggerFirstElement\n      .setAttribute(isStzh ? \"a11y-expanded\" : \"aria-expanded\", \"true\");\n\n    if (this.trap) {\n      this.trap.activate();\n    }\n  }\n\n  private popoverHidden() {\n    document.body.classList.remove(CLASS_BODY_OPEN);\n\n    const isStzh = isStzhElement(this.triggerFirstElement);\n\n    this.triggerFirstElement\n      .setAttribute(isStzh ? \"a11y-expanded\" : \"aria-expanded\", \"false\");\n\n    if (this.trap) {\n      this.trap.deactivate();\n    }\n  }\n\n  componentDidRender() {\n    this.computePosition();\n    this.open ? this.popoverShown() : this.popoverHidden();\n\n    const isStzh = isStzhElement(this.triggerFirstElement);\n\n    if ((isStzh && !this.triggerFirstElement.getAttribute(\"a11y-describedby\"))\n      || (!isStzh && !this.triggerFirstElement.getAttribute(\"aria-describedby\"))\n    ) {\n      this.triggerFirstElement\n        .setAttribute(isStzh ? \"a11y-describedby\" : \"aria-describedby\", `${this.id}-trigger-description`);\n    }\n\n    if ((isStzh && !this.triggerFirstElement.getAttribute(\"a11y-label\"))\n      || (!isStzh && !this.triggerFirstElement.getAttribute(\"aria-label\"))\n    ) {\n      this.triggerFirstElement\n        .setAttribute(isStzh ? \"a11y-label\" : \"aria-label\", this.label);\n    }\n\n    if ((isStzh && !this.triggerFirstElement.getAttribute(\"analytics-id\"))\n      || (!isStzh && !this.triggerFirstElement.getAttribute(\"s-object-id\"))\n    ) {\n      this.triggerFirstElement\n        .setAttribute(isStzh ? \"analytics-id\" : \"s-object-id\", this.label);\n    }\n  }\n\n  componentDidUpdate() {\n    this.trap.updateContainerElements(this.dialogElement);\n  }\n\n  componentDidLoad() {\n    this.autoUpdateCleanup = autoUpdate(\n      this.triggerFirstElement,\n      this.dialogElement,\n      this.computePosition\n    );\n\n    this.contentWrapperElement.hidden = !this.open;\n\n    this.trap = createFocusTrap(this.dialogElement, {\n      fallbackFocus: this.dialogElement,\n      clickOutsideDeactivates: true,\n      returnFocusOnDeactivate: true\n    });\n\n    if (this.open) {\n      this.popoverShown();\n    }\n  }\n\n  connectedCallback() {\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n\n    if (this.autoUpdateCleanup) {\n      this.autoUpdateCleanup();\n    }\n\n    if (this.triggerFirstElement) {\n      this.triggerFirstElement.removeEventListener(\"click\", this.onClickTrigger);\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-popover\": true,\n      [`stzh-popover--open`]: this.open,\n      [`stzh-popover--placement-${this.computedPlacement}`]: !!this.computedPlacement,\n      [`stzh-popover--fullwidth-${this.fullwidth}`]: !!this.fullwidth,\n      [`stzh-popover--${this.size}`]: !!this.size,\n      [`stzh-popover--${this.variant}`]: !!this.variant\n    };\n\n    return (\n      <Host>\n        <div\n          class={classes}\n          onTouchStart={this.handleTouchStart}\n          onTouchEnd={this.handleTouchEnd}\n        >\n          <div\n            ref={(el) => (this.triggerElement = el as HTMLDivElement)}\n            class=\"stzh-popover__trigger\"\n          >\n            <slot></slot>\n          </div>\n          <div class=\"stzh-popover__vhidden\" id={`${this.id}-trigger-description`}>\n            {this.localization.open}\n          </div>\n          <div\n            ref={(el) => (this.contentWrapperElement = el as HTMLDivElement)}\n            class=\"stzh-popover__content-wrapper\"\n          >\n            <div class=\"stzh-popover__backdrop\"></div>\n            <div\n              ref={(el) => (this.contentElement = el as HTMLDivElement)}\n              class=\"stzh-popover__content\"\n            >\n              <div\n                ref={(el) => (this.dialogElement = el as HTMLDivElement)}\n                class=\"stzh-popover__dialog\"\n                role=\"dialog\"\n                tabindex=\"-1\"\n                aria-modal=\"true\"\n                aria-labelledby={this.label ? `${this.id}-label` : null}\n                aria-hidden={this.open ? \"false\" : \"true\"}\n                onKeyDown={this.handleKeydown}\n              >\n                {this.variant === \"tooltip\" &&\n                  <div\n                    class=\"stzh-popover__arrow\"\n                    ref={(el) => (this.arrowElement = el as HTMLDivElement)}\n                    innerHTML={Arrow}\n                  ></div>\n                }\n                <div class=\"stzh-popover__content-inner\">\n                  <div class=\"stzh-popover__label-wrapper\">\n                    <h2 id={`${this.id}-label`} class=\"stzh-popover__label\">\n                      {this.label ? this.label : <slot name=\"label\"></slot>}\n                    </h2>\n                    <button\n                      class=\"stzh-popover__close\"\n                      onClick={() => this.hide()}\n                      type=\"button\"\n                    >\n                      <stzh-icon name=\"close\" class=\"stzh-popover__icon\"></stzh-icon>\n                      <span class=\"stzh-popover__vhidden\">{this.localization.close}</span>\n                    </button>\n                  </div>\n                  <div class=\"stzh-popover__content-slot-wrapper\">\n                    <div class=\"stzh-popover__content-slot\">\n                      <slot name=\"content\"></slot>\n                    </div>\n                    <div class=\"stzh-popover__action-slot\">\n                      <slot name=\"action\"></slot>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","/**\n * @prop --color: Text color (also `color` can be overwritten)\n * @prop --icon-size: Icon size\n * @prop --icon-vertical-align: Icon vertical alignment\n *\n * @prop --stzh-base-color: **Global**: Text color\n * @prop --stzh-base-lead-color: **Global**: Lead text color\n */\n\n:host {\n  --icon-size: 1.25em;\n  --icon-vertical-align: text-bottom;\n  --color: #{$baseColor};\n  --display: var(--stzh-text-display, block);\n\n  width: 100%;\n  color: var(--color);\n\n  --grid-template-areas: var(\n    --stzh-text-grid-template-areas,\n    \"text text text text\"\n  );\n\n  --grid-template-columns: var(\n    --stzh-text-grid-template-columns,\n    #{$gridColumns}\n  );\n\n  @include mq($from: small) {\n    --grid-template-areas: var(\n      --stzh-text-grid-template-areas,\n      \"text text text text\"\n    );\n  }\n\n  @include mq($from: medium) {\n    --grid-template-areas: var(\n      --stzh-text-grid-template-areas,\n      \"text text text text text text text text\"\n    );\n\n    --grid-template-columns: var(\n      --stzh-text-grid-template-columns,\n      #{$gridColumnsMedium}\n    );\n  }\n\n  ::slotted(*:first-child) {\n    margin-top: 0 !important;\n  }\n\n  ::slotted(*:last-child) {\n    margin-bottom: 0 !important;\n  }\n\n  ::slotted(a),\n  ::slotted(* a) {\n    color: $linkColor;\n    transition: color $baseTransitionAnimationSpeed;\n    border-radius: $buttonBorderRadius;\n    text-underline-offset: $linkTextUnderlineOffset;\n    text-decoration-line: $linkTextDecorationLine;\n    text-decoration-thickness: $linkTextDecorationThickness;\n    text-decoration-skip-ink: $linkTextDecorationSkipInk;\n\n    &:hover {\n      color: $linkHoverColor;\n      text-decoration-line: $linkHoverTextDecorationLine;\n    }\n\n    &:hover {\n      color: $linkHoverColor;\n    }\n  }\n\n  ::slotted(b),\n  ::slotted(strong),\n  ::slotted(* b),\n  ::slotted(* strong) {\n    @include font('heavy');\n  }\n\n  ::slotted(i),\n  ::slotted(em),\n  ::slotted(* i),\n  ::slotted(* em) {\n    @include font;\n  }\n\n  &[lead]:not([lead=\"false\"]) {\n    --color: #{$baseLeadColor};\n  }\n\n  &[color=\"primary\"] {\n    --color: #{$colorPrimary70};\n  }\n\n  &[color=\"secondary\"] {\n    --color: #{$colorSecondary60};\n  }\n\n  &[color=\"info\"] {\n    --color: #{$textInfoColor};\n  }\n\n  &[color=\"inherit\"] {\n    --color: initial;\n  }\n}\n\n.stzh-text {\n  --stzh-icon-size: var(--icon-size);\n  --stzh-icon-vertical-align: var(--icon-vertical-align);\n\n  --stzh-list-font-size: \"\";\n  --stzh-list-line-height: \"\";\n  --stzh-list-letter-spacing: \"\";\n\n  // default font styling without attributes\n  @include fontCurve($textFontCurveDefault);\n  @include gridGutter;\n  display: var(--display);\n  grid-template-areas: var(--grid-template-areas);\n  grid-template-columns: var(--grid-template-columns);\n\n  color: var(--color);\n\n  &__text {\n    grid-area: text;\n    display: flex;\n  }\n\n  &__icon {\n    flex-shrink: 0;\n\n    &:not(:empty) {\n      margin-right: 0.25em;\n    }\n  }\n\n  &__text-inner {\n    flex-grow: 1;\n  }\n\n  /* Lead variant */\n\n  &--is-lead {\n    @include font('heavy');\n    @include fontCurve('lead', 'lead');\n  }\n\n  /* Font variants */\n\n  @each $font, $value in $fonts {\n    &--font-#{$font} {\n      @include font($font);\n    }\n  }\n\n  /* Curve variants */\n\n  &--curve-none {\n    font-size: inherit;\n  }\n\n  @each $fontCurveName, $config in $fontCurves {\n    &--curve-#{$fontCurveName} {\n      @include fontCurve($fontCurveName);\n    }\n  }\n\n  /* Size variants when consumer wants to overwrite predefined font curves */\n\n  @each $size, $value in $fontSizes {\n    &--size-#{$size} {\n      @include fontSize($size);\n    }\n  }\n\n  @each $breakpoint, $size in $breakpoints {\n    @each $size, $value in $fontSizes {\n      &--size-#{$breakpoint}-#{$size} {\n        @include mq($from: $breakpoint) {\n          @include fontSize($size);\n        }\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Font } from \"../../index\";\n\n/**\n * @slot - Slot for text and icons\n * @slot icon - Slot for icon that should be on left side of the text (not inline)\n */\n@Component({\n  tag: \"stzh-text\",\n  styleUrl: \"stzh-text.scss\",\n  scoped: true\n})\nexport class StzhText {\n  /** Font used */\n  @Prop() font: Font.Fonts = \"default\";\n\n  /** Type of curve (see [Spacings docs page](/docs/tokens-typography--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Font.Curves = \"default\";\n\n  /** Whether if text is lead text */\n  @Prop({ reflect: true }) lead: boolean = false;\n\n  /** Color used */\n  @Prop({ reflect: true }) color: \"default\" | \"primary\" | \"secondary\" | \"info\" | \"inherit\" = \"default\";\n\n  /** Manually overwrite font size applied by curve attribute (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() size: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above small breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeSmall: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above medium breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeMedium: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above large breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeLarge: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above ultra breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeUltra: Font.Sizes | \"inherit\" = \"inherit\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-text\": true,\n            \"stzh-text--is-lead\": this.lead,\n            [`stzh-text--font-${this.font}`]: !!this.font,\n            [`stzh-text--curve-${this.curve}`]: !!this.curve,\n            [`stzh-text--size-${this.size}`]: !!this.size,\n            [`stzh-text--size-small-${this.sizeSmall}`]: !!this.sizeSmall,\n            [`stzh-text--size-medium-${this.sizeMedium}`]: !!this.sizeMedium,\n            [`stzh-text--size-large-${this.sizeLarge}`]: !!this.sizeLarge,\n            [`stzh-text--size-ultra-${this.sizeUltra}`]: !!this.sizeUltra,\n          }}\n        >\n          <div class=\"stzh-text__text\">\n            <div class=\"stzh-text__icon\">\n              <slot name=\"icon\"></slot>\n            </div>\n            <div class=\"stzh-text__text-inner\">\n              <slot></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-popover.stzh-text.entry.cjs.js","mappings":"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","names":["media","offset","flip","shift","arrow","computePosition","waitForEvent","stopAnimations","animateTo","isStzhElement","autoUpdate","createFocusTrap","addMediaChangeListener","removeMediaChangeListener","h","Host","Arrow"],"sources":["src/components/stzh-popover/stzh-popover.scss?tag=stzh-popover&encapsulation=scoped","src/components/stzh-popover/stzh-popover.tsx","src/components/stzh-text/stzh-text.scss?tag=stzh-text&encapsulation=scoped","src/components/stzh-text/stzh-text.tsx"],"sourcesContent":["/**\n * @prop --width: Width of popover above small breakpoint\n * @prop --min-width: Minimum width of popover above small breakpoint\n * @prop --max-width: Maximum width of popover above small breakpoint\n * @prop --padding: Padding of popover\n * @prop --content-padding: Padding of popover content\n * @prop --border-radius: Border radius of popover\n * @prop --backdrop-opacity: Opacity of popover backdrop (used on mikro breakpoint)\n *\n * @prop --stzh-popover-width: **Global**: Width of popover above small breakpoint (default `223px`)\n * @prop --stzh-popover-min-width: **Global**: Minimum width of popover above small breakpoint (default `initial`)\n * @prop --stzh-popover-max-width: **Global**: Maximum width of popover above small breakpoint (default `initial`)\n * @prop --stzh-popover-padding: **Global**: Padding of popover (default `0px`)\n * @prop --stzh-popover-content-padding: **Global**: Padding of popover content (default `8px 0px`)\n * @prop --stzh-popover-border-radius: **Global**: Border radius of popover above small breakpoint (default `3px`)\n *\n * @prop --stzh-dialog-backdrop-opacity: **Global**: Opacity of backdrops\n * @prop --stzh-dialog-backdrop-background-color: **Global**: Background color of backdrops\n */\n\n:host {\n  display: contents;\n\n  --color: #{$colorBlack};\n  --width: #{$popoverWidth};\n  --min-width: #{$popoverMinWidth};\n  --max-width: #{$popoverMaxWidth};\n  --height: auto;\n  --min-height: initial;\n  --max-height: initial;\n  --padding: #{$popoverPadding};\n  --content-padding: #{$popoverContentPadding};\n  --border-radius: #{$popoverBorderRadius};\n  --background-color: #{$popoverBackgroundColor};\n  --backdrop-opacity: #{$dialogBackdropOpacity};\n  --backdrop-background-color: #{$dialogBackdropBackgroundColor};\n\n  &[size=\"large\"] {\n    --content-padding: #{$popoverLargeContentPadding};\n  }\n\n  &[variant=\"secondary\"] {\n    --background-color: #{$colorSecondary20};\n  }\n\n  &[variant=\"tooltip\"] {\n    --width: #{$tooltipWidth};\n    --min-width: #{$tooltipMinWidth};\n    --max-width: #{$tooltipMaxWidth};\n    --content-padding: #{space('small')} #{space('large')};\n    --border-radius: #{$tooltipBorderRadius};\n\n    @include mq($from: small) {\n      --content-padding: #{$tooltipPadding};\n      --color: #{$colorWhite};\n      --link-color: #{$colorWhite};\n      --hover-link-color: #{$colorWhite70op};\n      --background-color: #{$colorCoolgrey60};\n    }\n  }\n}\n\n.stzh-popover {\n  @include tooltip-arrow;\n  display: contents;\n\n  &__trigger {\n    display: contents;\n  }\n\n  &__content-wrapper {\n    // position: absolute;\n    // width: 100%;\n    // height: 100%;\n    // pointer-events: none;\n    display: contents;\n\n    @include mq($to: small) {\n      z-index: $zIndexDialog;\n      display: flex;\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      flex-direction: column;\n      align-items: stretch;\n      justify-content: stretch;\n    }\n  }\n\n  &__backdrop {\n    display: contents;\n\n    @include mq($to: small) {\n      z-index: 1;\n      position: absolute;\n      display: block;\n      top: 0px;\n      left: 0px;\n      width: 100%;\n      height: 100%;\n      overflow-x: hidden;\n      overflow-y: auto;\n      text-align: center;\n      background-color: var(--backdrop-background-color);\n      opacity: var(--backdrop-opacity);\n    }\n  }\n\n  &__content {\n    // pointer-events: all;\n    display: contents;\n\n    @include mq($to: small) {\n      z-index: 2;\n      position: relative;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      flex-grow: 1;\n      overflow: auto;\n    }\n  }\n\n  &__dialog {\n    margin-top: auto;\n    width: 100%;\n    overflow: visible;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n    background-color: var(--background-color);\n    touch-action: none;\n    outline: none;\n    border-bottom: 2px solid $colorOldGrey13;\n    color: var(--color);\n\n    --stzh-base-color: var(--color);\n    --stzh-link-color: var(--link-color);\n    // TODO: check with designer\n    --stzh-link-hover-color: var(--hover-link-color);\n\n    @include mq($from: small) {\n      z-index: $zIndexPopover;\n      position: absolute;\n      display: flex;\n      width: var(--width);\n      min-width: var(--min-width);\n      max-width: var(--max-width);\n      // max-width: calc(100vw - var(--stzh-scrollbar-width) - #{space('small')});\n      height: var(--height);\n      min-height: var(--min-height);\n      max-height: var(--max-height);\n      left: auto;\n      right: auto;\n      bottom: auto;\n      border-radius: var(--border-radius);\n      box-shadow: $boxShadowPopover;\n      border: none;\n    }\n  }\n\n  &__content-inner,\n  &__content-slot-wrapper {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n  }\n\n  &__content-slot-wrapper {\n    padding: var(--padding);\n  }\n\n  &__content-slot {\n    overflow-y: auto;\n    overflow-x: hidden;\n    overflow-scrolling: touch;\n    padding: var(--content-padding);\n  }\n\n  &__action-slot {\n    display: flex;\n    flex-direction: column;\n\n    // &:not(:empty) {\n    //   margin: space('xsmall') space('small');\n    //   margin-bottom: space('medium');\n    // }\n  }\n\n  &__label-wrapper {\n    display: flex;\n    align-items: center;\n    padding: space('small') space('large');\n    padding-right: space('medium');\n    border-bottom: 1px solid $baseBorderColor;\n    color: $colorOldGrey70;\n\n    @include mq($from: small) {\n      padding: 0;\n      border-bottom: 0;\n    }\n  }\n\n  &__label {\n    @include font('heavy');\n    @include fontCurve('p2');\n    margin: 0;\n    margin-right: space('small');\n\n    @include mq($from: small) {\n      @include visuallyhidden;\n    }\n  }\n\n  &__close {\n    visibility: $popoverCloseVisibility;\n    cursor: pointer;\n    display: flex;\n    appearance: none;\n    font-family: inherit;\n    border: none;\n    background-color: transparent;\n    padding: 0;\n    margin-left: auto;\n    border-radius: 50%;\n    color: $baseLeadColor;\n    padding: space('xxsmall');\n  }\n\n  &__icon {\n    --size: #{iconSize('xsmall')};\n  }\n\n  &__arrow {\n    position: absolute;\n    display: none;\n\n    @include mq($from: small) {\n      display: flex;\n    }\n  }\n\n  &__vhidden {\n    @include visuallyhidden;\n  }\n\n  /* Only non tooltip variants */\n\n  &--default &__close,\n  &--secondary &__close {\n    &:focus {\n      box-shadow: 0 0 0 1px $colorPrimary;\n    }\n\n    @include mq($from: small) {\n      @include visuallyhiddenFocusable;\n      position: absolute;\n      top: 0;\n      right: 0;\n      transform: translate(30%, -30%);\n      background-color: $colorOldGrey5;\n    }\n  }\n\n  /* Tooltip variant */\n\n  &--tooltip &__content-inner {\n    @include mq($from: small) {\n      flex-direction: row-reverse;\n      align-items: flex-start;\n    }\n  }\n\n  &--tooltip &__close {\n    visibility: visible;\n\n    @include mq($from: small) {\n      @include tooltip__close;\n    }\n  }\n\n  &--tooltip &__icon {\n    @include mq($from: small) {\n      @include tooltip__icon;\n    }\n  }\n\n  &--tooltip &__dialog {\n    @include mq($from: small) {\n      @include tooltip-dropshadow;\n    }\n  }\n\n  &--tooltip &__content-slot {\n    @include mq($from: small) {\n      @include tooltip-fontsize;\n    }\n  }\n\n  /* Has fullwidth popover */\n\n  &--popover-fullwidth-horizontal &__dialog {\n    @include mq($from: small) {\n      left: 0 !important;\n      right: 0 !important;\n      width: 100%;\n    }\n  }\n\n  &--popover-fullwidth-vertical &__dialog {\n    @include mq($from: small) {\n      top: 0 !important;\n      bottom: 0 !important;\n      height: 100%;\n    }\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, Method, Prop, State, Watch } from \"@stencil/core\";\n\nimport {\n  StzhPopoverClosedEvent,\n  StzhPopoverCloseEvent,\n  StzhPopoverOpenedEvent,\n  StzhPopoverOpenEvent,\n} from \"../../index\";\n\nimport { arrow, autoUpdate, computePosition, flip, offset, Placement, shift } from \"@floating-ui/dom\";\n\nimport { createFocusTrap, FocusTrap } from \"focus-trap\";\nimport { isStzhElement } from \"../../utils/utils\";\nimport { addMediaChangeListener, media, removeMediaChangeListener } from \"../../utils/media-utils\";\nimport { waitForEvent } from \"../../utils/event-utils\";\nimport { animateTo, stopAnimations } from \"../../utils/animation-utils\";\n\nimport { StzhPopoverLocalizedText } from \"./stzh-popover.localization\";\n\nimport Arrow from \"../stzh-tooltip/assets/arrow.svg\";\n\nconst ANIMATION_SHOW_DURATION = 200;\nconst ANIMATION_HIDE_DURATION = 300;\nconst ANIMATION_SHOW_DURATION_SMALL = 100;\nconst ANIMATION_HIDE_DURATION_SMALL = 200;\n\nfunction animationContentWrapperShow() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [{ opacity: \"0\" }, { opacity: \"1\" }],\n    options: {\n      duration: isSmall ? ANIMATION_SHOW_DURATION_SMALL : ANIMATION_SHOW_DURATION,\n      easing: \"linear\",\n    },\n  };\n}\n\nfunction animationContentWrapperHide() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [{ opacity: \"1\" }, { opacity: \"0\" }],\n    options: {\n      duration: isSmall ? ANIMATION_HIDE_DURATION_SMALL : ANIMATION_HIDE_DURATION,\n      easing: \"linear\",\n    },\n  };\n}\n\nfunction animationDialogShow() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [{ transform: isSmall ? \"translateY(-8px)\" : \"translateY(100%)\" }, { transform: \"translateY(0px)\" }],\n    options: {\n      duration: isSmall ? ANIMATION_SHOW_DURATION_SMALL : ANIMATION_SHOW_DURATION,\n      easing: \"linear\",\n    },\n  };\n}\n\nfunction animationDialogHide() {\n  const isSmall = media(\"small\").matches;\n  return {\n    keyframes: [{ transform: \"translateY(0px)\" }, { transform: isSmall ? \"translateY(-8px)\" : \"translateY(100%)\" }],\n    options: {\n      duration: isSmall ? ANIMATION_HIDE_DURATION_SMALL : ANIMATION_HIDE_DURATION,\n      easing: \"linear\",\n    },\n  };\n}\n\nconst keyCode = {\n  ESC: 27,\n};\n\nconst CLASS_BODY_OPEN = \"stzh-popover-open\";\n\nlet popoverCounter = 0;\n\n/**\n * @slot - Trigger element for popover\n * @slot content - Any element used as popover content\n * @slot action - `stzh-button` element\n * @slot label - Label for mobile view (alternative for label property)\n */\n@Component({\n  tag: \"stzh-popover\",\n  styleUrl: \"stzh-popover.scss\",\n  scoped: true,\n})\nexport class StzhPopover {\n  /** Whether popover should be open */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Default placement of popover relative to trigger element */\n  @Prop({ reflect: true }) placement: Placement = \"bottom\";\n\n  /** Whether to stretch popover to fullwith of parent */\n  @Prop({ reflect: true }) fullwidth: \"horizontal\" | \"vertical\" | \"\" = \"\";\n\n  /** Variant */\n  @Prop({ reflect: true }) variant: \"default\" | \"secondary\" | \"tooltip\" = \"default\";\n\n  /** Size */\n  @Prop({ reflect: true }) size: \"default\" | \"large\" = \"default\";\n\n  /** Shifting of popover content */\n  @Prop() skidding: number = 0;\n\n  /** Distance from popover content to trigger. \"8\" when default variant, \"16\" when tooltip variant, arrow height (8px) + spacing (4px) = 12. */\n  @Prop() distance: number;\n\n  /** Label for mobile view (use label slot as alternative) */\n  @Prop() label: string = \"\";\n\n  /** Position strategy */\n  @Prop() strategy: \"absolute\" | \"fixed\" = \"absolute\";\n\n  /** Translation strings. */\n  @Prop() localization: StzhPopoverLocalizedText;\n\n  @Element() element: HTMLStzhPopoverElement;\n\n  /** Popover open event */\n  @Event() stzhOpen: EventEmitter<StzhPopoverOpenEvent>;\n\n  /** Popover opened event (after animation) */\n  @Event() stzhOpened: EventEmitter<StzhPopoverOpenedEvent>;\n\n  /** Popover close event */\n  @Event() stzhClose: EventEmitter<StzhPopoverCloseEvent>;\n\n  /** Popover closed event (after animation) */\n  @Event() stzhClosed: EventEmitter<StzhPopoverClosedEvent>;\n\n  private parentNode: Node;\n\n  /** Show popover content */\n  @Method()\n  async show() {\n    if (this.open) {\n      return;\n    }\n\n    this.mediaChangeHandler();\n    if (this.isHeaderStuckAndViewportMicro) {\n      this.branchOutToBody();\n    }\n\n    this.toggledByMethod = true;\n    this.open = true;\n    return waitForEvent(this.element, \"stzhOpened\");\n  }\n\n  /** Hide popover content */\n  @Method()\n  async hide() {\n    if (!this.open) {\n      return;\n    }\n\n    this.toggledByMethod = true;\n    this.open = false;\n\n    await waitForEvent(this.element, \"stzhClosed\");\n\n    this.mediaChangeHandler();\n    if (this.isHeaderStuckAndViewportMicro) {\n      this.branchInFromBody();\n    }\n\n    return true;\n  }\n\n  /** Toggle popover content */\n  @Method()\n  async toggle() {\n    if (this.open) {\n      return await this.hide();\n    } else {\n      return await this.show();\n    }\n  }\n\n  @Method()\n  async update() {\n    return await this.computePosition();\n  }\n\n  @Listen(\"click\", { target: \"document\", capture: true })\n  handleOutsideClick(event: MouseEvent) {\n    if (!this.open) {\n      return;\n    }\n\n    const isClickOutside =\n      event.target !== this.dialogElement && this.dialogElement.contains(event.target as HTMLElement) === false;\n\n    const isClickTrigger =\n      event.target === this.triggerElement || this.triggerElement.contains(event.target as HTMLElement);\n\n    if (isClickOutside && !isClickTrigger) {\n      this.hide();\n    }\n  }\n\n  @Watch(\"open\")\n  async openWatcher(newValue: boolean) {\n    if (!this.dialogElement) {\n      return;\n    }\n\n    if (newValue) {\n      if (this.toggledByMethod) {\n        this.stzhOpen.emit({\n          component: \"stzh-popover\",\n        });\n      }\n\n      const animationShow = animationContentWrapperShow();\n      const animationShowDialog = animationDialogShow();\n\n      await Promise.all([\n        stopAnimations(this.contentWrapperElement),\n        stopAnimations(this.contentElement),\n        stopAnimations(this.dialogElement),\n      ]);\n\n      // safari seems to need will-change,\n      // otherwise it has problems animating the element with the drop shadow\n      this.dialogElement.style.willChange = \"transform, opacity, position, top, left, bottom, right\";\n      this.contentWrapperElement.hidden = false;\n\n      await Promise.all([\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentWrapperElement,\n          animationShow.keyframes,\n          animationShow.options\n        ),\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentElement,\n          animationShowDialog.keyframes,\n          animationShowDialog.options\n        ),\n      ]);\n\n      if (this.toggledByMethod) {\n        this.stzhOpened.emit({\n          component: \"stzh-popover\",\n        });\n      }\n    } else {\n      if (this.toggledByMethod) {\n        this.stzhClose.emit({\n          component: \"stzh-popover\",\n        });\n      }\n\n      const animationHide = animationContentWrapperHide();\n      const animationHideDialog = animationDialogHide();\n\n      await Promise.all([\n        stopAnimations(this.contentWrapperElement),\n        stopAnimations(this.contentElement),\n        stopAnimations(this.dialogElement),\n      ]);\n\n      await Promise.all([\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentWrapperElement,\n          animationHide.keyframes,\n          animationHide.options\n        ),\n        animateTo(\n          media(\"small\").matches ? this.dialogElement : this.contentElement,\n          animationHideDialog.keyframes,\n          animationHideDialog.options\n        ),\n      ]);\n\n      this.contentWrapperElement.hidden = true;\n      this.dialogElement.style.willChange = \"auto\";\n\n      if (this.toggledByMethod) {\n        this.stzhClosed.emit({\n          component: \"stzh-popover\",\n        });\n      }\n    }\n\n    this.toggledByMethod = false;\n  }\n\n  @Watch(\"distance\")\n  distanceWatcher(newValue: number) {\n    if (typeof newValue === \"number\") {\n      this.distance = newValue;\n    } else {\n      this.distance = this.variant === \"tooltip\" ? 12 : 8;\n    }\n  }\n\n  @State() computedPlacement: Placement;\n  @State() isHeaderStuckAndViewportMicro: boolean;\n  @State() isBranchedOutToBody: boolean;\n  @State() hasStzhHeaderParent: boolean;\n\n  private observer: MutationObserver;\n\n  private contentWrapperElement: HTMLElement;\n  private contentElement: HTMLElement;\n  private arrowElement: HTMLElement;\n  private rootElement: HTMLElement;\n  private triggerElement: HTMLElement;\n  private triggerFirstElement: HTMLElement;\n  private dialogElement: HTMLElement;\n  private autoUpdateCleanup: Function;\n\n  private initialTouchX: number = null;\n  private initialTouchY: number = null;\n\n  private id: string;\n  private trap: FocusTrap;\n  private toggledByMethod: boolean;\n\n  private setStzhHeaderParent(): boolean {\n    let parent = this.element.parentElement;\n    while (parent) {\n      if (parent.tagName && parent.tagName.toLowerCase() === \"stzh-header\") {\n        return true;\n      }\n      parent = parent.parentElement;\n    }\n    return false;\n  }\n\n  private mediaChangeHandler = () => {\n    const isStzhHeaderStuck = document.documentElement.style.getPropertyValue(\"--stzh-header-is-stuck\");\n    this.isHeaderStuckAndViewportMicro =\n      !media(\"small\").matches && isStzhHeaderStuck === \"1\" && this.hasStzhHeaderParent;\n\n    if (this.open && this.isBranchedOutToBody && !this.isHeaderStuckAndViewportMicro) {\n      this.branchInFromBody();\n    }\n  };\n\n  private branchOutToBody() {\n    document.body.append(this.element);\n    this.parentNode.appendChild(this.triggerElement);\n    this.isBranchedOutToBody = true;\n  }\n\n  private branchInFromBody() {\n    this.parentNode.appendChild(this.element);\n    this.rootElement.prepend(this.triggerElement);\n    this.isBranchedOutToBody = false;\n  }\n\n  private handleKeydown = (event: KeyboardEvent) => {\n    if (event.keyCode === keyCode.ESC) {\n      this.hide();\n    }\n  };\n\n  private onClickTrigger = () => {\n    this.toggle();\n  };\n\n  private computePosition = async () => {\n    if (media(\"small\").matches) {\n      const middleware = [\n        offset({\n          mainAxis: this.distance,\n          crossAxis: this.skidding,\n        }),\n        flip({\n          padding: 5,\n        }),\n        shift({\n          padding: 5,\n        }),\n      ];\n\n      if (this.variant === \"tooltip\") {\n        middleware.push(\n          arrow({\n            element: this.arrowElement,\n            padding: 5,\n          })\n        );\n      }\n\n      const {\n        x = 0,\n        y = 0,\n        strategy = \"absolute\",\n        placement,\n        middlewareData,\n      } = await computePosition(this.triggerFirstElement, this.dialogElement, {\n        strategy: this.strategy,\n        placement: this.placement,\n        middleware,\n      });\n\n      this.computedPlacement = placement;\n\n      Object.assign(this.dialogElement.style, {\n        position: strategy,\n        left: `${x}px`,\n        top: `${y}px`,\n      });\n\n      if (this.variant === \"tooltip\") {\n        Object.assign(this.arrowElement.style, {\n          left: x != null ? `${middlewareData.arrow.x}px` : \"\",\n          top: y != null ? `${middlewareData.arrow.y}px` : \"\",\n        });\n      }\n    } else {\n      Object.assign(this.dialogElement.style, {\n        position: null,\n        left: null,\n        top: null,\n      });\n\n      if (this.variant === \"tooltip\") {\n        Object.assign(this.arrowElement.style, {\n          left: null,\n          top: null,\n        });\n      }\n    }\n  };\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const touch = event.changedTouches[0];\n    this.initialTouchX = touch.pageX;\n    this.initialTouchY = touch.pageY;\n  };\n\n  // private handleTouchMove = (event: TouchEvent) => {\n  //   event.preventDefault()\n  // }\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const touch = event.changedTouches[0];\n    const distX = touch.pageX - this.initialTouchX; // get horizontal dist traveled\n    const distY = touch.pageY - this.initialTouchY; // get vertical dist traveled\n    const threshold = 70;\n\n    const isYSwipe = Math.abs(distY) >= threshold && Math.abs(distX) <= threshold;\n\n    if (isYSwipe) {\n      this.hide();\n    }\n\n    this.initialTouchY = null;\n    this.initialTouchX = null;\n  };\n\n  private init = () => {\n    let trigger = this.triggerElement?.firstElementChild as HTMLElement;\n\n    if (!trigger) {\n      const defaultSlot = Array.from(this.element.children).find(child => !child.hasAttribute(\"slot\")) as HTMLElement;\n\n      trigger = defaultSlot;\n    }\n\n    if (trigger) {\n      this.triggerFirstElement = trigger;\n      trigger.addEventListener(\"click\", this.onClickTrigger);\n    }\n  };\n\n  async componentWillLoad() {\n    this.id = `stzh-popover-${popoverCounter++}`;\n    this.parentNode = this.element.parentNode;\n    this.hasStzhHeaderParent = this.setStzhHeaderParent();\n\n    this.distanceWatcher(this.distance);\n\n    if (!this.localization) {\n      this.localization = await window.stzhComponents.utils.fetchTranslations(this.element, \"popover\");\n    }\n  }\n\n  private popoverShown() {\n    document.body.classList.add(CLASS_BODY_OPEN);\n\n    const isStzh = isStzhElement(this.triggerFirstElement);\n\n    this.triggerFirstElement.setAttribute(isStzh ? \"a11y-expanded\" : \"aria-expanded\", \"true\");\n\n    if (this.trap) {\n      this.trap.activate();\n    }\n  }\n\n  private popoverHidden() {\n    document.body.classList.remove(CLASS_BODY_OPEN);\n\n    const isStzh = isStzhElement(this.triggerFirstElement);\n\n    this.triggerFirstElement.setAttribute(isStzh ? \"a11y-expanded\" : \"aria-expanded\", \"false\");\n\n    if (this.trap) {\n      this.trap.deactivate();\n    }\n  }\n\n  componentDidRender() {\n    this.computePosition();\n    this.mediaChangeHandler();\n    this.open ? this.popoverShown() : this.popoverHidden();\n\n    const isStzh = isStzhElement(this.triggerFirstElement);\n\n    if (\n      (isStzh && !this.triggerFirstElement.getAttribute(\"a11y-describedby\")) ||\n      (!isStzh && !this.triggerFirstElement.getAttribute(\"aria-describedby\"))\n    ) {\n      this.triggerFirstElement.setAttribute(\n        isStzh ? \"a11y-describedby\" : \"aria-describedby\",\n        `${this.id}-trigger-description`\n      );\n    }\n\n    if (\n      (isStzh && !this.triggerFirstElement.getAttribute(\"a11y-label\")) ||\n      (!isStzh && !this.triggerFirstElement.getAttribute(\"aria-label\"))\n    ) {\n      this.triggerFirstElement.setAttribute(isStzh ? \"a11y-label\" : \"aria-label\", this.label);\n    }\n\n    if (\n      (isStzh && !this.triggerFirstElement.getAttribute(\"analytics-id\")) ||\n      (!isStzh && !this.triggerFirstElement.getAttribute(\"s-object-id\"))\n    ) {\n      this.triggerFirstElement.setAttribute(isStzh ? \"analytics-id\" : \"s-object-id\", this.label);\n    }\n  }\n\n  componentDidUpdate() {\n    this.trap.updateContainerElements(this.dialogElement);\n  }\n\n  componentDidLoad() {\n    this.autoUpdateCleanup = autoUpdate(this.triggerFirstElement, this.dialogElement, this.computePosition);\n\n    this.contentWrapperElement.hidden = !this.open;\n\n    this.trap = createFocusTrap(this.dialogElement, {\n      fallbackFocus: this.dialogElement,\n      clickOutsideDeactivates: true,\n      returnFocusOnDeactivate: true,\n    });\n\n    if (this.open) {\n      this.popoverShown();\n    }\n  }\n\n  connectedCallback() {\n    addMediaChangeListener(this.mediaChangeHandler);\n    this.init();\n\n    this.observer = new MutationObserver(this.init);\n    this.observer.observe(this.element, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    removeMediaChangeListener(this.mediaChangeHandler);\n    if (this.observer) {\n      this.observer.disconnect();\n    }\n\n    if (this.autoUpdateCleanup) {\n      this.autoUpdateCleanup();\n    }\n\n    if (this.triggerFirstElement) {\n      this.triggerFirstElement.removeEventListener(\"click\", this.onClickTrigger);\n    }\n  }\n\n  render() {\n    const classes = {\n      \"stzh-popover\": true,\n      [`stzh-popover--open`]: this.open,\n      [`stzh-popover--placement-${this.computedPlacement}`]: !!this.computedPlacement,\n      [`stzh-popover--fullwidth-${this.fullwidth}`]: !!this.fullwidth,\n      [`stzh-popover--${this.size}`]: !!this.size,\n      [`stzh-popover--${this.variant}`]: !!this.variant,\n    };\n\n    return (\n      <Host>\n        <div\n          class={classes}\n          onTouchStart={this.handleTouchStart}\n          onTouchEnd={this.handleTouchEnd}\n          ref={el => (this.rootElement = el as HTMLDivElement)}\n        >\n          <div ref={el => (this.triggerElement = el as HTMLDivElement)} class=\"stzh-popover__trigger\">\n            <slot></slot>\n          </div>\n          <div class=\"stzh-popover__vhidden\" id={`${this.id}-trigger-description`}>\n            {this.localization.open}\n          </div>\n          <div ref={el => (this.contentWrapperElement = el as HTMLDivElement)} class=\"stzh-popover__content-wrapper\">\n            <div class=\"stzh-popover__backdrop\"></div>\n            <div ref={el => (this.contentElement = el as HTMLDivElement)} class=\"stzh-popover__content\">\n              <div\n                ref={el => (this.dialogElement = el as HTMLDivElement)}\n                class=\"stzh-popover__dialog\"\n                role=\"dialog\"\n                tabindex=\"-1\"\n                aria-modal=\"true\"\n                aria-labelledby={this.label ? `${this.id}-label` : null}\n                aria-hidden={this.open ? \"false\" : \"true\"}\n                onKeyDown={this.handleKeydown}\n              >\n                {this.variant === \"tooltip\" && (\n                  <div\n                    class=\"stzh-popover__arrow\"\n                    ref={el => (this.arrowElement = el as HTMLDivElement)}\n                    innerHTML={Arrow}\n                  ></div>\n                )}\n                <div class=\"stzh-popover__content-inner\">\n                  <div class=\"stzh-popover__label-wrapper\">\n                    <h2 id={`${this.id}-label`} class=\"stzh-popover__label\">\n                      {this.label ? this.label : <slot name=\"label\"></slot>}\n                    </h2>\n                    <button class=\"stzh-popover__close\" onClick={() => this.hide()} type=\"button\">\n                      <stzh-icon name=\"close\" class=\"stzh-popover__icon\"></stzh-icon>\n                      <span class=\"stzh-popover__vhidden\">{this.localization.close}</span>\n                    </button>\n                  </div>\n                  <div class=\"stzh-popover__content-slot-wrapper\">\n                    <div class=\"stzh-popover__content-slot\">\n                      <slot name=\"content\"></slot>\n                    </div>\n                    <div class=\"stzh-popover__action-slot\">\n                      <slot name=\"action\"></slot>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","/**\n * @prop --color: Text color (also `color` can be overwritten)\n * @prop --icon-size: Icon size\n * @prop --icon-vertical-align: Icon vertical alignment\n *\n * @prop --stzh-base-color: **Global**: Text color\n * @prop --stzh-base-lead-color: **Global**: Lead text color\n */\n\n:host {\n  --icon-size: 1.25em;\n  --icon-vertical-align: text-bottom;\n  --color: #{$baseColor};\n  --display: var(--stzh-text-display, block);\n\n  width: 100%;\n  color: var(--color);\n\n  --grid-template-areas: var(\n    --stzh-text-grid-template-areas,\n    \"text text text text\"\n  );\n\n  --grid-template-columns: var(\n    --stzh-text-grid-template-columns,\n    #{$gridColumns}\n  );\n\n  @include mq($from: small) {\n    --grid-template-areas: var(\n      --stzh-text-grid-template-areas,\n      \"text text text text\"\n    );\n  }\n\n  @include mq($from: medium) {\n    --grid-template-areas: var(\n      --stzh-text-grid-template-areas,\n      \"text text text text text text text text\"\n    );\n\n    --grid-template-columns: var(\n      --stzh-text-grid-template-columns,\n      #{$gridColumnsMedium}\n    );\n  }\n\n  ::slotted(*:first-child) {\n    margin-top: 0 !important;\n  }\n\n  ::slotted(*:last-child) {\n    margin-bottom: 0 !important;\n  }\n\n  ::slotted(a),\n  ::slotted(* a) {\n    color: $linkColor;\n    transition: color $baseTransitionAnimationSpeed;\n    border-radius: $buttonBorderRadius;\n    text-underline-offset: $linkTextUnderlineOffset;\n    text-decoration-line: $linkTextDecorationLine;\n    text-decoration-thickness: $linkTextDecorationThickness;\n    text-decoration-skip-ink: $linkTextDecorationSkipInk;\n\n    &:hover {\n      color: $linkHoverColor;\n      text-decoration-line: $linkHoverTextDecorationLine;\n    }\n\n    &:hover {\n      color: $linkHoverColor;\n    }\n  }\n\n  ::slotted(b),\n  ::slotted(strong),\n  ::slotted(* b),\n  ::slotted(* strong) {\n    @include font('heavy');\n  }\n\n  ::slotted(i),\n  ::slotted(em),\n  ::slotted(* i),\n  ::slotted(* em) {\n    @include font;\n  }\n\n  &[lead]:not([lead=\"false\"]) {\n    --color: #{$baseLeadColor};\n  }\n\n  &[color=\"primary\"] {\n    --color: #{$colorPrimary70};\n  }\n\n  &[color=\"secondary\"] {\n    --color: #{$colorSecondary60};\n  }\n\n  &[color=\"info\"] {\n    --color: #{$textInfoColor};\n  }\n\n  &[color=\"inherit\"] {\n    --color: initial;\n  }\n}\n\n.stzh-text {\n  --stzh-icon-size: var(--icon-size);\n  --stzh-icon-vertical-align: var(--icon-vertical-align);\n\n  --stzh-list-font-size: \"\";\n  --stzh-list-line-height: \"\";\n  --stzh-list-letter-spacing: \"\";\n\n  // default font styling without attributes\n  @include fontCurve($textFontCurveDefault);\n  @include gridGutter;\n  display: var(--display);\n  grid-template-areas: var(--grid-template-areas);\n  grid-template-columns: var(--grid-template-columns);\n\n  color: var(--color);\n\n  &__text {\n    grid-area: text;\n    display: flex;\n  }\n\n  &__icon {\n    flex-shrink: 0;\n\n    &:not(:empty) {\n      margin-right: 0.25em;\n    }\n  }\n\n  &__text-inner {\n    flex-grow: 1;\n  }\n\n  /* Lead variant */\n\n  &--is-lead {\n    @include font('heavy');\n    @include fontCurve('lead', 'lead');\n  }\n\n  /* Font variants */\n\n  @each $font, $value in $fonts {\n    &--font-#{$font} {\n      @include font($font);\n    }\n  }\n\n  /* Curve variants */\n\n  &--curve-none {\n    font-size: inherit;\n  }\n\n  @each $fontCurveName, $config in $fontCurves {\n    &--curve-#{$fontCurveName} {\n      @include fontCurve($fontCurveName);\n    }\n  }\n\n  /* Size variants when consumer wants to overwrite predefined font curves */\n\n  @each $size, $value in $fontSizes {\n    &--size-#{$size} {\n      @include fontSize($size);\n    }\n  }\n\n  @each $breakpoint, $size in $breakpoints {\n    @each $size, $value in $fontSizes {\n      &--size-#{$breakpoint}-#{$size} {\n        @include mq($from: $breakpoint) {\n          @include fontSize($size);\n        }\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Font } from \"../../index\";\n\n/**\n * @slot - Slot for text and icons\n * @slot icon - Slot for icon that should be on left side of the text (not inline)\n */\n@Component({\n  tag: \"stzh-text\",\n  styleUrl: \"stzh-text.scss\",\n  scoped: true\n})\nexport class StzhText {\n  /** Font used */\n  @Prop() font: Font.Fonts = \"default\";\n\n  /** Type of curve (see [Spacings docs page](/docs/tokens-typography--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Font.Curves = \"default\";\n\n  /** Whether if text is lead text */\n  @Prop({ reflect: true }) lead: boolean = false;\n\n  /** Color used */\n  @Prop({ reflect: true }) color: \"default\" | \"primary\" | \"secondary\" | \"info\" | \"inherit\" = \"default\";\n\n  /** Manually overwrite font size applied by curve attribute (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() size: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above small breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeSmall: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above medium breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeMedium: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above large breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeLarge: Font.Sizes | \"inherit\" = \"inherit\";\n  /** Manually overwrite font size applied by curve attribute above ultra breakpoint (see [Spacings docs page](/docs/tokens-typography--docs#sizes) for more info). */\n  @Prop() sizeUltra: Font.Sizes | \"inherit\" = \"inherit\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-text\": true,\n            \"stzh-text--is-lead\": this.lead,\n            [`stzh-text--font-${this.font}`]: !!this.font,\n            [`stzh-text--curve-${this.curve}`]: !!this.curve,\n            [`stzh-text--size-${this.size}`]: !!this.size,\n            [`stzh-text--size-small-${this.sizeSmall}`]: !!this.sizeSmall,\n            [`stzh-text--size-medium-${this.sizeMedium}`]: !!this.sizeMedium,\n            [`stzh-text--size-large-${this.sizeLarge}`]: !!this.sizeLarge,\n            [`stzh-text--size-ultra-${this.sizeUltra}`]: !!this.sizeUltra,\n          }}\n        >\n          <div class=\"stzh-text__text\">\n            <div class=\"stzh-text__icon\">\n              <slot name=\"icon\"></slot>\n            </div>\n            <div class=\"stzh-text__text-inner\">\n              <slot></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/stzh-print_2.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 const stringUtils = require('./string-utils-5dd70320.js');
 
 const stzhPrintCss = ":host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden]{display:none}:host::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{display:contents}@media print{:host{display:none}}.stzh-print{display:contents}";

package/dist/cjs/stzh-ratio.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
 
-const stzhRatioCss = ".sc-stzh-ratio-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-ratio-h{display:none}.sc-stzh-ratio-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-ratio-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-ratio-h *.sc-stzh-ratio,.sc-stzh-ratio-h *.sc-stzh-ratio::before,.sc-stzh-ratio-h *.sc-stzh-ratio::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-ratio-h .has-focus.sc-stzh-ratio{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio{outline-style:none !important}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio::-moz-focus-inner{border:0 !important}.sc-stzh-ratio-h{--background-color:var(--stzh-ratio-background-color);--ratio:16\n    / 9}.sc-stzh-ratio-h .sc-stzh-ratio-s>*{position:absolute;width:100%;height:100%;inset:0;-o-object-fit:cover;object-fit:cover}.sc-stzh-ratio-h[fit=contain] .sc-stzh-ratio-s>*{-o-object-fit:contain;object-fit:contain}[portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9\n    / 16}[ratio=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}[ratio=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}[ratio=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}[ratio=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}[ratio=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}[ratio=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}[ratio=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}[ratio=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}[ratio=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}[ratio=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}[ratio=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}[ratio=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}[ratio=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}[ratio=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}@media screen and (min-width: 600px){[ratio-small=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 600px){[ratio-small=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 600px){[ratio-small=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 600px){[ratio-small=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 600px){[ratio-small=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 600px){[ratio-small=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 600px){[ratio-small=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 600px){[ratio-small=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 600px){[ratio-small=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 600px){[ratio-small=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 600px){[ratio-small=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 600px){[ratio-small=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 600px){[ratio-small=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 600px){[ratio-small=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}@media screen and (min-width: 900px){[ratio-medium=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 900px){[ratio-medium=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 900px){[ratio-medium=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 900px){[ratio-medium=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 900px){[ratio-medium=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 900px){[ratio-medium=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 900px){[ratio-medium=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 900px){[ratio-medium=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 900px){[ratio-medium=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 900px){[ratio-medium=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 900px){[ratio-medium=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 900px){[ratio-medium=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 900px){[ratio-medium=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 900px){[ratio-medium=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}@media screen and (min-width: 1260px){[ratio-large=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 1260px){[ratio-large=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 1260px){[ratio-large=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 1260px){[ratio-large=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 1260px){[ratio-large=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 1260px){[ratio-large=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 1260px){[ratio-large=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 1260px){[ratio-large=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 1260px){[ratio-large=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 1260px){[ratio-large=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 1260px){[ratio-large=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 1260px){[ratio-large=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 1260px){[ratio-large=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 1260px){[ratio-large=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}@media screen and (min-width: 1600px){[ratio-ultra=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 1600px){[ratio-ultra=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 1600px){[ratio-ultra=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 1600px){[ratio-ultra=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 1600px){[ratio-ultra=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 1600px){[ratio-ultra=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 1600px){[ratio-ultra=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 1600px){[ratio-ultra=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 1600px){[ratio-ultra=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 1600px){[ratio-ultra=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 1600px){[ratio-ultra=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 1600px){[ratio-ultra=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 1600px){[ratio-ultra=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 1600px){[ratio-ultra=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}.stzh-ratio.sc-stzh-ratio{position:relative;width:100%;aspect-ratio:var(--ratio);background:var(--background-color)}";
+const stzhRatioCss = ".sc-stzh-ratio-h{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block}[hidden].sc-stzh-ratio-h{display:none}.sc-stzh-ratio-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-ratio-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-ratio-h *.sc-stzh-ratio,.sc-stzh-ratio-h *.sc-stzh-ratio::before,.sc-stzh-ratio-h *.sc-stzh-ratio::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}.sc-stzh-ratio-h .has-focus.sc-stzh-ratio{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio{outline-style:none !important}.sc-stzh-ratio-h .stzh-fylingfocus-focused.sc-stzh-ratio::-moz-focus-inner{border:0 !important}.sc-stzh-ratio-h{--background-color:var(--stzh-ratio-background-color);--ratio:16\n    / 9;--max-height:inherit;--overflow:inherit}.sc-stzh-ratio-h .sc-stzh-ratio-s>*{position:absolute;width:100%;height:100%;inset:0;-o-object-fit:cover;object-fit:cover}.sc-stzh-ratio-h[fit=contain] .sc-stzh-ratio-s>*{-o-object-fit:contain;object-fit:contain}[portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9\n    / 16}[ratio=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}[ratio=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}[ratio=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}[ratio=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}[ratio=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}[ratio=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}[ratio=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}[ratio=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}[ratio=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}[ratio=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}[ratio=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}[ratio=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}[ratio=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}[ratio=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}@media screen and (min-width: 600px){[ratio-small=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 600px){[ratio-small=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 600px){[ratio-small=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 600px){[ratio-small=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 600px){[ratio-small=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 600px){[ratio-small=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 600px){[ratio-small=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 600px){[ratio-small=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 600px){[ratio-small=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 600px){[ratio-small=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 600px){[ratio-small=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 600px){[ratio-small=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 600px){[ratio-small=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 600px){[ratio-small=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}@media screen and (min-width: 900px){[ratio-medium=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 900px){[ratio-medium=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 900px){[ratio-medium=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 900px){[ratio-medium=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 900px){[ratio-medium=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 900px){[ratio-medium=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 900px){[ratio-medium=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 900px){[ratio-medium=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 900px){[ratio-medium=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 900px){[ratio-medium=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 900px){[ratio-medium=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 900px){[ratio-medium=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 900px){[ratio-medium=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 900px){[ratio-medium=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}@media screen and (min-width: 1260px){[ratio-large=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 1260px){[ratio-large=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 1260px){[ratio-large=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 1260px){[ratio-large=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 1260px){[ratio-large=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 1260px){[ratio-large=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 1260px){[ratio-large=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 1260px){[ratio-large=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 1260px){[ratio-large=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 1260px){[ratio-large=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 1260px){[ratio-large=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 1260px){[ratio-large=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 1260px){[ratio-large=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 1260px){[ratio-large=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}@media screen and (min-width: 1600px){[ratio-ultra=\"16:9\"].sc-stzh-ratio-h{--ratio:16 / 9}}@media screen and (min-width: 1600px){[ratio-ultra=\"16:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 16}}@media screen and (min-width: 1600px){[ratio-ultra=\"1:1\"].sc-stzh-ratio-h{--ratio:1 / 1}}@media screen and (min-width: 1600px){[ratio-ultra=\"1:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 1}}@media screen and (min-width: 1600px){[ratio-ultra=\"21:9\"].sc-stzh-ratio-h{--ratio:21 / 9}}@media screen and (min-width: 1600px){[ratio-ultra=\"21:9\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:9 / 21}}@media screen and (min-width: 1600px){[ratio-ultra=\"2:1\"].sc-stzh-ratio-h{--ratio:2 / 1}}@media screen and (min-width: 1600px){[ratio-ultra=\"2:1\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:1 / 2}}@media screen and (min-width: 1600px){[ratio-ultra=\"3:2\"].sc-stzh-ratio-h{--ratio:3 / 2}}@media screen and (min-width: 1600px){[ratio-ultra=\"3:2\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:2 / 3}}@media screen and (min-width: 1600px){[ratio-ultra=\"4:3\"].sc-stzh-ratio-h{--ratio:4 / 3}}@media screen and (min-width: 1600px){[ratio-ultra=\"4:3\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:3 / 4}}@media screen and (min-width: 1600px){[ratio-ultra=\"5:4\"].sc-stzh-ratio-h{--ratio:5 / 4}}@media screen and (min-width: 1600px){[ratio-ultra=\"5:4\"][portrait].sc-stzh-ratio-h:not([portrait=false]){--ratio:4 / 5}}.stzh-ratio.sc-stzh-ratio{position:relative;width:100%;aspect-ratio:var(--ratio);background:var(--background-color);max-height:var(--max-height);overflow:var(--overflow)}";
 
 const StzhRatio = class {
   constructor(hostRef) {

package/dist/cjs/stzh-ratio.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"stzh-ratio.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,63QAA63Q;;MCYr4Q,SAAS;;;iBAE2B,MAAM;sBAEW,SAAS;uBAER,SAAS;sBAEV,SAAS;sBAET,SAAS;oBAG5B,KAAK;eAGE,OAAO;;EAI3D,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,YAAY,EAAE,IAAI;KACnB,CAAC;IAEF,QACEA,QAACC,UAAI,QACHD,iBAAK,KAAK,EAAE,OAAO,IACjBA,qBAAa,CACT,CACD,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["src/components/stzh-ratio/stzh-ratio.scss?tag=stzh-ratio&encapsulation=scoped","src/components/stzh-ratio/stzh-ratio.tsx"],"sourcesContent":["/**\n * @prop --ratio: Ratio (e.g. 16 / 9)\n * @prop --background-color: Background color of ratio area\n *\n * @prop --stzh-ratio-background-color: **Global**: Background color of ratios\n */\n\n:host {\n  --background-color: #{$ratioBackgroundColor};\n  --ratio: #{nth(map-get($ratios, $ratioDefault), 1)}\n    / #{nth(map-get($ratios, $ratioDefault), 2)};\n\n  ::slotted(*) {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    inset: 0;\n    object-fit: cover;\n  }\n}\n\n:host([fit=\"contain\"]) ::slotted(*) {\n  object-fit: contain;\n}\n\n/* Ratio variants */\n\n:host([portrait]:not([portrait=\"false\"])) {\n  --ratio: #{nth(map-get($ratios, $ratioDefault), 2)}\n    / #{nth(map-get($ratios, $ratioDefault), 1)};\n}\n\n@mixin ratioProps($breakpoint: null) {\n  @each $ratio, $value in $ratios {\n    $firstNr: nth($value, 1);\n    $secondNr: nth($value, 2);\n\n    @if $breakpoint {\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"]) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$firstNr} / #{$secondNr};\n        }\n      }\n\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$secondNr} / #{$firstNr};\n        }\n      }\n    } @else {\n      :host([ratio=\"#{$ratio}\"]) {\n        --ratio: #{$firstNr} / #{$secondNr};\n      }\n\n      :host([ratio=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        --ratio: #{$secondNr} / #{$firstNr};\n      }\n    }\n  }\n}\n\n@include ratioProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include ratioProps($breakpoint);\n}\n\n.stzh-ratio {\n  position: relative;\n  width: 100%;\n  aspect-ratio: var(--ratio);\n  background: var(--background-color);\n}\n","import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  scoped: true,\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop({ reflect: true }) ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop({ reflect: true }) ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop({ reflect: true }) ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop({ reflect: true }) ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop({ reflect: true }) ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-ratio.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,29QAA29Q;;MCYn+Q,SAAS;;;iBAE2B,MAAM;sBAEW,SAAS;uBAER,SAAS;sBAEV,SAAS;sBAET,SAAS;oBAG5B,KAAK;eAGE,OAAO;;EAI3D,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,YAAY,EAAE,IAAI;KACnB,CAAC;IAEF,QACEA,QAACC,UAAI,QACHD,iBAAK,KAAK,EAAE,OAAO,IACjBA,qBAAa,CACT,CACD,EACP;GACH;;;;;;;","names":["h","Host"],"sources":["src/components/stzh-ratio/stzh-ratio.scss?tag=stzh-ratio&encapsulation=scoped","src/components/stzh-ratio/stzh-ratio.tsx"],"sourcesContent":["/**\n * @prop --ratio: Ratio (e.g. 16 / 9)\n * @prop --background-color: Background color of ratio area\n * @prop --max-height: Max height of the ratio, useful when viewport is huge\n * @prop --overflow: In combination with max height you might wanna hide overflow\n *\n * @prop --stzh-ratio-background-color: **Global**: Background color of ratios\n */\n\n:host {\n  --background-color: #{$ratioBackgroundColor};\n  --ratio: #{nth(map-get($ratios, $ratioDefault), 1)}\n    / #{nth(map-get($ratios, $ratioDefault), 2)};\n  --max-height: inherit;\n  --overflow: inherit;\n\n  ::slotted(*) {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    inset: 0;\n    object-fit: cover;\n  }\n}\n\n:host([fit=\"contain\"]) ::slotted(*) {\n  object-fit: contain;\n}\n\n/* Ratio variants */\n\n:host([portrait]:not([portrait=\"false\"])) {\n  --ratio: #{nth(map-get($ratios, $ratioDefault), 2)}\n    / #{nth(map-get($ratios, $ratioDefault), 1)};\n}\n\n@mixin ratioProps($breakpoint: null) {\n  @each $ratio, $value in $ratios {\n    $firstNr: nth($value, 1);\n    $secondNr: nth($value, 2);\n\n    @if $breakpoint {\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"]) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$firstNr} / #{$secondNr};\n        }\n      }\n\n      :host([ratio-#{$breakpoint}=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        @include mq($from: $breakpoint) {\n          --ratio: #{$secondNr} / #{$firstNr};\n        }\n      }\n    } @else {\n      :host([ratio=\"#{$ratio}\"]) {\n        --ratio: #{$firstNr} / #{$secondNr};\n      }\n\n      :host([ratio=\"#{$ratio}\"][portrait]:not([portrait=\"false\"])) {\n        --ratio: #{$secondNr} / #{$firstNr};\n      }\n    }\n  }\n}\n\n@include ratioProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include ratioProps($breakpoint);\n}\n\n.stzh-ratio {\n  position: relative;\n  width: 100%;\n  aspect-ratio: var(--ratio);\n  background: var(--background-color);\n  max-height: var(--max-height);\n  overflow: var(--overflow);\n}\n","import { Component, Element, h, Host, Prop } from \"@stencil/core\";\n\nimport { Layout } from \"../../index\";\n\n/**\n * @slot - Slot for e.g. image or video\n */\n@Component({\n  tag: \"stzh-ratio\",\n  styleUrl: \"stzh-ratio.scss\",\n  scoped: true,\n})\nexport class StzhRatio {\n  /** Aspect ratio */\n  @Prop({ reflect: true }) ratio: Layout.Ratio = \"16:9\";\n  /** Aspect ratio above small breakpoint */\n  @Prop({ reflect: true }) ratioSmall: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above medium breakpoint */\n  @Prop({ reflect: true }) ratioMedium: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above large breakpoint */\n  @Prop({ reflect: true }) ratioLarge: Layout.Ratio | \"inherit\" = \"inherit\";\n  /** Aspect ratio above ultra breakpoint */\n  @Prop({ reflect: true }) ratioUltra: Layout.Ratio | \"inherit\" = \"inherit\";\n\n  /** Whether aspect ratio is in portrait mode */\n  @Prop({ reflect: true }) portrait: boolean = false;\n\n  /** Fit mode */\n  @Prop({ reflect: true }) fit: \"cover\" | \"contain\" = \"cover\";\n\n  @Element() element: HTMLStzhRatioElement;\n\n  render() {\n    const classes = {\n      \"stzh-ratio\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/stzh-readspeaker.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 require('./string-utils-5dd70320.js');
 
 const stzhReadspeakerCss = ":host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden]{display:none}:host::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}stzh-readspeaker{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;--background-color:var(--stzh-readspeaker-background-color, var(--stzh-color-white));--justify-content:var(--stzh-readspeaker-justify-content, space-between);--column-gap:var(--stzh-readspeaker-column-gap, auto);--audio-track-height:0.1875rem;--audio-track-background-color:var(--stzh-readspeaker-audio-track-background-color, var(--stzh-color-black20op));--audio-track-progress-background-color:var(--stzh-readspeaker-audio-track-progress-background-color, var(--stzh-color-secondary40));--dropdown-position:var(--stzh-readspeaker-dropdown-position, absolute);--dropdown-top:var(--stzh-readspeaker-dropdown-top, var(--stzh-form-input-small-height));--dropdown-bottom:var(--stzh-readspeaker-dropdown-bottom, auto);--dropdown-left:var(--stzh-readspeaker-dropdown-left, 0px);--dropdown-right:var(--stzh-readspeaker-dropdown-right, auto);--dropdown-settings-top:var(--stzh-readspeaker-dropdown-settings-top, var(--stzh-form-input-small-height));--dropdown-settings-bottom:var(--stzh-readspeaker-dropdown-settings-bottom, auto);--dropdown-settings-left:var(--stzh-readspeaker-dropdown-settings-left, 0px);--dropdown-settings-right:var(--stzh-readspeaker-dropdown-settings-right, auto)}stzh-readspeaker[hidden]{display:none}stzh-readspeaker::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}stzh-readspeaker::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}stzh-readspeaker *,stzh-readspeaker *::before,stzh-readspeaker *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}stzh-readspeaker .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}stzh-readspeaker .stzh-fylingfocus-focused{outline-style:none !important}stzh-readspeaker .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}@media screen and (min-width: 900px){stzh-readspeaker{--column-gap:var(--stzh-readspeaker-column-gap, var(--stzh-space-medium));--dropdown-top:var(--stzh-readspeaker-dropdown-top, var(--stzh-form-input-tiny-height));--dropdown-settings-top:var(--stzh-readspeaker-dropdown-settings-top, var(--stzh-form-input-tiny-height))}}@media print{stzh-readspeaker{display:none}}.stzh-readspeaker{position:relative;display:flex;align-items:center;-moz-column-gap:var(--column-gap);column-gap:var(--column-gap);justify-content:var(--justify-content)}.stzh-readspeaker__actions{flex-grow:1;display:flex;align-items:center;justify-content:space-between}.stzh-readspeaker stzh-button.stzh-readspeaker__close{display:none}.stzh-readspeaker:has(.rsbtn.rsexpanded) .stzh-readspeaker__close{display:inline-grid}@media screen and (min-width: 600px){.stzh-readspeaker:has(.rsbtn.rsexpanded) .stzh-readspeaker__close{display:none}}.stzh-readspeaker .rsbtn{z-index:var(--stzh-z-index-popover) !important;background:var(--background-color);position:var(--dropdown-position);top:var(--dropdown-top);bottom:var(--dropdown-bottom);left:var(--dropdown-left);right:var(--dropdown-right)}.stzh-readspeaker .rs_splitbutton.rs_splitbutton-exp{display:inline-flex}.stzh-readspeaker .rs_addtools,.stzh-readspeaker .rsbtn{margin-top:var(--audio-track-height);margin-bottom:0px}.stzh-readspeaker [class*=\" rsicn-\"],.stzh-readspeaker [class*=\" rsicn-\"]:before,.stzh-readspeaker [class^=rsicn-],.stzh-readspeaker [class^=rsicn-]:before{content:\"\";display:block;width:var(--stzh-icon-size);height:var(--stzh-icon-size);background-size:contain;background-position:center center}.stzh-readspeaker .rsicn-pause::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='M6 5h2v14H6zm10 0h2v14h-2z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_pause:hover .rsicn-pause::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='M6 5h2v14H6zm10 0h2v14h-2z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn.rsstopped .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause .rsicn::before,.stzh-readspeaker .rsbtn.rsidle .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause .rsicn::before,.stzh-readspeaker .rsbtn.rspaused .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause .rsicn::before{content:\"\";background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M16.394 12 10 7.737v8.526zm2.982.416L8.777 19.482A.5.5 0 0 1 8 19.066V4.934a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn.rsstopped .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause:hover .rsicn::before,.stzh-readspeaker .rsbtn.rsidle .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause:hover .rsicn::before,.stzh-readspeaker .rsbtn.rspaused .rsbtn_exp .rsbtn_exp_inner .rsbtn_pause:hover .rsicn::before{content:\"\";background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M16.394 12 10 7.737v8.526zm2.982.416L8.777 19.482A.5.5 0 0 1 8 19.066V4.934a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-stop::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='M7 7v10h10V7zM6 5h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_stop:hover .rsicn-stop::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='M7 7v10h10V7zM6 5h12a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-backwards::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='m12 10.667 9.223-6.149a.5.5 0 0 1 .777.416v14.132a.5.5 0 0 1-.777.416L12 13.333v5.733a.5.5 0 0 1-.777.416L.624 12.416a.5.5 0 0 1 0-.832l10.599-7.066a.5.5 0 0 1 .777.416zm-2 5.596V7.737L3.606 12zm10 0V7.737L13.606 12z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_rewind:hover .rsicn-backwards::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='m12 10.667 9.223-6.149a.5.5 0 0 1 .777.416v14.132a.5.5 0 0 1-.777.416L12 13.333v5.733a.5.5 0 0 1-.777.416L.624 12.416a.5.5 0 0 1 0-.832l10.599-7.066a.5.5 0 0 1 .777.416zm-2 5.596V7.737L3.606 12zm10 0V7.737L13.606 12z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-forwards::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='m12 13.333-9.223 6.15A.5.5 0 0 1 2 19.065V4.934a.5.5 0 0 1 .777-.416L12 10.668V4.933a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832l-10.599 7.066a.5.5 0 0 1-.777-.416zM10.394 12 4 7.737v8.526zM14 7.737v8.526L20.394 12z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_forward:hover .rsicn-forwards::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='m12 13.333-9.223 6.15A.5.5 0 0 1 2 19.065V4.934a.5.5 0 0 1 .777-.416L12 10.668V4.933a.5.5 0 0 1 .777-.416l10.599 7.066a.5.5 0 0 1 0 .832l-10.599 7.066a.5.5 0 0 1-.777-.416zM10.394 12 4 7.737v8.526zM14 7.737v8.526L20.394 12z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-volume::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M10 7.22 6.603 10H3v4h3.603L10 16.78zM5.889 16H2a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h3.889l5.294-4.332a.5.5 0 0 1 .817.387v15.89a.5.5 0 0 1-.817.387zm13.517 4.134-1.416-1.416A8.98 8.98 0 0 0 21 12a8.98 8.98 0 0 0-3.304-6.968l1.42-1.42A10.98 10.98 0 0 1 23 12c0 3.223-1.386 6.122-3.594 8.134m-3.543-3.543-1.422-1.422A4 4 0 0 0 16 12c0-1.43-.75-2.685-1.88-3.392l1.439-1.439A5.99 5.99 0 0 1 18 12c0 1.842-.83 3.49-2.137 4.591'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_volume:hover .rsicn-volume::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M10 7.22 6.603 10H3v4h3.603L10 16.78zM5.889 16H2a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h3.889l5.294-4.332a.5.5 0 0 1 .817.387v15.89a.5.5 0 0 1-.817.387zm13.517 4.134-1.416-1.416A8.98 8.98 0 0 0 21 12a8.98 8.98 0 0 0-3.304-6.968l1.42-1.42A10.98 10.98 0 0 1 23 12c0 3.223-1.386 6.122-3.594 8.134m-3.543-3.543-1.422-1.422A4 4 0 0 0 16 12c0-1.43-.75-2.685-1.88-3.392l1.439-1.439A5.99 5.99 0 0 1 18 12c0 1.842-.83 3.49-2.137 4.591'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-speed::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2m0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16m3.833 3.337a.595.595 0 0 1 .763.067.59.59 0 0 1 .063.76q-3.27 4.569-3.598 4.897a1.5 1.5 0 0 1-2.122 0 1.5 1.5 0 0 1 0-2.122q.56-.56 4.894-3.602M17.5 11a1 1 0 1 1 0 2 1 1 0 0 1 0-2m-11 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2m2.318-3.596a1 1 0 1 1-1.416 1.414 1 1 0 0 1 1.416-1.414M12 5.5a1 1 0 1 1 0 2 1 1 0 0 1 0-2'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_speed:hover .rsicn-speed::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2m0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16m3.833 3.337a.595.595 0 0 1 .763.067.59.59 0 0 1 .063.76q-3.27 4.569-3.598 4.897a1.5 1.5 0 0 1-2.122 0 1.5 1.5 0 0 1 0-2.122q.56-.56 4.894-3.602M17.5 11a1 1 0 1 1 0 2 1 1 0 0 1 0-2m-11 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2m2.318-3.596a1 1 0 1 1-1.416 1.414 1 1 0 0 1 1.416-1.414M12 5.5a1 1 0 1 1 0 2 1 1 0 0 1 0-2'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_closer:focus span.rsicn::before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_closer:hover span.rsicn::before{content:\"\"}.stzh-readspeaker .rsicn-cross::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='m12 10.586 7.778-7.778 1.414 1.414L13.414 12l7.778 7.778-1.414 1.414L12 13.414l-7.778 7.778-1.414-1.414L10.586 12 2.808 4.222l1.414-1.414z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_closer:hover .rsicn-cross::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='m12 10.586 7.778-7.778 1.414 1.414L13.414 12l7.778 7.778-1.414 1.414L12 13.414l-7.778 7.778-1.414-1.414L10.586 12 2.808 4.222l1.414-1.414z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rs_addtools .rsbtn_tooltoggle .rsicn::before,.stzh-readspeaker .rsbtn .rsbtn_tooltoggle .rsicn::before{content:\"\"}.stzh-readspeaker .rsicn-arrow-down::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M12 3c-.825 0-1.5.675-1.5 1.5S11.175 6 12 6s1.5-.675 1.5-1.5S12.825 3 12 3m0 15c-.825 0-1.5.675-1.5 1.5S11.175 21 12 21s1.5-.675 1.5-1.5S12.825 18 12 18m0-7.5c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5 1.5-.675 1.5-1.5-.675-1.5-1.5-1.5'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_tooltoggle:hover .rsicn-arrow-down::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M12 3c-.825 0-1.5.675-1.5 1.5S11.175 6 12 6s1.5-.675 1.5-1.5S12.825 3 12 3m0 15c-.825 0-1.5.675-1.5 1.5S11.175 21 12 21s1.5-.675 1.5-1.5S12.825 18 12 18m0-7.5c-.825 0-1.5.675-1.5 1.5s.675 1.5 1.5 1.5 1.5-.675 1.5-1.5-.675-1.5-1.5-1.5'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker #rsmpl_container .rs-player-loadindicator,.stzh-readspeaker .rsbtn .rs-player-loadindicator{background-color:var(--audio-track-background-color);height:var(--audio-track-height);top:calc(var(--audio-track-height) / -1);left:0;right:0px}.stzh-readspeaker #rsmpl_container .rs-player-loadindicator .rsbtn-loading,.stzh-readspeaker .rsbtn .rs-player-loadindicator .rsbtn-loading,.stzh-readspeaker #rsmpl_container .rs-player-loadindicator .rsbtn-progress,.stzh-readspeaker .rsbtn .rs-player-loadindicator .rsbtn-progress{background-color:var(--audio-track-progress-background-color)}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle{display:flex;justify-content:center;align-items:center;border-left:none;width:var(--stzh-form-input-small-height);height:var(--stzh-form-input-small-height);transition-property:background-color;transition-duration:var(--stzh-base-transition-animation-speed);background-color:transparent;outline:none;float:none}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class*=\" rsicn-\"],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class*=\" rsicn-\"]:before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class^=rsicn-],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class^=rsicn-]:before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class*=\" rsicn-\"],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class*=\" rsicn-\"]:before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class^=rsicn-],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class^=rsicn-]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class*=\" rsicn-\"],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class*=\" rsicn-\"]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class^=rsicn-],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class^=rsicn-]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class*=\" rsicn-\"],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class*=\" rsicn-\"]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class^=rsicn-],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class^=rsicn-]:before{width:var(--stzh-icon-size);height:var(--stzh-icon-size)}@media screen and (min-width: 900px){.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class*=\" rsicn-\"],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class*=\" rsicn-\"]:before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class^=rsicn-],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item [class^=rsicn-]:before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class*=\" rsicn-\"],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class*=\" rsicn-\"]:before,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class^=rsicn-],.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active [class^=rsicn-]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class*=\" rsicn-\"],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class*=\" rsicn-\"]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class^=rsicn-],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle [class^=rsicn-]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class*=\" rsicn-\"],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class*=\" rsicn-\"]:before,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class^=rsicn-],.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle [class^=rsicn-]:before{width:var(--stzh-icon-size-small);height:var(--stzh-icon-size-small)}}@media screen and (min-width: 900px){.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle{width:var(--stzh-form-input-tiny-height);height:var(--stzh-form-input-tiny-height)}}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:focus,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active:focus,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle:focus,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle:focus{background-color:transparent;outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:hover,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active:hover,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle:hover,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle:hover{background-color:var(--stzh-color-secondary20)}@media screen and (max-width: 599px){.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item.rsbtn_closer,.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_player_item:active.rsbtn_closer,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle.rsbtn_closer,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle.rsbtn_closer{display:none}}.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle{margin-right:var(--stzh-space-xxxsmall)}.stzh-readspeaker .rs_splitbutton .rsbtn_exp .rsbtn_exp_inner button.rsbtn_pause.rsbtn_player_item{padding-left:0px;padding-right:0px}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_stop:active span.rsicn{background:transparent}.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle,.stzh-readspeaker .rs_splitbutton.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle{display:flex !important;position:relative;top:0;border-left:none;border-right:none}.stzh-readspeaker .rs_splitbutton.zoom-tooltoggler.rsexpanded:not(.rsdetached).rs_addtools .rsbtn_tooltoggle,.stzh-readspeaker .rs_splitbutton.zoom-tooltoggler.rsexpanded:not(.rsdetached).rsbtn .rsbtn_tooltoggle{left:0}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner{position:static;background:transparent;display:inline-flex;border:none;border-radius:0px;gap:var(--stzh-space-xxxsmall)}.stzh-readspeaker .rsbtn .rsbtn_exp,.stzh-readspeaker .rsbtn.rsexpanded .rsbtn_exp .rsbtn_exp_inner{height:auto}.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_dropdown{box-sizing:border-box;border:none;width:var(--stzh-form-input-small-height);height:7.25rem;top:var(--stzh-form-input-small-height);margin-top:var(--stzh-space-xxsmall);background-color:var(--stzh-color-grey10);padding:0;padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-readspeaker .rsbtn .rsbtn_exp .rsbtn_exp_inner .rsbtn_dropdown{width:var(--stzh-form-input-tiny-height);top:var(--stzh-form-input-tiny-height)}}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range],.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range],.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range],.stzh-readspeaker .rsbtn input.rs-slider[type=range]{overflow:hidden;-webkit-appearance:none !important;-moz-appearance:none !important;appearance:none !important;background:transparent;margin:0px;--thumb-height:1.25rem;--thumb-border-width:0.125rem;--thumb-border-color:var(--stzh-color-primary70);--thumb-background-color:var(--stzh-color-white);--track-height:0.5rem;--track-color:var(--stzh-color-black40op);--track-progress-color:var(--stzh-color-secondary60);--clip-edges:0.0625rem}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range],.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range],.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range],.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-webkit-slider-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range],.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-webkit-slider-thumb{position:relative;-webkit-appearance:none;-webkit-transition:all var(--stzh-base-transition-animation-speed);transition:all var(--stzh-base-transition-animation-speed);height:var(--thumb-height)}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range],.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range],.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range],.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range],.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-thumb{position:relative;margin:0px;-moz-appearance:none;appearance:none;-moz-transition:all var(--stzh-base-transition-animation-speed);transition:all var(--stzh-base-transition-animation-speed);height:var(--thumb-height)}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-webkit-slider-runnable-track,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-webkit-slider-runnable-track{background:linear-gradient(var(--track-color) 0 0) scroll no-repeat center/100% calc(var(--track-height) + 0.0625rem)}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-track{width:100%;background:var(--track-color)}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-progress,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-progress,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-progress,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-progress{-moz-appearance:none;appearance:none;background:var(--track-progress-color);transition-delay:30ms}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-progress,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-progress,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-progress,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-track,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-progress{height:calc(var(--track-height) + 0.0625rem);border-radius:var(--track-height)}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-webkit-slider-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-webkit-slider-thumb{--thumb-radius:calc((var(--thumb-height) * 0.5) - 0.0625rem);--clip-top:calc((var(--thumb-height) - var(--track-height)) * 0.5 - 0.5px);--clip-bottom:calc(var(--thumb-height) - var(--clip-top));--clip-further:calc(100% + 0.0625rem);--box-fill:calc(-100vmax - var(--thumb-width, var(--thumb-height))) 0 0 100vmax var(--track-progress-color);width:var(--thumb-width, var(--thumb-height));background-color:var(--thumb-background-color);border-style:solid;border-width:var(--thumb-border-width);border-color:var(--thumb-border-color);box-shadow:var(--box-fill);border-radius:var(--thumb-width, var(--thumb-height));filter:brightness(100%);-webkit-clip-path:polygon(100% -0.0625rem, var(--clip-edges) -0.0625rem, 0 var(--clip-top), -100vmax var(--clip-top), -100vmax var(--clip-bottom), 0 var(--clip-bottom), var(--clip-edges) 100%, var(--clip-further) var(--clip-further));clip-path:polygon(100% -0.0625rem, var(--clip-edges) -0.0625rem, 0 var(--clip-top), -100vmax var(--clip-top), -100vmax var(--clip-bottom), 0 var(--clip-bottom), var(--clip-edges) 100%, var(--clip-further) var(--clip-further))}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]::-moz-range-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]::-moz-range-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]::-moz-range-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range]::-moz-range-thumb{background-color:var(--thumb-background-color);border-style:solid;border-width:var(--thumb-border-width);border-color:var(--thumb-border-color);border:0;width:var(--thumb-width, var(--thumb-height));border-radius:var(--thumb-width, var(--thumb-height));cursor:grab}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]:active,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]:active,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]:active,.stzh-readspeaker .rsbtn input.rs-slider[type=range]:active{cursor:-webkit-grabbing;cursor:grabbing}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]:active::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]:active::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]:active::-webkit-slider-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range]:active::-webkit-slider-thumb{cursor:-webkit-grabbing;cursor:grabbing}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]:active::-moz-range-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]:active::-moz-range-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]:active::-moz-range-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range]:active::-moz-range-thumb{cursor:grabbing}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]:disabled,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]:disabled,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]:disabled,.stzh-readspeaker .rsbtn input.rs-slider[type=range]:disabled{cursor:not-allowed}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]:disabled::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]:disabled::-webkit-slider-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]:disabled::-webkit-slider-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range]:disabled::-webkit-slider-thumb{cursor:not-allowed}.stzh-readspeaker #rs-textsettings input.rs-slider[type=range]:disabled::-moz-range-thumb,.stzh-readspeaker .rs-dialog-esque input.rs-slider[type=range]:disabled::-moz-range-thumb,.stzh-readspeaker .rs-dialog-slider-dropdown input.rs-slider[type=range]:disabled::-moz-range-thumb,.stzh-readspeaker .rsbtn input.rs-slider[type=range]:disabled::-moz-range-thumb{cursor:not-allowed}.stzh-readspeaker .rsbtn .rs-slider.vertical,.stzh-readspeaker .rsbtn .rs-slider.vertical.has-datalist{transform:rotate(270deg) translateX(-0.375rem) translateY(-0.375rem);transform-origin:bottom center;width:6.25rem;height:var(--stzh-form-input-small-height)}@media screen and (min-width: 900px){.stzh-readspeaker .rsbtn .rs-slider.vertical,.stzh-readspeaker .rsbtn .rs-slider.vertical.has-datalist{height:var(--stzh-form-input-tiny-height);transform:rotate(270deg) translateX(-1.125rem) translateY(-1.125rem)}}.stzh-readspeaker #rs-textsettings .rs-slider-label,.stzh-readspeaker .rs-dialog-esque .rs-slider-label,.stzh-readspeaker .rs-dialog-slider-dropdown .rs-slider-label,.stzh-readspeaker .rsbtn .rs-slider-label{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height);border-radius:0px;border:none;box-shadow:none;color:var(--stzh-color-white);background-color:var(--stzh-color-coolgrey60);height:1.25rem;line-height:1.25rem;padding:0;padding-left:var(--stzh-space-xxsmall);padding-right:var(--stzh-space-xxsmall)}.stzh-readspeaker .rsbtn_powered{display:none}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical{position:absolute;top:var(--dropdown-settings-top);bottom:var(--dropdown-settings-bottom);left:var(--dropdown-settings-left);right:var(--dropdown-settings-right);min-width:initial !important}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools{position:static;border-radius:0px;border:none;margin-top:var(--stzh-space-xxsmall);background-color:var(--stzh-color-grey10);padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall)}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li{all:unset}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool{display:flex;align-items:center;padding:var(--stzh-space-xsmall) var(--stzh-space-large);white-space:nowrap;color:var(--stzh-color-primary70);transition-property:color, background-color;transition-duration:var(--stzh-base-transition-animation-speed)}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool:hover,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool:hover{color:var(--stzh-color-primary80);background-color:var(--stzh-color-secondary20)}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool span.rsbtn_btnlabel,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool span.rsbtn_btnlabel{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);margin-left:var(--stzh-space-xsmall);margin-right:auto;color:inherit}.stzh-readspeaker .rsicn-settings::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M3.34 17a10 10 0 0 1-.978-2.326 3 3 0 0 0 .002-5.347A10 10 0 0 1 4.865 4.99a3 3 0 0 0 4.631-2.674 10 10 0 0 1 5.007.002 3 3 0 0 0 4.632 2.672A10 10 0 0 1 20.66 7c.433.75.757 1.53.978 2.326a3 3 0 0 0-.002 5.347 10 10 0 0 1-2.5 4.337 3 3 0 0 0-4.632 2.674 10 10 0 0 1-5.007-.002 3 3 0 0 0-4.632-2.672A10 10 0 0 1 3.34 17m5.66.196a5 5 0 0 1 2.25 2.77q.75.071 1.5.001a5 5 0 0 1 2.25-2.77 5 5 0 0 1 3.525-.565q.435-.614.748-1.298A5 5 0 0 1 18 12c0-1.26.47-2.437 1.273-3.334q-.315-.684-.75-1.298A5 5 0 0 1 15 6.804a5 5 0 0 1-2.25-2.77q-.75-.071-1.499 0a5 5 0 0 1-2.25 2.77 5 5 0 0 1-3.526.564 8 8 0 0 0-.748 1.298A5 5 0 0 1 6 12a5 5 0 0 1-1.273 3.334q.315.684.75 1.298A5 5 0 0 1 9 17.196M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_tool:hover .rsicn-settings::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M3.34 17a10 10 0 0 1-.978-2.326 3 3 0 0 0 .002-5.347A10 10 0 0 1 4.865 4.99a3 3 0 0 0 4.631-2.674 10 10 0 0 1 5.007.002 3 3 0 0 0 4.632 2.672A10 10 0 0 1 20.66 7c.433.75.757 1.53.978 2.326a3 3 0 0 0-.002 5.347 10 10 0 0 1-2.5 4.337 3 3 0 0 0-4.632 2.674 10 10 0 0 1-5.007-.002 3 3 0 0 0-4.632-2.672A10 10 0 0 1 3.34 17m5.66.196a5 5 0 0 1 2.25 2.77q.75.071 1.5.001a5 5 0 0 1 2.25-2.77 5 5 0 0 1 3.525-.565q.435-.614.748-1.298A5 5 0 0 1 18 12c0-1.26.47-2.437 1.273-3.334q-.315-.684-.75-1.298A5 5 0 0 1 15 6.804a5 5 0 0 1-2.25-2.77q-.75-.071-1.499 0a5 5 0 0 1-2.25 2.77 5 5 0 0 1-3.526.564 8 8 0 0 0-.748 1.298A5 5 0 0 1 6 12a5 5 0 0 1-1.273 3.334q.315.684.75 1.298A5 5 0 0 1 9 17.196M12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6m0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-click-listen::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='M13.91 12.36 17 20.854l-2.818 1.026-3.092-8.494-4.172 3.156 1.49-14.909 10.726 10.463z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_tool:hover .rsicn-click-listen::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='M13.91 12.36 17 20.854l-2.818 1.026-3.092-8.494-4.172 3.156 1.49-14.909 10.726 10.463z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-enlarged-text::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M11.246 15H4.754l-2 5H.6L7 4h2l6.4 16h-2.154zm-.8-2L8 6.885 5.554 13zM21 12.535V12h2v8h-2v-.535a4 4 0 1 1 0-6.93M19 18a2 2 0 1 0 0-4 2 2 0 0 0 0 4'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_tool:hover .rsicn-enlarged-text::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M11.246 15H4.754l-2 5H.6L7 4h2l6.4 16h-2.154zm-.8-2L8 6.885 5.554 13zM21 12.535V12h2v8h-2v-.535a4 4 0 1 1 0-6.93M19 18a2 2 0 1 0 0-4 2 2 0 0 0 0 4'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='currentColor' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-textmode::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='M20 22H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1m-1-2V4H5v16zM8 7h8v2H8zm0 4h8v2H8zm0 4h5v2H8z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_tool:hover .rsicn-textmode::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='M20 22H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1m-1-2V4H5v16zM8 7h8v2H8zm0 4h8v2H8zm0 4h5v2H8z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsicn-pagemask::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cpath d='M21 16v5H3v-5h2v3h14v-3zM3 11h18v2H3zm18-3h-2V5H5v3H3V3h18z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rsbtn_tool:hover .rsicn-pagemask::before{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cpath d='M21 16v5H3v-5h2v3h14v-3zM3 11h18v2H3zm18-3h-2V5H5v3H3V3h18z'/%3E%3C/svg%3E\")}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler{margin:0;margin-left:var(--stzh-space-large);background-color:var(--stzh-color-grey70);border-radius:0.75rem;box-sizing:border-box;width:3rem;height:1.5rem;border:none;transition:background-color var(--stzh-base-transition-animation-speed)}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler .on-icon,.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler .off-icon,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler .on-icon,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler .off-icon{display:none}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler::after,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool .rs_minitoggler::after{width:1.25rem;height:1.25rem;top:0.125rem;left:0.125rem;transition:all var(--stzh-base-transition-animation-speed);background-color:var(--stzh-color-white)}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool.active .rs_minitoggler,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool.active .rs_minitoggler{background-color:var(--stzh-color-secondary50)}.stzh-readspeaker .rs_addtools .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool.active .rs_minitoggler::after,.stzh-readspeaker .rsbtn .rsbtn_toolpanel.vertical .rsbtn_tools .rsbtn_tools_inner .rsbtn_toolcontainer ul.rsbtn_toollist li button.rsbtn_tool.active .rs_minitoggler::after{left:calc(50% + 0.125rem);background-color:var(--stzh-color-white)}#readspeaker_tooltip.rs_tooltip{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);font-size:var(--stzh-font-pico-font-size);line-height:var(--stzh-font-pico-text-line-height);z-index:var(--stzh-z-index-popup);border:none;border-radius:0px;box-shadow:none;color:var(--stzh-color-white);background-color:var(--stzh-color-coolgrey60);height:1.25rem;line-height:1.25rem;padding:0;padding-left:var(--stzh-space-xxsmall);padding-right:var(--stzh-space-xxsmall)}.rspopup.rspopup{z-index:var(--stzh-z-index-popup);background:var(--stzh-color-grey10);border:none;border-radius:0px;box-shadow:none}.rspopup.rspopup .rspopup_btn{height:var(--stzh-form-input-small-height);box-sizing:border-box;display:flex;padding:var(--stzh-space-xsmall) var(--stzh-space-large);justify-content:center;align-items:center;gap:var(--stzh-space-xsmall);border-top:none;color:var(--stzh-color-primary70);transition-property:color, background-color;transition-duration:var(--stzh-base-transition-animation-speed)}.rspopup.rspopup .rspopup_btn:hover{color:var(--stzh-color-primary80);background-color:var(--stzh-color-secondary20)}.rspopup.rspopup .rspopup_btn.rspopup_play::before{content:\"\";margin-right:0;left:0;position:relative;width:var(--stzh-icon-size);height:var(--stzh-icon-size);background-size:contain;background-position:center center;background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230F05A0' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M10 7.22 6.603 10H3v4h3.603L10 16.78zM5.889 16H2a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h3.889l5.294-4.332a.5.5 0 0 1 .817.387v15.89a.5.5 0 0 1-.817.387zm13.517 4.134-1.416-1.416A8.98 8.98 0 0 0 21 12a8.98 8.98 0 0 0-3.304-6.968l1.42-1.42A10.98 10.98 0 0 1 23 12c0 3.223-1.386 6.122-3.594 8.134m-3.543-3.543-1.422-1.422A4 4 0 0 0 16 12c0-1.43-.75-2.685-1.88-3.392l1.439-1.439A5.99 5.99 0 0 1 18 12c0 1.842-.83 3.49-2.137 4.591'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.rspopup.rspopup .rspopup_btn.rspopup_play:hover::before{background:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23070066' viewBox='0 0 24 24'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M10 7.22 6.603 10H3v4h3.603L10 16.78zM5.889 16H2a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1h3.889l5.294-4.332a.5.5 0 0 1 .817.387v15.89a.5.5 0 0 1-.817.387zm13.517 4.134-1.416-1.416A8.98 8.98 0 0 0 21 12a8.98 8.98 0 0 0-3.304-6.968l1.42-1.42A10.98 10.98 0 0 1 23 12c0 3.223-1.386 6.122-3.594 8.134m-3.543-3.543-1.422-1.422A4 4 0 0 0 16 12c0-1.43-.75-2.685-1.88-3.392l1.439-1.439A5.99 5.99 0 0 1 18 12c0 1.842-.83 3.49-2.137 4.591'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E\")}.rspopup.rspopup .rspopup_btn.rspopup_play::after{content:none}.rspopup.rspopup .rspopup_btn span.rspopup_label{font-family:var(--stzh-font-family-heavy);font-weight:var(--stzh-font-weight-heavy);font-style:var(--stzh-font-style-heavy);font-size:var(--stzh-font-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);top:0}";

package/dist/cjs/stzh-scrollup.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 require('./string-utils-5dd70320.js');
 
 const stzhScrollupCss = ":host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden]{display:none}:host::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{display:contents}@media print{:host{display:none}}.stzh-scrollup{display:contents}";
@@ -15,24 +15,24 @@ const StzhScrollup = class {
       window.scrollTo({
         top: 0,
         left: 0,
-        behavior: "smooth"
+        behavior: "smooth",
       });
     };
     this.handleSlotchange = () => {
       var _a;
       const host = ((_a = this.element.getRootNode()) === null || _a === void 0 ? void 0 : _a.host) || this.element;
       const links = host.querySelectorAll("stzh-link, stzh-button");
-      links.forEach((link) => {
-        link.addEventListener('click', this.handleLinkClick);
+      links.forEach(link => {
+        link.addEventListener("click", this.handleLinkClick);
         utils.setPropsIfNull(link, {
-          icon: "arrow-up"
+          icon: "arrow-up",
         });
       });
     };
   }
   render() {
     const classes = {
-      "stzh-scrollup": true
+      "stzh-scrollup": true,
     };
     return (index.h(index.Host, null, index.h("div", { class: classes }, index.h("slot", { onSlotchange: this.handleSlotchange }))));
   }

package/dist/cjs/stzh-scrollup.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"stzh-scrollup.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,eAAe,GAAG,skCAAskC;;MCiBjlC,YAAY;EALzB;;IAQU,oBAAe,GAAG;MACxB,MAAM,CAAC,QAAQ,CAAC;QACd,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,QAAQ;OACnB,CAAC,CAAC;KACJ,CAAA;IAEO,qBAAgB,GAAG;;MACzB,MAAM,IAAI,GAAG,CAAA,MAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAiB,0CAAE,IAAI,KAAI,IAAI,CAAC,OAAO,CAAC;MAC9E,MAAM,KAAK,GAAG,IAAI,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC;MAE9D,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI;QACjB,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;QAErDA,oBAAc,CAAC,IAAI,EAAE;UACnB,IAAI,EAAE,UAAU;SAC8B,CAAC,CAAA;OAClD,CAAC,CAAC;KACJ,CAAA;GAeF;EAbC,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,eAAe,EAAE,IAAI;KACtB,CAAC;IAEF,QACEC,QAACC,UAAI,QACHD,iBAAK,KAAK,EAAE,OAAO,IACjBA,kBAAM,YAAY,EAAE,IAAI,CAAC,gBAAgB,GAAS,CAC9C,CACD,EACP;GACH;;;;;;;","names":["setPropsIfNull","h","Host"],"sources":["src/components/stzh-scrollup/stzh-scrollup.scss?tag=stzh-scrollup&encapsulation=shadow","src/components/stzh-scrollup/stzh-scrollup.tsx"],"sourcesContent":[":host {\n  display: contents;\n\n  @media print {\n    display: none;\n  }\n}\n\n.stzh-scrollup {\n  display: contents;\n}\n","import {\n  Component,\n  Host,\n  h,\n  Element,\n} from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for label\n */\n@Component({\n  tag: \"stzh-scrollup\",\n  styleUrl: \"stzh-scrollup.scss\",\n  shadow: true\n})\nexport class StzhScrollup {\n  @Element() element: HTMLStzhScrollupElement;\n\n  private handleLinkClick = () => {\n    window.scrollTo({\n      top: 0,\n      left: 0,\n      behavior: \"smooth\"\n    });\n  }\n\n  private handleSlotchange = () => {\n    const host = (this.element.getRootNode() as ShadowRoot)?.host || this.element;\n    const links = host.querySelectorAll(\"stzh-link, stzh-button\");\n\n    links.forEach((link) => {\n      link.addEventListener('click', this.handleLinkClick);\n\n      setPropsIfNull(link, {\n        icon: \"arrow-up\"\n      } as HTMLStzhLinkElement | HTMLStzhButtonElement)\n    });\n  }\n\n  render() {\n    const classes = {\n      \"stzh-scrollup\": true\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot onSlotchange={this.handleSlotchange}></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-scrollup.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,eAAe,GAAG,skCAAskC;;MCYjlC,YAAY;EALzB;;IAQU,oBAAe,GAAG;MACxB,MAAM,CAAC,QAAQ,CAAC;QACd,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,QAAQ,EAAE,QAAQ;OACnB,CAAC,CAAC;KACJ,CAAC;IAEM,qBAAgB,GAAG;;MACzB,MAAM,IAAI,GAAG,CAAA,MAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAAiB,0CAAE,IAAI,KAAI,IAAI,CAAC,OAAO,CAAC;MAC9E,MAAM,KAAK,GAAG,IAAI,CAAC,gBAAgB,CAAC,wBAAwB,CAAC,CAAC;MAE9D,KAAK,CAAC,OAAO,CAAC,IAAI;QAChB,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;QAErDA,oBAAc,CAAC,IAAI,EAAE;UACnB,IAAI,EAAE,UAAU;SAC8B,CAAC,CAAC;OACnD,CAAC,CAAC;KACJ,CAAC;GAeH;EAbC,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,eAAe,EAAE,IAAI;KACtB,CAAC;IAEF,QACEC,QAACC,UAAI,QACHD,iBAAK,KAAK,EAAE,OAAO,IACjBA,kBAAM,YAAY,EAAE,IAAI,CAAC,gBAAgB,GAAS,CAC9C,CACD,EACP;GACH;;;;;;;","names":["setPropsIfNull","h","Host"],"sources":["src/components/stzh-scrollup/stzh-scrollup.scss?tag=stzh-scrollup&encapsulation=shadow","src/components/stzh-scrollup/stzh-scrollup.tsx"],"sourcesContent":[":host {\n  display: contents;\n\n  @media print {\n    display: none;\n  }\n}\n\n.stzh-scrollup {\n  display: contents;\n}\n","import { Component, Host, h, Element } from \"@stencil/core\";\n\nimport { setPropsIfNull } from \"../../utils/utils\";\n\n/**\n * @slot - Slot for label\n */\n@Component({\n  tag: \"stzh-scrollup\",\n  styleUrl: \"stzh-scrollup.scss\",\n  shadow: true,\n})\nexport class StzhScrollup {\n  @Element() element: HTMLStzhScrollupElement;\n\n  private handleLinkClick = () => {\n    window.scrollTo({\n      top: 0,\n      left: 0,\n      behavior: \"smooth\",\n    });\n  };\n\n  private handleSlotchange = () => {\n    const host = (this.element.getRootNode() as ShadowRoot)?.host || this.element;\n    const links = host.querySelectorAll(\"stzh-link, stzh-button\");\n\n    links.forEach(link => {\n      link.addEventListener(\"click\", this.handleLinkClick);\n\n      setPropsIfNull(link, {\n        icon: \"arrow-up\",\n      } as HTMLStzhLinkElement | HTMLStzhButtonElement);\n    });\n  };\n\n  render() {\n    const classes = {\n      \"stzh-scrollup\": true,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          <slot onSlotchange={this.handleSlotchange}></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/stzh-search.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
 const axios = require('./axios-32d5fd86.js');
-const utils = require('./utils-d0fff87f.js');
+const utils = require('./utils-d091c010.js');
 const mediaUtils = require('./media-utils-fa9f86b8.js');
 const debounce = require('./debounce-c8f1f58a.js');
 require('./string-utils-5dd70320.js');

package/dist/cjs/stzh-section.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-92254d32.js');
 
-const stzhSectionCss = ":host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden]{display:none}:host::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{--color:var(--stzh-color-black);--background-color:transparent;--heading-background-color:transparent;--padding-left:var(--stzh-section-padding-left, 0px);--padding-right:var(--stzh-section-padding-right, 0px);--padding-top:var(--stzh-section-padding-top, var(--stzh-space-large));--padding-bottom:var(--stzh-section-padding-bottom, var(--stzh-space-large));--margin-top:var(--stzh-section-margin-top, 0px);--margin-bottom:var(--stzh-section-margin-bottom, 0px);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom)}@media screen and (min-width: 600px){:host{--padding-bottom:var(--stzh-section-padding-bottom, var(--stzh-space-xlarge))}}@media screen and (min-width: 1260px){:host{--padding-bottom:var(--stzh-section-padding-bottom, var(--stzh-space-xxxlarge))}}:host ::slotted(stzh-heading){margin-top:var(--stzh-space-xsmall);margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 900px){:host ::slotted(stzh-heading){margin-top:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host ::slotted(stzh-heading){margin-top:var(--stzh-space-medium)}}@media screen and (min-width: 900px){:host ::slotted(stzh-heading){margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host ::slotted(stzh-heading){margin-bottom:var(--stzh-space-large)}}:host(:where([breakout]:not([breakout=\"default\"]))){position:relative;left:50%;right:50%;margin-left:calc(-50vw + var(--stzh-scrollbar-width) / 2);margin-right:calc(-50vw + var(--stzh-scrollbar-width) / 2);width:calc(100vw - var(--stzh-scrollbar-width));max-width:calc(100vw - var(--stzh-scrollbar-width))}:host(:where([background]:not([background=\"default\"]))){--padding-bottom:var(--stzh-section-background-padding-bottom, var(--stzh-space-xlarge));--margin-top:var(--stzh-section-background-margin-top, var(--stzh-space-medium));--margin-bottom:var(--stzh-section-background-margin-bottom, var(--stzh-space-medium))}@media screen and (min-width: 600px){:host(:where([background]:not([background=\"default\"]))){--padding-bottom:var(--stzh-section-background-padding-bottom, var(--stzh-space-xxlarge))}}@media screen and (min-width: 1260px){:host(:where([background]:not([background=\"default\"]))){--padding-bottom:var(--stzh-section-background-padding-bottom, var(--stzh-space-xxxxlarge));--margin-top:var(--stzh-section-background-margin-top, var(--stzh-space-xxlarge));--margin-bottom:var(--stzh-section-background-margin-bottom, var(--stzh-space-xxlarge))}}:host([background=secondary]){--background-color:var(--stzh-color-secondary20)}:host([background=primary]){--background-color:var(--stzh-color-primary70)}:host([variant=highlight]){--padding-left:var(--stzh-space-small);--padding-right:var(--stzh-space-small);--padding-top:var(--stzh-space-xlarge);--padding-bottom:var(--stzh-space-xlarge);--color:var(--stzh-section-highlight-color);--background-color:var(--stzh-section-highlight-background-color);--heading-background-color:var(--stzh-color-secondary40);--stzh-section-padding-top:0px;--stzh-section-padding-bottom:0px;--stzh-section-margin-top:0px;--stzh-section-margin-bottom:0px}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-right:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-bottom:var(--stzh-space-xxxlarge)}}:host([variant=contextbox]){--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--padding-top:var(--stzh-space-medium);--padding-bottom:var(--stzh-space-medium);--color:var(--stzh-section-highlight-color);--background-color:var(--stzh-section-highlight-background-color);--heading-background-color:var(--stzh-color-secondary40);--stzh-section-padding-top:0px;--stzh-section-padding-bottom:0px;--stzh-section-margin-top:0px;--stzh-section-margin-bottom:0px}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-bottom:var(--stzh-space-xxlarge)}}:host([variant=contextbox]):last-child{margin-bottom:0}:host([margin-top=none]){--margin-top:0px}:host([margin-bottom=none]){--margin-bottom:0px}:host([padding-bottom=none]){--padding-bottom:0px}.stzh-section{background-color:var(--background-color)}.stzh-section__heading{display:flex;flex-direction:column;background-color:var(--heading-background-color);padding-left:var(--padding-left);padding-right:var(--padding-right)}.stzh-section__wrapper{padding-left:var(--padding-left);padding-right:var(--padding-right);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);--stzh-base-color:var(--color)}.stzh-section--is-breakout .stzh-section__outer{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-section--is-breakout .stzh-section__outer{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-section--is-breakout .stzh-section__outer{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-section--is-breakout .stzh-section__outer{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-section--is-breakout .stzh-section__outer{margin-left:auto;margin-right:auto;max-width:84.25rem}}";
+const stzhSectionCss = ":host{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium);color:var(--stzh-base-color);box-sizing:border-box;display:block;}:host[hidden]{display:none}:host::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}:host *,:host *::before,:host *::after{box-sizing:border-box;text-underline-offset:var(--stzh-link-text-underline-offset);text-decoration-thickness:var(--stzh-link-text-decoration-thickness);-webkit-text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink);text-decoration-skip-ink:var(--stzh-link-text-decoration-skip-ink)}:host .has-focus{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}:host .stzh-fylingfocus-focused{outline-style:none !important}:host .stzh-fylingfocus-focused::-moz-focus-inner{border:0 !important}:host{--color:var(--stzh-color-black);--background-color:transparent;--heading-background-color:transparent;--padding-left:var(--stzh-section-padding-left, 0px);--padding-right:var(--stzh-section-padding-right, 0px);--padding-top:var(--stzh-section-padding-top, var(--stzh-space-large));--padding-bottom:var(--stzh-section-padding-bottom, var(--stzh-space-large));--margin-top:var(--stzh-section-margin-top, 0px);--margin-bottom:var(--stzh-section-margin-bottom, 0px);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom)}@media screen and (min-width: 600px){:host{--padding-bottom:var(--stzh-section-padding-bottom, var(--stzh-space-xlarge))}}@media screen and (min-width: 1260px){:host{--padding-bottom:var(--stzh-section-padding-bottom, var(--stzh-space-xxxlarge))}}:host ::slotted(stzh-heading){margin-top:var(--stzh-space-xsmall);margin-bottom:var(--stzh-space-small)}@media screen and (min-width: 900px){:host ::slotted(stzh-heading){margin-top:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host ::slotted(stzh-heading){margin-top:var(--stzh-space-medium)}}@media screen and (min-width: 900px){:host ::slotted(stzh-heading){margin-bottom:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host ::slotted(stzh-heading){margin-bottom:var(--stzh-space-large)}}:host(:where([breakout]:not([breakout=\"default\"]))){position:relative;left:50%;right:50%;margin-left:calc(-50vw + var(--stzh-scrollbar-width) / 2);margin-right:calc(-50vw + var(--stzh-scrollbar-width) / 2);width:calc(100vw - var(--stzh-scrollbar-width));max-width:calc(100vw - var(--stzh-scrollbar-width))}:host(:where([background]:not([background=\"default\"]))){--padding-bottom:var(--stzh-section-background-padding-bottom, var(--stzh-space-xlarge));--margin-top:var(--stzh-section-background-margin-top, var(--stzh-space-medium));--margin-bottom:var(--stzh-section-background-margin-bottom, var(--stzh-space-medium))}@media screen and (min-width: 600px){:host(:where([background]:not([background=\"default\"]))){--padding-bottom:var(--stzh-section-background-padding-bottom, var(--stzh-space-xxlarge))}}@media screen and (min-width: 1260px){:host(:where([background]:not([background=\"default\"]))){--padding-bottom:var(--stzh-section-background-padding-bottom, var(--stzh-space-xxxxlarge));--margin-top:var(--stzh-section-background-margin-top, var(--stzh-space-xxlarge));--margin-bottom:var(--stzh-section-background-margin-bottom, var(--stzh-space-xxlarge))}}:host([background=secondary]){--background-color:var(--stzh-color-secondary20)}:host([background=primary]){--background-color:var(--stzh-color-primary70)}:host([variant=highlight]){--padding-left:var(--stzh-space-small);--padding-right:var(--stzh-space-small);--padding-top:var(--stzh-space-xlarge);--padding-bottom:var(--stzh-space-xlarge);--color:var(--stzh-section-highlight-color);--background-color:var(--stzh-section-highlight-background-color);--heading-background-color:var(--stzh-color-secondary40);--stzh-section-padding-top:0px;--stzh-section-padding-bottom:0px;--stzh-section-margin-top:0px;--stzh-section-margin-bottom:0px}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-left:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-right:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-top:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){:host([variant=highlight]){--padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([variant=highlight]){--padding-bottom:var(--stzh-space-xxxlarge)}}:host([variant=contextbox]){--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--padding-top:var(--stzh-space-medium);--padding-bottom:var(--stzh-space-medium);--color:var(--stzh-section-highlight-color);--background-color:var(--stzh-section-highlight-background-color);--heading-background-color:var(--stzh-color-secondary40);--stzh-section-padding-top:0px;--stzh-section-padding-bottom:0px;--stzh-section-margin-top:0px;--stzh-section-margin-bottom:0px}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=contextbox]){--padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=contextbox]){--padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=contextbox]){--padding-bottom:var(--stzh-space-xxlarge)}}:host([variant=contextbox]):last-child{margin-bottom:0}:host([variant=greybox]){--background-color:var(--stzh-color-grey10);--padding-left:var(--stzh-space-xxlarge);--padding-right:var(--stzh-space-xxlarge);--padding-top:var(--stzh-space-medium);--padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 900px){:host([variant=greybox]){--padding-left:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([variant=greybox]){--padding-left:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([variant=greybox]){--padding-right:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([variant=greybox]){--padding-right:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){:host([variant=greybox]){--padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=greybox]){--padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=greybox]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=greybox]){--padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=greybox]){--padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=greybox]){--padding-bottom:var(--stzh-space-xxlarge)}}:host([variant=greybox]):last-child{margin-bottom:0}:host([variant=poimax]){--background-color:var(--stzh-color-grey10);--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--padding-top:var(--stzh-space-medium);--padding-bottom:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([variant=poimax]){--padding-left:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=poimax]){--padding-left:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=poimax]){--padding-left:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=poimax]){--padding-right:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=poimax]){--padding-right:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=poimax]){--padding-right:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=poimax]){--padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=poimax]){--padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=poimax]){--padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([variant=poimax]){--padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([variant=poimax]){--padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([variant=poimax]){--padding-bottom:var(--stzh-space-xxlarge)}}:host([variant=poimax]):last-child{margin-bottom:0}:host([margin-top=none]){--margin-top:0px}:host([margin-bottom=none]){--margin-bottom:0px}:host([padding-bottom=none]){--padding-bottom:0px}.stzh-section{background-color:var(--background-color)}.stzh-section__heading{display:flex;flex-direction:column;background-color:var(--heading-background-color);padding-left:var(--padding-left);padding-right:var(--padding-right)}.stzh-section__wrapper{padding-left:var(--padding-left);padding-right:var(--padding-right);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);--stzh-base-color:var(--color)}.stzh-section--is-breakout .stzh-section__outer{margin-left:1.25rem;margin-right:1.25rem}@media screen and (min-width: 600px){.stzh-section--is-breakout .stzh-section__outer{margin-left:2rem;margin-right:2rem}}@media screen and (min-width: 900px){.stzh-section--is-breakout .stzh-section__outer{margin-left:2.5rem;margin-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-section--is-breakout .stzh-section__outer{margin-left:4rem;margin-right:4rem}}@media screen and (min-width: 1600px){.stzh-section--is-breakout .stzh-section__outer{margin-left:auto;margin-right:auto;max-width:84.25rem}}";
 
 const StzhSection = class {
   constructor(hostRef) {