@oiz/stzh-components 3.0.0 → 3.1.0

package/dist/esm/stzh-heading.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, a as Host } from './index-e3050b18.js';
 
-const stzhHeadingCss = ".sc-stzh-heading-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-heading-h{display:none}.sc-stzh-heading-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-heading-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-heading-h *.sc-stzh-heading,.sc-stzh-heading-h *.sc-stzh-heading::before,.sc-stzh-heading-h *.sc-stzh-heading::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-heading-h .has-focus.sc-stzh-heading{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-heading-h .stzh-fylingfocus-focused.sc-stzh-heading{outline-style:none !important}.sc-stzh-heading-h .stzh-fylingfocus-focused.sc-stzh-heading::-moz-focus-inner{border:0 !important}.sc-stzh-heading-h{width:100%;--color:var(--stzh-heading-color);color:var(--color)}.sc-stzh-heading-h .sc-stzh-heading-s>a,.sc-stzh-heading-h .sc-stzh-heading-s a{color:var(--stzh-link-color);transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);text-underline-offset:var(--stzh-link-text-underline-offset);-webkit-text-decoration-line:var(--stzh-link-text-decoration-line);text-decoration-line:var(--stzh-link-text-decoration-line);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-heading-h .sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s a:hover{color:var(--stzh-link-hover-color);-webkit-text-decoration-line:var(--stzh-link-hover-text-decoration-line);text-decoration-line:var(--stzh-link-hover-text-decoration-line)}.sc-stzh-heading-h .sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s a:hover{color:var(--stzh-link-hover-color)}.stzh-heading.sc-stzh-heading{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing);color:var(--color);margin:0}@media screen and (min-width: 600px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-large-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-large-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-large-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 900px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}.stzh-heading--curve-caption.sc-stzh-heading{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-heading-line-height, var(--stzh-font-nano-heading-line-height));letter-spacing:var(--stzh-font-curve-caption-default-heading-letter-spacing, var(--stzh-font-nano-heading-letter-spacing))}@media screen and (min-width: 900px){.stzh-heading--curve-caption.sc-stzh-heading{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-heading-line-height, var(--stzh-font-micro-heading-line-height));letter-spacing:var(--stzh-font-curve-caption-medium-heading-letter-spacing, var(--stzh-font-micro-heading-letter-spacing))}}.stzh-heading--curve-lead.sc-stzh-heading{font-size:var(--stzh-font-curve-lead-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-lead-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-lead-default-heading-letter-spacing)}@media screen and (min-width: 1260px){.stzh-heading--curve-lead.sc-stzh-heading{font-size:var(--stzh-font-curve-lead-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-lead-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-lead-large-heading-letter-spacing)}}.stzh-heading--curve-p2.sc-stzh-heading{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-heading-line-height, var(--stzh-font-micro-heading-line-height));letter-spacing:var(--stzh-font-curve-p2-default-heading-letter-spacing, var(--stzh-font-micro-heading-letter-spacing))}@media screen and (min-width: 900px){.stzh-heading--curve-p2.sc-stzh-heading{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-heading-letter-spacing)}}.stzh-heading--curve-p1.sc-stzh-heading{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-p1-default-heading-letter-spacing)}@media screen and (min-width: 900px){.stzh-heading--curve-p1.sc-stzh-heading{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-heading-letter-spacing)}}.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 900px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-large-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-large-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-large-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-default-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-hero-default-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-hero-default-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-small-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-hero-small-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-hero-small-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-large-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-hero-large-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-hero-large-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-ultra-font-size, var(--stzh-font-hero-font-size));line-height:var(--stzh-font-curve-hero-ultra-heading-line-height, var(--stzh-font-hero-text-line-height));letter-spacing:var(--stzh-font-curve-hero-ultra-heading-letter-spacing, var(--stzh-font-hero-text-letter-spacing))}}";
+const stzhHeadingCss = ".sc-stzh-heading-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-heading-h{display:none}.sc-stzh-heading-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-heading-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-heading-h *.sc-stzh-heading,.sc-stzh-heading-h *.sc-stzh-heading::before,.sc-stzh-heading-h *.sc-stzh-heading::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-heading-h .has-focus.sc-stzh-heading{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-heading-h .stzh-fylingfocus-focused.sc-stzh-heading{outline-style:none !important}.sc-stzh-heading-h .stzh-fylingfocus-focused.sc-stzh-heading::-moz-focus-inner{border:0 !important}.sc-stzh-heading-h{width:100%;--color:var(--stzh-heading-color);color:var(--color)}.sc-stzh-heading-h .sc-stzh-heading-s>a,.sc-stzh-heading-h .sc-stzh-heading-s a{color:var(--stzh-link-color);transition:color var(--stzh-base-transition-animation-speed);border-radius:var(--stzh-button-border-radius);text-underline-offset:var(--stzh-link-text-underline-offset);-webkit-text-decoration-line:var(--stzh-link-text-decoration-line);text-decoration-line:var(--stzh-link-text-decoration-line);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-heading-h .sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s a:hover{color:var(--stzh-link-hover-color);-webkit-text-decoration-line:var(--stzh-link-hover-text-decoration-line);text-decoration-line:var(--stzh-link-hover-text-decoration-line)}.sc-stzh-heading-h .sc-stzh-heading-s>a:hover,.sc-stzh-heading-h .sc-stzh-heading-s a:hover{color:var(--stzh-link-hover-color)}.stzh-heading.sc-stzh-heading{font-family:var(--stzh-font-family-title);font-weight:var(--stzh-font-weight-title);font-style:var(--stzh-font-style-title);font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing);color:var(--color);margin:0}@media screen and (min-width: 600px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-large-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-large-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-large-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 900px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--level-3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-heading--level-4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}.stzh-heading--curve-caption.sc-stzh-heading{font-size:var(--stzh-font-curve-caption-default-font-size, var(--stzh-font-nano-font-size));line-height:var(--stzh-font-curve-caption-default-heading-line-height, var(--stzh-font-nano-heading-line-height));letter-spacing:var(--stzh-font-curve-caption-default-heading-letter-spacing, var(--stzh-font-nano-heading-letter-spacing))}@media screen and (min-width: 900px){.stzh-heading--curve-caption.sc-stzh-heading{font-size:var(--stzh-font-curve-caption-medium-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-caption-medium-heading-line-height, var(--stzh-font-micro-heading-line-height));letter-spacing:var(--stzh-font-curve-caption-medium-heading-letter-spacing, var(--stzh-font-micro-heading-letter-spacing))}}.stzh-heading--curve-lead.sc-stzh-heading{font-size:var(--stzh-font-curve-lead-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-lead-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-lead-default-heading-letter-spacing)}@media screen and (min-width: 1260px){.stzh-heading--curve-lead.sc-stzh-heading{font-size:var(--stzh-font-curve-lead-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-lead-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-lead-large-heading-letter-spacing)}}.stzh-heading--curve-p2.sc-stzh-heading{font-size:var(--stzh-font-curve-p2-default-font-size, var(--stzh-font-micro-font-size));line-height:var(--stzh-font-curve-p2-default-heading-line-height, var(--stzh-font-micro-heading-line-height));letter-spacing:var(--stzh-font-curve-p2-default-heading-letter-spacing, var(--stzh-font-micro-heading-letter-spacing))}@media screen and (min-width: 900px){.stzh-heading--curve-p2.sc-stzh-heading{font-size:var(--stzh-font-curve-p2-medium-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p2-medium-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-p2-medium-heading-letter-spacing)}}.stzh-heading--curve-p1.sc-stzh-heading{font-size:var(--stzh-font-curve-p1-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-p1-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-p1-default-heading-letter-spacing)}@media screen and (min-width: 900px){.stzh-heading--curve-p1.sc-stzh-heading{font-size:var(--stzh-font-curve-p1-medium-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-p1-medium-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-p1-medium-heading-letter-spacing)}}.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-default-font-size, var(--stzh-font-milli-font-size));line-height:var(--stzh-font-curve-h4-default-heading-line-height, var(--stzh-font-milli-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-small-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h4-small-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-small-heading-letter-spacing)}}@media screen and (min-width: 1260px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-large-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h4-large-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h4-large-heading-letter-spacing)}}@media screen and (min-width: 1600px){.stzh-heading--curve-h4.sc-stzh-heading{font-size:var(--stzh-font-curve-h4-ultra-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h4-ultra-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h4-ultra-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-default-font-size, var(--stzh-font-centi-font-size));line-height:var(--stzh-font-curve-h3-default-heading-line-height, var(--stzh-font-centi-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-small-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h3-small-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h3-small-heading-letter-spacing)}}@media screen and (min-width: 900px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-medium-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h3-medium-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h3-medium-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h3.sc-stzh-heading{font-size:var(--stzh-font-curve-h3-ultra-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h3-ultra-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h3-ultra-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-default-font-size, var(--stzh-font-deci-font-size));line-height:var(--stzh-font-curve-h2-default-heading-line-height, var(--stzh-font-deci-heading-line-height));letter-spacing:var(--stzh-font-curve-h2-default-heading-letter-spacing)}@media screen and (min-width: 600px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-small-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h2-small-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h2-small-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-medium-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h2-medium-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h2-medium-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h2.sc-stzh-heading{font-size:var(--stzh-font-curve-h2-ultra-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h2-ultra-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h2-ultra-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-default-font-size, var(--stzh-font-deca-font-size));line-height:var(--stzh-font-curve-h1-default-heading-line-height, var(--stzh-font-deca-text-line-height));letter-spacing:var(--stzh-font-curve-h1-default-heading-letter-spacing, var(--stzh-font-deca-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-small-font-size, var(--stzh-font-hecto-font-size));line-height:var(--stzh-font-curve-h1-small-heading-line-height, var(--stzh-font-hecto-text-line-height));letter-spacing:var(--stzh-font-curve-h1-small-heading-letter-spacing, var(--stzh-font-hecto-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-medium-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-h1-medium-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-h1-medium-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-large-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1-large-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1-large-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h1.sc-stzh-heading{font-size:var(--stzh-font-curve-h1-ultra-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1-ultra-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1-ultra-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-default-font-size, var(--stzh-font-kilo-font-size));line-height:var(--stzh-font-curve-hero-default-heading-line-height, var(--stzh-font-kilo-text-line-height));letter-spacing:var(--stzh-font-curve-hero-default-heading-letter-spacing, var(--stzh-font-kilo-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-small-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-hero-small-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-hero-small-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-large-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-hero-large-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-hero-large-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-hero.sc-stzh-heading{font-size:var(--stzh-font-curve-hero-ultra-font-size, var(--stzh-font-hero-font-size));line-height:var(--stzh-font-curve-hero-ultra-heading-line-height, var(--stzh-font-hero-text-line-height));letter-spacing:var(--stzh-font-curve-hero-ultra-heading-letter-spacing, var(--stzh-font-hero-text-letter-spacing))}}.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-default-font-size, var(--stzh-font-mega-font-size));line-height:var(--stzh-font-curve-h1home-default-heading-line-height, var(--stzh-font-mega-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-default-heading-letter-spacing, var(--stzh-font-mega-text-letter-spacing))}@media screen and (min-width: 600px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-small-font-size, var(--stzh-font-giga-font-size));line-height:var(--stzh-font-curve-h1home-small-heading-line-height, var(--stzh-font-giga-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-small-heading-letter-spacing, var(--stzh-font-giga-text-letter-spacing))}}@media screen and (min-width: 900px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-medium-font-size, var(--stzh-font-peta-font-size));line-height:var(--stzh-font-curve-h1home-medium-heading-line-height, var(--stzh-font-peta-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-medium-heading-letter-spacing, var(--stzh-font-peta-text-letter-spacing))}}@media screen and (min-width: 1260px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-large-font-size, var(--stzh-font-exa-font-size));line-height:var(--stzh-font-curve-h1home-large-heading-line-height, var(--stzh-font-exa-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-large-heading-letter-spacing, var(--stzh-font-exa-text-letter-spacing))}}@media screen and (min-width: 1600px){.stzh-heading--curve-h1home.sc-stzh-heading{font-size:var(--stzh-font-curve-h1home-ultra-font-size, var(--stzh-font-zetta-font-size));line-height:var(--stzh-font-curve-h1home-ultra-heading-line-height, var(--stzh-font-zetta-text-line-height));letter-spacing:var(--stzh-font-curve-h1home-ultra-heading-letter-spacing, var(--stzh-font-zetta-text-letter-spacing))}}";
 
 const StzhHeading = class {
   constructor(hostRef) {

package/dist/esm/stzh-heading.entry.js.map

@@ -1 +1 @@
-{"file":"stzh-heading.entry.js","mappings":";;AAAA,MAAM,cAAc,GAAG,+9nBAA+9nB;;MCiBz+nB,WAAW;;;iBAEkC,GAAG;iBAGJ,MAAM;;EAE7D,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;IACjC,MAAM,OAAO,GAAG;MACd,cAAc,EAAE,IAAI;MACpB,CAAC,uBAAuB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;MACnD,CAAC,uBAAuB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;KACpD,CAAC;IAEF,QACE,EAAC,IAAI,QACH,EAAC,OAAO,IAAC,KAAK,EAAE,OAAO,IACrB,eAAa,CACL,CACL,EACP;GACH;;;;;;","names":[],"sources":["src/components/stzh-heading/stzh-heading.scss?tag=stzh-heading&encapsulation=scoped","src/components/stzh-heading/stzh-heading.tsx"],"sourcesContent":["/**\n * @prop --color: Color of heading\n *\n * @prop --stzh-heading-color: **Global**: Color of heading\n */\n\n:host {\n  width: 100%;\n\n  --color: #{$headingColor};\n  color: var(--color);\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  // &[level=\"4\"],\n  // &[curve=\"h4\"] {\n  //   --color: #{$baseColor};\n  // }\n}\n\n.stzh-heading {\n  @include font('title');\n  @include fontCurve('h2', 'heading'); // default\n  color: var(--color);\n  margin: 0;\n\n  @for $i from 1 through 4 {\n    &--level-#{$i} {\n      @include fontCurve('h'+$i, 'heading');\n    }\n  }\n\n  @each $fontCurveName, $config in $fontCurves {\n    &--curve-#{$fontCurveName} {\n      @include fontCurve($fontCurveName, 'heading');\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 - Text content\n */\n@Component({\n  tag: \"stzh-heading\",\n  styleUrl: \"stzh-heading.scss\",\n  scoped: true\n})\nexport class StzhHeading {\n  /** Heading level */\n  @Prop({ reflect: true }) level: \"1\" | \"2\" | \"3\" | \"4\" = \"2\";\n\n  /** Type of curve to overwrite the curve inherited from `level` attribute (see [Spacings docs page](/docs/tokens-typography--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Font.Curves | \"auto\" = \"auto\";\n\n  render() {\n    const Heading = `h${this.level}`;\n    const classes = {\n      \"stzh-heading\": true,\n      [`stzh-heading--level-${this.level}`]: !!this.level,\n      [`stzh-heading--curve-${this.curve}`]: !!this.curve\n    };\n\n    return (\n      <Host>\n        <Heading class={classes}>\n          <slot></slot>\n        </Heading>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-heading.entry.js","mappings":";;AAAA,MAAM,cAAc,GAAG,g4rBAAg4rB;;MCiB14rB,WAAW;;;iBAEkC,GAAG;iBAGJ,MAAM;;EAE7D,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;IACjC,MAAM,OAAO,GAAG;MACd,cAAc,EAAE,IAAI;MACpB,CAAC,uBAAuB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;MACnD,CAAC,uBAAuB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;KACpD,CAAC;IAEF,QACE,EAAC,IAAI,QACH,EAAC,OAAO,IAAC,KAAK,EAAE,OAAO,IACrB,eAAa,CACL,CACL,EACP;GACH;;;;;;","names":[],"sources":["src/components/stzh-heading/stzh-heading.scss?tag=stzh-heading&encapsulation=scoped","src/components/stzh-heading/stzh-heading.tsx"],"sourcesContent":["/**\n * @prop --color: Color of heading\n *\n * @prop --stzh-heading-color: **Global**: Color of heading\n */\n\n:host {\n  width: 100%;\n\n  --color: #{$headingColor};\n  color: var(--color);\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  // &[level=\"4\"],\n  // &[curve=\"h4\"] {\n  //   --color: #{$baseColor};\n  // }\n}\n\n.stzh-heading {\n  @include font('title');\n  @include fontCurve('h2', 'heading'); // default\n  color: var(--color);\n  margin: 0;\n\n  @for $i from 1 through 4 {\n    &--level-#{$i} {\n      @include fontCurve('h'+$i, 'heading');\n    }\n  }\n\n  @each $fontCurveName, $config in $fontCurves {\n    &--curve-#{$fontCurveName} {\n      @include fontCurve($fontCurveName, 'heading');\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 - Text content\n */\n@Component({\n  tag: \"stzh-heading\",\n  styleUrl: \"stzh-heading.scss\",\n  scoped: true\n})\nexport class StzhHeading {\n  /** Heading level */\n  @Prop({ reflect: true }) level: \"1\" | \"2\" | \"3\" | \"4\" = \"2\";\n\n  /** Type of curve to overwrite the curve inherited from `level` attribute (see [Spacings docs page](/docs/tokens-typography--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Font.Curves | \"auto\" = \"auto\";\n\n  render() {\n    const Heading = `h${this.level}`;\n    const classes = {\n      \"stzh-heading\": true,\n      [`stzh-heading--level-${this.level}`]: !!this.level,\n      [`stzh-heading--curve-${this.curve}`]: !!this.curve\n    };\n\n    return (\n      <Host>\n        <Heading class={classes}>\n          <slot></slot>\n        </Heading>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/stzh-homepage-service-highlights.entry.js

@@ -0,0 +1,98 @@
+import { r as registerInstance, h, F as Fragment, a as Host, g as getElement } from './index-e3050b18.js';
+
+const stzhHomepageServiceHighlightsCss = ".sc-stzh-homepage-service-highlights-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-homepage-service-highlights-h{display:none}.sc-stzh-homepage-service-highlights-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-homepage-service-highlights-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-homepage-service-highlights-h *.sc-stzh-homepage-service-highlights,.sc-stzh-homepage-service-highlights-h *.sc-stzh-homepage-service-highlights::before,.sc-stzh-homepage-service-highlights-h *.sc-stzh-homepage-service-highlights::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-homepage-service-highlights-h .has-focus.sc-stzh-homepage-service-highlights{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-homepage-service-highlights-h .stzh-fylingfocus-focused.sc-stzh-homepage-service-highlights{outline-style:none !important}.sc-stzh-homepage-service-highlights-h .stzh-fylingfocus-focused.sc-stzh-homepage-service-highlights::-moz-focus-inner{border:0 !important}.sc-stzh-homepage-service-highlights-h{--background-color-topnews:var(--stzh-topnews-background-color);--background-color-mostsearched:var(--stzh-mostsearched-background-color)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights{display:grid}.stzh-homepage-service-highlights__topnews.sc-stzh-homepage-service-highlights,.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{display:flex;flex-direction:column}@media screen and (min-width: 900px){.stzh-homepage-service-highlights--has-topnews.sc-stzh-homepage-service-highlights{grid-template-columns:repeat(2, minmax(0, 1fr))}}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-medium);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-large);padding-right:var(--stzh-space-large);flex-grow:1;display:flex;flex-direction:column;justify-content:center}@media screen and (min-width: 600px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.sc-stzh-homepage-service-highlights{padding-left:calc(((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2))}}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item--has-link.sc-stzh-homepage-service-highlights{transition:background-color 150ms ease;text-decoration:none}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item--has-link.sc-stzh-homepage-service-highlights:hover{background-color:var(--stzh-color-secondary40)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item--highlighted.sc-stzh-homepage-service-highlights{background-color:var(--stzh-color-lemonyellow50)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item--highlighted.stzh-topnews-item--has-link.sc-stzh-homepage-service-highlights:hover{background-color:var(--stzh-color-lemonyellow60)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item__subtitle.sc-stzh-homepage-service-highlights{--color:var(--stzh-color-primary70)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item--highlighted.sc-stzh-homepage-service-highlights .stzh-topnews-item__subtitle.sc-stzh-homepage-service-highlights{--color:var(--stzh-color-secondary60)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item.stzh-topnews-item--has-link.sc-stzh-homepage-service-highlights:not(.stzh-topnews-item--highlighted):hover .stzh-topnews-item__label.sc-stzh-homepage-service-highlights{--color:var(--stzh-color-primary80)}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-topnews-item--highlighted.sc-stzh-homepage-service-highlights:hover .stzh-topnews-item__subtitle.sc-stzh-homepage-service-highlights{--color:var(--stzh-color-primary70)}.stzh-homepage-service-highlights__topnews.sc-stzh-homepage-service-highlights{background-color:var(--background-color-topnews)}.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{background-color:var(--background-color-mostsearched);padding-top:var(--stzh-space-medium);padding-right:var(--stzh-space-large);padding-bottom:var(--stzh-space-medium);padding-left:var(--stzh-space-large)}@media screen and (min-width: 600px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-large)}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights:not(.stzh-homepage-service-highlights--has-topnews) .stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{display:grid;gap:0 var(--stzh-space-large);grid-template-columns:repeat(2, minmax(0, 1fr));padding-left:2.5rem;padding-right:2.5rem}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights:not(.stzh-homepage-service-highlights--has-topnews) .stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-left:4rem;padding-right:4rem}}@media screen and (min-width: 1600px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights:not(.stzh-homepage-service-highlights--has-topnews) .stzh-homepage-service-highlights__mostsearched.sc-stzh-homepage-service-highlights{padding-left:calc(((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2));padding-right:calc(((100vw - 84.25rem - var(--stzh-scrollbar-width, 0px)) / 2))}}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-xsmall);padding-bottom:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item.sc-stzh-homepage-service-highlights{padding-top:var(--stzh-space-medium)}}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-small)}}@media screen and (min-width: 1260px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item.sc-stzh-homepage-service-highlights{padding-bottom:var(--stzh-space-medium)}}.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item__link.sc-stzh-homepage-service-highlights{--text-decoration-line:none;--hover-text-decoration-line:none;--hover-color:$linkColor;transition:transform 150ms ease}@media screen and (min-width: 900px){.stzh-homepage-service-highlights.sc-stzh-homepage-service-highlights .stzh-mostsearched-item__link.sc-stzh-homepage-service-highlights:hover{transform:translateX(1.25rem)}}";
+
+const StzhHomepageServiceHighlights = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this._topnewsItems = [];
+    this._mostsearchedItems = [];
+    this.init = () => {
+      this.topnewsItemsWatcher(this.topnewsItems);
+      this.mostsearchedItemsWatcher(this.mostsearchedItems);
+    };
+    this.topnewsItems = [];
+    this.mostsearchedItems = [];
+  }
+  topnewsItemsWatcher(newValue) {
+    if (!newValue) {
+      this._topnewsItems = [];
+    }
+    else if (typeof newValue === "string") {
+      try {
+        const parsed = JSON.parse(newValue);
+        this._topnewsItems = this.ensureSingleHighlight(parsed);
+      }
+      catch (e) {
+        this._topnewsItems = [];
+      }
+    }
+    else {
+      this._topnewsItems = this.ensureSingleHighlight(newValue);
+    }
+  }
+  mostsearchedItemsWatcher(newValue) {
+    if (!newValue) {
+      this._mostsearchedItems = [];
+    }
+    else if (typeof newValue === "string") {
+      try {
+        this._mostsearchedItems = JSON.parse(newValue);
+      }
+      catch (e) {
+        this._mostsearchedItems = [];
+      }
+    }
+    else {
+      this._mostsearchedItems = newValue;
+    }
+  }
+  ensureSingleHighlight(items) {
+    let foundHighlighted = false;
+    return items.map(item => {
+      if (item.isHighlighted) {
+        if (!foundHighlighted) {
+          foundHighlighted = true;
+          return item;
+        }
+        else {
+          // Remove highlight from subsequent items
+          return Object.assign(Object.assign({}, item), { isHighlighted: false });
+        }
+      }
+      return item;
+    });
+  }
+  connectedCallback() {
+    this.init();
+  }
+  renderTopnewsItemInner(item) {
+    return (h(Fragment, null, !!item.subtitle && h("stzh-text", { class: "stzh-topnews-item__subtitle" }, item.subtitle), h("stzh-heading", { class: "stzh-topnews-item__label" }, item.label)));
+  }
+  render() {
+    const classes = {
+      "stzh-homepage-service-highlights": true,
+      "stzh-homepage-service-highlights--has-topnews": this._topnewsItems.length > 0,
+    };
+    return (h(Host, null, h("div", { class: classes }, this._topnewsItems.length > 0 && (h("div", { class: "stzh-homepage-service-highlights__topnews" }, this._topnewsItems.map(item => !!item.href ? (h("a", { href: item.href, class: {
+        "stzh-topnews-item": true,
+        "stzh-topnews-item--highlighted": item.isHighlighted,
+        "stzh-topnews-item--has-link": true,
+      } }, this.renderTopnewsItemInner(item))) : (h("div", { class: {
+        "stzh-topnews-item": true,
+        "stzh-topnews-item--highlighted": item.isHighlighted,
+      } }, this.renderTopnewsItemInner(item)))))), this._mostsearchedItems.length > 0 && (h("div", { class: "stzh-homepage-service-highlights__mostsearched" }, this._mostsearchedItems.map(item => (h("div", { class: {
+        "stzh-mostsearched-item": true,
+      } }, h("stzh-link", { class: "stzh-mostsearched-item__link", href: item.href, icon: "arrow-right" }, item.label)))))))));
+  }
+  get element() { return getElement(this); }
+  static get watchers() { return {
+    "topnewsItems": ["topnewsItemsWatcher"],
+    "mostsearchedItems": ["mostsearchedItemsWatcher"]
+  }; }
+};
+StzhHomepageServiceHighlights.style = stzhHomepageServiceHighlightsCss;
+
+export { StzhHomepageServiceHighlights as stzh_homepage_service_highlights };
+
+//# sourceMappingURL=stzh-homepage-service-highlights.entry.js.map

package/dist/esm/stzh-homepage-service-highlights.entry.js.map

@@ -0,0 +1 @@
+{"file":"stzh-homepage-service-highlights.entry.js","mappings":";;AAAA,MAAM,gCAAgC,GAAG,+1UAA+1U;;MCQ33U,6BAA6B;;;IAKhC,kBAAa,GAAsB,EAAE,CAAC;IAItC,uBAAkB,GAA2B,EAAE,CAAC;IAkDhD,SAAI,GAAG;MACb,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;MAC5C,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;KACvD,CAAC;wBA1DiD,EAAE;6BAIQ,EAAE;;EAI/D,mBAAmB,CAAC,QAAoC;IACtD,IAAI,CAAC,QAAQ,EAAE;MACb,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;KACzB;SAAM,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MACvC,IAAI;QACF,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACpC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,qBAAqB,CAAC,MAAM,CAAC,CAAC;OACzD;MAAC,OAAO,CAAC,EAAE;QACV,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;OACzB;KACF;SAAM;MACL,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,CAAC;KAC3D;GACF;EAGD,wBAAwB,CAAC,QAAyC;IAChE,IAAI,CAAC,QAAQ,EAAE;MACb,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC;KAC9B;SAAM,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE;MACvC,IAAI;QACF,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;OAChD;MAAC,OAAO,CAAC,EAAE;QACV,IAAI,CAAC,kBAAkB,GAAG,EAAE,CAAC;OAC9B;KACF;SAAM;MACL,IAAI,CAAC,kBAAkB,GAAG,QAAQ,CAAC;KACpC;GACF;EAEO,qBAAqB,CAAC,KAAwB;IACpD,IAAI,gBAAgB,GAAG,KAAK,CAAC;IAE7B,OAAO,KAAK,CAAC,GAAG,CAAC,IAAI;MACnB,IAAI,IAAI,CAAC,aAAa,EAAE;QACtB,IAAI,CAAC,gBAAgB,EAAE;UACrB,gBAAgB,GAAG,IAAI,CAAC;UACxB,OAAO,IAAI,CAAC;SACb;aAAM;;UAEL,uCAAY,IAAI,KAAE,aAAa,EAAE,KAAK,IAAG;SAC1C;OACF;MACD,OAAO,IAAI,CAAC;KACb,CAAC,CAAC;GACJ;EAOD,iBAAiB;IACf,IAAI,CAAC,IAAI,EAAE,CAAC;GACb;EAEO,sBAAsB,CAAC,IAAqB;IAClD,QACE,EAAC,QAAQ,QACN,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,iBAAW,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,QAAQ,CAAa,EAC9F,oBAAc,KAAK,EAAC,0BAA0B,IAAE,IAAI,CAAC,KAAK,CAAgB,CACjE,EACX;GACH;EAED,MAAM;IACJ,MAAM,OAAO,GAAG;MACd,kCAAkC,EAAE,IAAI;MACxC,+CAA+C,EAAE,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC;KAC/E,CAAC;IAEF,QACE,EAAC,IAAI,QACH,WAAK,KAAK,EAAE,OAAO,IAChB,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,KAC5B,WAAK,KAAK,EAAC,2CAA2C,IACnD,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,IAC1B,CAAC,CAAC,IAAI,CAAC,IAAI,IACT,SACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE;QACL,mBAAmB,EAAE,IAAI;QACzB,gCAAgC,EAAE,IAAI,CAAC,aAAa;QACpD,6BAA6B,EAAE,IAAI;OACpC,IAEA,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,CAChC,KAEJ,WACE,KAAK,EAAE;QACL,mBAAmB,EAAE,IAAI;QACzB,gCAAgC,EAAE,IAAI,CAAC,aAAa;OACrD,IAEA,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,CAC9B,CACP,CACF,CACG,CACP,EACA,IAAI,CAAC,kBAAkB,CAAC,MAAM,GAAG,CAAC,KACjC,WAAK,KAAK,EAAC,gDAAgD,IACxD,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,IAAI,KAC/B,WACE,KAAK,EAAE;QACL,wBAAwB,EAAE,IAAI;OAC/B,IAED,iBAAW,KAAK,EAAC,8BAA8B,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,aAAa,IACjF,IAAI,CAAC,KAAK,CACD,CACR,CACP,CAAC,CACE,CACP,CACG,CACD,EACP;GACH;;;;;;;;;;;","names":[],"sources":["src/components/stzh-homepage-service-highlights/stzh-homepage-service-highlights.scss?tag=stzh-homepage-service-highlights&encapsulation=scoped","src/components/stzh-homepage-service-highlights/stzh-homepage-service-highlights.tsx"],"sourcesContent":["/**\n * @prop --background-color-topnews: Background color of top news section\n * @prop --background-color-mostsearched: Background color of top most searched section\n */\n\n:host {\n  --background-color-topnews: #{$topnewsBackgroundColor};\n  --background-color-mostsearched: #{$mostsearchedBackgroundColor};\n}\n\n.stzh-homepage-service-highlights {\n  display: grid;\n\n  &__topnews,\n  &__mostsearched {\n    display: flex;\n    flex-direction: column;\n  }\n\n  &--has-topnews {\n    @include mq($from: medium) {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n    }\n  }\n\n  /**\n   * Top news.\n   */\n\n  .stzh-topnews-item {\n    @include spaceCurve('padding-top', 'regular');\n    @include spaceCurve('padding-bottom', 'regular');\n    padding-left: space('large');\n    padding-right: space('large');\n    flex-grow: 1;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n\n    @include mq($from: small) {\n      padding-left: $containerMarginSmall;\n      padding-right: $containerMarginSmall;\n    }\n\n    @include mq($from: medium) {\n      padding-left: $containerMarginMedium;\n      padding-right: $containerMarginMedium;\n    }\n\n    @include mq($from: large) {\n      padding-left: $containerMarginLarge;\n      padding-right: $containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      padding-left: calc(((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2));\n    }\n  }\n\n  .stzh-topnews-item--has-link {\n    transition: background-color 150ms ease;\n    text-decoration: none;\n\n    &:hover {\n      background-color: var(--stzh-color-secondary40);\n    }\n  }\n\n  .stzh-topnews-item--highlighted {\n    background-color: var(--stzh-color-lemonyellow50);\n  }\n\n  .stzh-topnews-item--highlighted.stzh-topnews-item--has-link {\n    &:hover {\n      background-color: var(--stzh-color-lemonyellow60);\n    }\n  }\n\n  .stzh-topnews-item__subtitle {\n    --color: var(--stzh-color-primary70);\n  }\n\n  .stzh-topnews-item--highlighted .stzh-topnews-item__subtitle {\n    --color: var(--stzh-color-secondary60);\n  }\n\n  .stzh-topnews-item.stzh-topnews-item--has-link:not(.stzh-topnews-item--highlighted):hover .stzh-topnews-item__label {\n    --color: var(--stzh-color-primary80);\n  }\n\n  .stzh-topnews-item--highlighted:hover .stzh-topnews-item__subtitle {\n    --color: var(--stzh-color-primary70);\n  }\n\n  &__topnews {\n    background-color: var(--background-color-topnews);\n  }\n\n  /**\n   * Most searched.\n   */\n  &__mostsearched {\n    background-color: var(--background-color-mostsearched);\n    @include spaceCurve('padding-top', 'regular');\n    padding-right: space('large');\n    @include spaceCurve('padding-bottom', 'regular');\n    padding-left: space('large');\n\n    @include mq($from: small) {\n      padding-left: $containerMarginSmall;\n      padding-right: $containerMarginSmall;\n    }\n\n    @include mq($from: medium) {\n      padding-left: $containerMarginMedium;\n      padding-right: $containerMarginMedium;\n    }\n  }\n\n  &:not(&--has-topnews) &__mostsearched {\n    @include mq($from: medium) {\n      display: grid;\n      gap: 0 space('large');\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      padding-left: $containerMarginMedium;\n      padding-right: $containerMarginMedium;\n    }\n\n    @include mq($from: large) {\n      padding-left: $containerMarginLarge;\n      padding-right: $containerMarginLarge;\n    }\n\n    @include mq($from: ultra) {\n      padding-left: calc(((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2));\n      padding-right: calc(((100vw - #{$containerMaxWidth} - var(--stzh-scrollbar-width, 0px)) / 2));\n    }\n  }\n\n  .stzh-mostsearched-item {\n    @include spaceCurve('padding-top', 'tiny');\n    @include spaceCurve('padding-bottom', 'tiny');\n  }\n\n  .stzh-mostsearched-item__link {\n    --text-decoration-line: none;\n    --hover-text-decoration-line: none;\n    --hover-color: $linkColor;\n\n    transition: transform 150ms ease;\n\n    &:hover {\n      @include mq($from: medium) {\n        transform: translateX(20px);\n      }\n    }\n  }\n}\n","import { Component, Element, Fragment, h, Host, Prop, Watch } from \"@stencil/core\";\nimport { StzhMostsearchedItem, StzhTopnewsItem } from \"../../index\";\n\n@Component({\n  tag: \"stzh-homepage-service-highlights\",\n  styleUrl: \"stzh-homepage-service-highlights.scss\",\n  scoped: true,\n})\nexport class StzhHomepageServiceHighlights {\n  @Element() element: HTMLStzhHomepageServiceHighlightsElement;\n\n  /** Top news items */\n  @Prop() topnewsItems: StzhTopnewsItem[] | string = [];\n  private _topnewsItems: StzhTopnewsItem[] = [];\n\n  /** Most searched items */\n  @Prop() mostsearchedItems: StzhMostsearchedItem[] | string = [];\n  private _mostsearchedItems: StzhMostsearchedItem[] = [];\n\n  @Watch(\"topnewsItems\")\n  topnewsItemsWatcher(newValue: StzhTopnewsItem[] | string) {\n    if (!newValue) {\n      this._topnewsItems = [];\n    } else if (typeof newValue === \"string\") {\n      try {\n        const parsed = JSON.parse(newValue);\n        this._topnewsItems = this.ensureSingleHighlight(parsed);\n      } catch (e) {\n        this._topnewsItems = [];\n      }\n    } else {\n      this._topnewsItems = this.ensureSingleHighlight(newValue);\n    }\n  }\n\n  @Watch(\"mostsearchedItems\")\n  mostsearchedItemsWatcher(newValue: StzhMostsearchedItem[] | string) {\n    if (!newValue) {\n      this._mostsearchedItems = [];\n    } else if (typeof newValue === \"string\") {\n      try {\n        this._mostsearchedItems = JSON.parse(newValue);\n      } catch (e) {\n        this._mostsearchedItems = [];\n      }\n    } else {\n      this._mostsearchedItems = newValue;\n    }\n  }\n\n  private ensureSingleHighlight(items: StzhTopnewsItem[]): StzhTopnewsItem[] {\n    let foundHighlighted = false;\n\n    return items.map(item => {\n      if (item.isHighlighted) {\n        if (!foundHighlighted) {\n          foundHighlighted = true;\n          return item;\n        } else {\n          // Remove highlight from subsequent items\n          return { ...item, isHighlighted: false };\n        }\n      }\n      return item;\n    });\n  }\n\n  private init = () => {\n    this.topnewsItemsWatcher(this.topnewsItems);\n    this.mostsearchedItemsWatcher(this.mostsearchedItems);\n  };\n\n  connectedCallback() {\n    this.init();\n  }\n\n  private renderTopnewsItemInner(item: StzhTopnewsItem): HTMLElement {\n    return (\n      <Fragment>\n        {!!item.subtitle && <stzh-text class=\"stzh-topnews-item__subtitle\">{item.subtitle}</stzh-text>}\n        <stzh-heading class=\"stzh-topnews-item__label\">{item.label}</stzh-heading>\n      </Fragment>\n    );\n  }\n\n  render() {\n    const classes = {\n      \"stzh-homepage-service-highlights\": true,\n      \"stzh-homepage-service-highlights--has-topnews\": this._topnewsItems.length > 0,\n    };\n\n    return (\n      <Host>\n        <div class={classes}>\n          {this._topnewsItems.length > 0 && (\n            <div class=\"stzh-homepage-service-highlights__topnews\">\n              {this._topnewsItems.map(item =>\n                !!item.href ? (\n                  <a\n                    href={item.href}\n                    class={{\n                      \"stzh-topnews-item\": true,\n                      \"stzh-topnews-item--highlighted\": item.isHighlighted,\n                      \"stzh-topnews-item--has-link\": true,\n                    }}\n                  >\n                    {this.renderTopnewsItemInner(item)}\n                  </a>\n                ) : (\n                  <div\n                    class={{\n                      \"stzh-topnews-item\": true,\n                      \"stzh-topnews-item--highlighted\": item.isHighlighted,\n                    }}\n                  >\n                    {this.renderTopnewsItemInner(item)}\n                  </div>\n                )\n              )}\n            </div>\n          )}\n          {this._mostsearchedItems.length > 0 && (\n            <div class=\"stzh-homepage-service-highlights__mostsearched\">\n              {this._mostsearchedItems.map(item => (\n                <div\n                  class={{\n                    \"stzh-mostsearched-item\": true,\n                  }}\n                >\n                  <stzh-link class=\"stzh-mostsearched-item__link\" href={item.href} icon={\"arrow-right\"}>\n                    {item.label}\n                  </stzh-link>\n                </div>\n              ))}\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/stzh-hspace.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h, a as Host } from './index-e3050b18.js';
 
-const stzhHspaceCss = ":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{--h-space:var(--stzh-space-default);--h-around-left:0;--h-around-right:0;--h-around:0;display:flex;color:inherit;font-weight:inherit;font-family:inherit;letter-spacing:inherit}:host ::slotted(*){max-width:100%;padding-left:calc(var(--h-space) * var(--h-around-left));padding-right:calc(var(--h-space) * var(--h-around-right));margin:0}:host ::slotted(*:not(:last-child)){margin-right:calc(var(--h-space) * (1 - var(--h-around)))}:host ::slotted(stzh-show){--show-display:block}:host ::slotted(stzh-vspace),:host ::slotted(stzh-hspace),:host ::slotted(stzh-row),:host ::slotted(stzh-container),:host ::slotted(stzh-section){align-self:stretch;flex-grow:1}:host(:empty),:host([around]:not([around=false])){--h-around-left:1;--h-around-right:1;--h-around:1}:host(:empty){width:var(--h-space)}:host([around-left]:not([around-left=false])){--h-around-left:1;--h-around:1}:host([around-right]:not([around-right=false])){--h-around-right:1;--h-around:1}:host([border=left]),:host([border=left-right]){border-left:0.0625rem solid var(--stzh-base-border-color)}:host([border=right]),:host([border=left-right]){border-right:0.0625rem solid var(--stzh-base-border-color)}:host([curve=tiny]){--h-space:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){:host([curve=tiny]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([curve=tiny]){--h-space:var(--stzh-space-medium)}}:host([curve=small]){--h-space:var(--stzh-space-small)}@media screen and (min-width: 900px){:host([curve=small]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([curve=small]){--h-space:var(--stzh-space-large)}}:host([curve=regular]){--h-space:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([curve=regular]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([curve=regular]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([curve=regular]){--h-space:var(--stzh-space-xxlarge)}}:host([curve=medium]){--h-space:var(--stzh-space-xlarge)}@media screen and (min-width: 900px){:host([curve=medium]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=medium]){--h-space:var(--stzh-space-xxxlarge)}}:host([curve=large]){--h-space:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){:host([curve=large]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=large]){--h-space:var(--stzh-space-xxxxlarge)}}:host([curve=big]){--h-space:var(--stzh-space-xxlarge)}@media screen and (min-width: 600px){:host([curve=big]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([curve=big]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([curve=big]){--h-space:var(--stzh-space-xbig)}}:host([curve=huge]){--h-space:var(--stzh-space-xxxxlarge)}@media screen and (min-width: 600px){:host([curve=huge]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 900px){:host([curve=huge]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([curve=huge]){--h-space:var(--stzh-space-huge)}}:host([curve=section-inner]){--h-space:var(--stzh-space-large)}@media screen and (min-width: 600px){:host([curve=section-inner]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([curve=section-inner]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=section-inner]){--h-space:var(--stzh-space-xxxlarge)}}:host([curve=background-section-inner]){--h-space:var(--stzh-space-xlarge)}@media screen and (min-width: 600px){:host([curve=background-section-inner]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){:host([curve=background-section-inner]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=background-section-inner]){--h-space:var(--stzh-space-xxxxlarge)}}:host([curve=background-section-outer]){--h-space:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([curve=background-section-outer]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([curve=background-section-outer]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([curve=background-section-outer]){--h-space:var(--stzh-space-xxlarge)}}:host([size=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}:host([size=xxsmall]){--h-space:var(--stzh-space-xxsmall)}:host([size=xsmall]){--h-space:var(--stzh-space-xsmall)}:host([size=small]){--h-space:var(--stzh-space-small)}:host([size=medium]){--h-space:var(--stzh-space-medium)}:host([size=large]){--h-space:var(--stzh-space-large)}:host([size=xlarge]){--h-space:var(--stzh-space-xlarge)}:host([size=xxlarge]){--h-space:var(--stzh-space-xxlarge)}:host([size=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}:host([size=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}:host([size=big]){--h-space:var(--stzh-space-big)}:host([size=xbig]){--h-space:var(--stzh-space-xbig)}:host([size=huge]){--h-space:var(--stzh-space-huge)}:host([size=xhuge]){--h-space:var(--stzh-space-xhuge)}:host([size=none]){--h-space:var(--stzh-space-none)}:host([size=default]){--h-space:var(--stzh-space-default)}@media screen and (min-width: 600px){:host([size-small=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 600px){:host([size-small=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 600px){:host([size-small=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 600px){:host([size-small=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 600px){:host([size-small=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 600px){:host([size-small=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 600px){:host([size-small=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){:host([size-small=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){:host([size-small=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 600px){:host([size-small=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){:host([size-small=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 600px){:host([size-small=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 600px){:host([size-small=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 600px){:host([size-small=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 900px){:host([size-medium=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 900px){:host([size-medium=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px){:host([size-medium=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px){:host([size-medium=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 900px){:host([size-medium=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 900px){:host([size-medium=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([size-medium=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([size-medium=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 900px){:host([size-medium=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 900px){:host([size-medium=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 900px){:host([size-medium=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 900px){:host([size-medium=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 900px){:host([size-medium=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1260px){:host([size-large=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){:host([size-large=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([size-large=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([size-large=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){:host([size-large=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([size-large=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){:host([size-large=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1260px){:host([size-large=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1260px){:host([size-large=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1260px){:host([size-large=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1600px){:host([size-ultra=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1600px){:host([size-ultra=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1600px){:host([size-ultra=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1600px){:host([size-ultra=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1600px){:host([size-ultra=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1600px){:host([size-ultra=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1600px){:host([size-ultra=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1600px){:host([size-ultra=default]){--h-space:var(--stzh-space-default)}}.stzh-hspace{flex-grow:1;width:100%;height:100%;display:flex;justify-content:flex-start;align-items:flex-start;padding:0;margin:0;}.stzh-hspace--border-left{border-left:0.0625rem solid var(--stzh-base-border-color)}.stzh-hspace--border-right{border-right:0.0625rem solid var(--stzh-base-border-color)}.stzh-hspace--justify-center{justify-content:center}.stzh-hspace--justify-end{justify-content:flex-end}.stzh-hspace--justify-between{justify-content:space-between}.stzh-hspace--justify-around{justify-content:space-around}.stzh-hspace--justify-evenly{justify-content:space-evenly}.stzh-hspace--items-end{align-items:flex-end}.stzh-hspace--items-center{align-items:center}.stzh-hspace--items-baseline{align-items:baseline}.stzh-hspace--items-stretch{align-items:stretch}";
+const stzhHspaceCss = ":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{--h-space:var(--stzh-space-default);--h-around-left:0;--h-around-right:0;--h-around:0;display:flex;color:inherit;font-weight:inherit;font-family:inherit;letter-spacing:inherit}:host ::slotted(*){max-width:100%;padding-left:calc(var(--h-space) * var(--h-around-left));padding-right:calc(var(--h-space) * var(--h-around-right));margin:0}:host ::slotted(*:not(:last-child)){margin-right:calc(var(--h-space) * (1 - var(--h-around)))}:host ::slotted(stzh-show){--show-display:block}:host ::slotted(stzh-vspace),:host ::slotted(stzh-hspace),:host ::slotted(stzh-row),:host ::slotted(stzh-container),:host ::slotted(stzh-section){align-self:stretch;flex-grow:1}:host(:empty),:host([around]:not([around=false])){--h-around-left:1;--h-around-right:1;--h-around:1}:host(:empty){width:var(--h-space)}:host([around-left]:not([around-left=false])){--h-around-left:1;--h-around:1}:host([around-right]:not([around-right=false])){--h-around-right:1;--h-around:1}:host([border=left]),:host([border=left-right]){border-left:0.0625rem solid var(--stzh-base-border-color)}:host([border=right]),:host([border=left-right]){border-right:0.0625rem solid var(--stzh-base-border-color)}:host([curve=tiny]){--h-space:var(--stzh-space-xsmall)}@media screen and (min-width: 900px){:host([curve=tiny]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([curve=tiny]){--h-space:var(--stzh-space-medium)}}:host([curve=small]){--h-space:var(--stzh-space-small)}@media screen and (min-width: 900px){:host([curve=small]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([curve=small]){--h-space:var(--stzh-space-large)}}:host([curve=intermediary]){--h-space:var(--stzh-space-medium)}@media screen and (min-width: 900px){:host([curve=intermediary]){--h-space:var(--stzh-space-large)}}:host([curve=regular]){--h-space:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([curve=regular]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([curve=regular]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([curve=regular]){--h-space:var(--stzh-space-xxlarge)}}:host([curve=medium]){--h-space:var(--stzh-space-xlarge)}@media screen and (min-width: 900px){:host([curve=medium]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=medium]){--h-space:var(--stzh-space-xxxlarge)}}:host([curve=large]){--h-space:var(--stzh-space-xxlarge)}@media screen and (min-width: 900px){:host([curve=large]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=large]){--h-space:var(--stzh-space-xxxxlarge)}}:host([curve=big]){--h-space:var(--stzh-space-xxlarge)}@media screen and (min-width: 600px){:host([curve=big]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([curve=big]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([curve=big]){--h-space:var(--stzh-space-xbig)}}:host([curve=huge]){--h-space:var(--stzh-space-xxxxlarge)}@media screen and (min-width: 600px){:host([curve=huge]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 900px){:host([curve=huge]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([curve=huge]){--h-space:var(--stzh-space-huge)}}:host([curve=section-inner]){--h-space:var(--stzh-space-large)}@media screen and (min-width: 600px){:host([curve=section-inner]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([curve=section-inner]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([curve=section-inner]){--h-space:var(--stzh-space-xxxlarge)}}:host([curve=background-section-inner]){--h-space:var(--stzh-space-xlarge)}@media screen and (min-width: 600px){:host([curve=background-section-inner]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){:host([curve=background-section-inner]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([curve=background-section-inner]){--h-space:var(--stzh-space-xxxxlarge)}}:host([curve=background-section-outer]){--h-space:var(--stzh-space-medium)}@media screen and (min-width: 600px){:host([curve=background-section-outer]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([curve=background-section-outer]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([curve=background-section-outer]){--h-space:var(--stzh-space-xxlarge)}}:host([size=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}:host([size=xxsmall]){--h-space:var(--stzh-space-xxsmall)}:host([size=xsmall]){--h-space:var(--stzh-space-xsmall)}:host([size=small]){--h-space:var(--stzh-space-small)}:host([size=medium]){--h-space:var(--stzh-space-medium)}:host([size=large]){--h-space:var(--stzh-space-large)}:host([size=xlarge]){--h-space:var(--stzh-space-xlarge)}:host([size=xxlarge]){--h-space:var(--stzh-space-xxlarge)}:host([size=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}:host([size=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}:host([size=big]){--h-space:var(--stzh-space-big)}:host([size=xbig]){--h-space:var(--stzh-space-xbig)}:host([size=huge]){--h-space:var(--stzh-space-huge)}:host([size=xhuge]){--h-space:var(--stzh-space-xhuge)}:host([size=none]){--h-space:var(--stzh-space-none)}:host([size=default]){--h-space:var(--stzh-space-default)}@media screen and (min-width: 600px){:host([size-small=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 600px){:host([size-small=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 600px){:host([size-small=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 600px){:host([size-small=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 600px){:host([size-small=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 600px){:host([size-small=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 600px){:host([size-small=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 600px){:host([size-small=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 600px){:host([size-small=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 600px){:host([size-small=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 600px){:host([size-small=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 600px){:host([size-small=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 600px){:host([size-small=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 600px){:host([size-small=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 600px){:host([size-small=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 900px){:host([size-medium=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 900px){:host([size-medium=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 900px){:host([size-medium=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 900px){:host([size-medium=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 900px){:host([size-medium=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 900px){:host([size-medium=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 900px){:host([size-medium=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 900px){:host([size-medium=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 900px){:host([size-medium=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 900px){:host([size-medium=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 900px){:host([size-medium=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 900px){:host([size-medium=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 900px){:host([size-medium=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 900px){:host([size-medium=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1260px){:host([size-large=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1260px){:host([size-large=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1260px){:host([size-large=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1260px){:host([size-large=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1260px){:host([size-large=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1260px){:host([size-large=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1260px){:host([size-large=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1260px){:host([size-large=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1260px){:host([size-large=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1260px){:host([size-large=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1260px){:host([size-large=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1260px){:host([size-large=default]){--h-space:var(--stzh-space-default)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxsmall]){--h-space:var(--stzh-space-xxxsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=xxsmall]){--h-space:var(--stzh-space-xxsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=xsmall]){--h-space:var(--stzh-space-xsmall)}}@media screen and (min-width: 1600px){:host([size-ultra=small]){--h-space:var(--stzh-space-small)}}@media screen and (min-width: 1600px){:host([size-ultra=medium]){--h-space:var(--stzh-space-medium)}}@media screen and (min-width: 1600px){:host([size-ultra=large]){--h-space:var(--stzh-space-large)}}@media screen and (min-width: 1600px){:host([size-ultra=xlarge]){--h-space:var(--stzh-space-xlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxlarge]){--h-space:var(--stzh-space-xxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxlarge]){--h-space:var(--stzh-space-xxxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=xxxxlarge]){--h-space:var(--stzh-space-xxxxlarge)}}@media screen and (min-width: 1600px){:host([size-ultra=big]){--h-space:var(--stzh-space-big)}}@media screen and (min-width: 1600px){:host([size-ultra=xbig]){--h-space:var(--stzh-space-xbig)}}@media screen and (min-width: 1600px){:host([size-ultra=huge]){--h-space:var(--stzh-space-huge)}}@media screen and (min-width: 1600px){:host([size-ultra=xhuge]){--h-space:var(--stzh-space-xhuge)}}@media screen and (min-width: 1600px){:host([size-ultra=none]){--h-space:var(--stzh-space-none)}}@media screen and (min-width: 1600px){:host([size-ultra=default]){--h-space:var(--stzh-space-default)}}.stzh-hspace{flex-grow:1;width:100%;height:100%;display:flex;justify-content:flex-start;align-items:flex-start;padding:0;margin:0;}.stzh-hspace--border-left{border-left:0.0625rem solid var(--stzh-base-border-color)}.stzh-hspace--border-right{border-right:0.0625rem solid var(--stzh-base-border-color)}.stzh-hspace--justify-center{justify-content:center}.stzh-hspace--justify-end{justify-content:flex-end}.stzh-hspace--justify-between{justify-content:space-between}.stzh-hspace--justify-around{justify-content:space-around}.stzh-hspace--justify-evenly{justify-content:space-evenly}.stzh-hspace--items-end{align-items:flex-end}.stzh-hspace--items-center{align-items:center}.stzh-hspace--items-baseline{align-items:baseline}.stzh-hspace--items-stretch{align-items:stretch}";
 
 const StzhHspace = class {
   constructor(hostRef) {

package/dist/esm/stzh-hspace.entry.js.map

@@ -1 +1 @@
-{"file":"stzh-hspace.entry.js","mappings":";;AAAA,MAAM,aAAa,GAAG,iqaAAiqa;;MCiB1qa,UAAU;;;iBAE0B,MAAM;;;;;;mBAcF,OAAO;iBAGX,OAAO;kBAGX,KAAK;sBAGD,KAAK;uBAGJ,KAAK;kBAGuB,MAAM;;EAElF,MAAM;IACJ,QACE,EAAC,IAAI,QACH,WACE,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,CAAC,wBAAwB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;QACxD,CAAC,sBAAsB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;OACnD,IAED,eAAa,CACT,CACD,EACP;GACH;;;;;;","names":[],"sources":["src/components/stzh-hspace/stzh-hspace.scss?tag=stzh-hspace&encapsulation=shadow","src/components/stzh-hspace/stzh-hspace.tsx"],"sourcesContent":[":host {\n  --h-space: #{space()};\n  --h-around-left: 0;\n  --h-around-right: 0;\n  --h-around: 0;\n\n  display: flex;\n  color: inherit;\n  font-weight: inherit;\n  font-family: inherit;\n  letter-spacing: inherit;\n\n  ::slotted(*) {\n    // fix IE11 not wrapping text\n    max-width: 100%;\n    padding-left: calc(var(--h-space) * var(--h-around-left));\n    padding-right: calc(var(--h-space) * var(--h-around-right));\n    margin: 0;\n  }\n\n  ::slotted(*:not(:last-child)) {\n    margin-right: calc(var(--h-space) * (1 - var(--h-around)));\n  }\n\n  ::slotted(stzh-show) {\n    --show-display: block;\n  }\n\n  ::slotted(stzh-vspace),\n  ::slotted(stzh-hspace),\n  ::slotted(stzh-row),\n  ::slotted(stzh-container),\n  ::slotted(stzh-section) {\n    align-self: stretch;\n    flex-grow: 1;\n  }\n}\n\n:host(:empty),\n:host([around]:not([around=\"false\"])) {\n  --h-around-left: 1;\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n:host(:empty) {\n  width: var(--h-space);\n}\n\n:host([around-left]:not([around-left=\"false\"])) {\n  --h-around-left: 1;\n  --h-around: 1;\n}\n\n:host([around-right]:not([around-right=\"false\"])) {\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n/* Border variants */\n\n:host([border=\"left\"]),\n:host([border=\"left-right\"]) {\n  border-left: 1px solid $baseBorderColor;\n}\n\n:host([border=\"right\"]),\n:host([border=\"left-right\"]) {\n  border-right: 1px solid $baseBorderColor;\n}\n\n/* Space variants */\n\n@each $spaceCurve, $value in $spaceCurves {\n  $defaultSize: map-get($value, 'size');\n  $breakpointSizes: map-get($value, 'sizes');\n\n  // :host([curve=\"#{$spaceCurve}\"]) > .stzh-h-space {\n  :host([curve=\"#{$spaceCurve}\"]) {\n    --h-space: #{space($defaultSize)};\n\n    @each $breakpoint, $size in $breakpointSizes {\n      @include mq($from: $breakpoint) {\n        --h-space: #{space($size)};\n      }\n    }\n  }\n}\n\n@mixin spaceProps($breakpoint: null) {\n  @each $space, $value in $spaceSizes {\n    @if $breakpoint {\n      // :host([size-#{$breakpoint}=\"#{$space}\"]) > .stzh-h-space {\n      :host([size-#{$breakpoint}=\"#{$space}\"]) {\n        @include mq($from: $breakpoint) {\n          --h-space: #{$value};\n        }\n      }\n    } @else {\n      // :host([size=\"#{$space}\"]) > .stzh-h-space {\n      :host([size=\"#{$space}\"]) {\n        --h-space: #{$value};\n      }\n    }\n  }\n}\n\n@include spaceProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include spaceProps($breakpoint);\n}\n\n.stzh-hspace {\n  flex-grow: 1;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  padding: 0;\n  margin: 0;\n\n  &--border-left {\n    border-left: 1px solid $baseBorderColor;\n  }\n\n  &--border-right {\n    border-right: 1px solid $baseBorderColor;\n  }\n\n  /* Justify content variants */\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Space, Layout } from \"../../index\";\n\n/**\n * @slot - Slot for any elements that should be horizontically spaced\n */\n@Component({\n  tag: \"stzh-hspace\",\n  styleUrl: \"stzh-hspace.scss\",\n  shadow: true\n})\nexport class StzhHspace {\n  /** Type of curve (see [Spacings docs page](/docs/tokens-spacings--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Space.Curves = \"none\";\n\n  /** Type of size (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) size: Space.Sizes;\n  /** Type of size above small breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeSmall: Space.Sizes;\n  /** Type of size above medium breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeMedium: Space.Sizes;\n  /** Type of size above large breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeLarge: Space.Sizes;\n  /** Type of size above ultra breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeUltra: Space.Sizes;\n\n  /** Alignment */\n  @Prop({ reflect: true }) justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop({ reflect: true }) items: Layout.Items = \"start\";\n\n  /** Apply spacing to slotted elements (padding instead of margin) */\n  @Prop({ reflect: true }) around: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only left) */\n  @Prop({ reflect: true }) aroundLeft: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only right) */\n  @Prop({ reflect: true }) aroundRight: boolean = false;\n\n  /** Add border */\n  @Prop({ reflect: true }) border: \"none\" | \"left\" | \"right\" | \"left-right\" = \"none\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-hspace\": true,\n            [`stzh-hspace--justify-${this.justify}`]: !!this.justify,\n            [`stzh-hspace--items-${this.items}`]: !!this.items\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"stzh-hspace.entry.js","mappings":";;AAAA,MAAM,aAAa,GAAG,o0aAAo0a;;MCiB70a,UAAU;;;iBAE0B,MAAM;;;;;;mBAcF,OAAO;iBAGX,OAAO;kBAGX,KAAK;sBAGD,KAAK;uBAGJ,KAAK;kBAGuB,MAAM;;EAElF,MAAM;IACJ,QACE,EAAC,IAAI,QACH,WACE,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,CAAC,wBAAwB,IAAI,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,OAAO;QACxD,CAAC,sBAAsB,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK;OACnD,IAED,eAAa,CACT,CACD,EACP;GACH;;;;;;","names":[],"sources":["src/components/stzh-hspace/stzh-hspace.scss?tag=stzh-hspace&encapsulation=shadow","src/components/stzh-hspace/stzh-hspace.tsx"],"sourcesContent":[":host {\n  --h-space: #{space()};\n  --h-around-left: 0;\n  --h-around-right: 0;\n  --h-around: 0;\n\n  display: flex;\n  color: inherit;\n  font-weight: inherit;\n  font-family: inherit;\n  letter-spacing: inherit;\n\n  ::slotted(*) {\n    // fix IE11 not wrapping text\n    max-width: 100%;\n    padding-left: calc(var(--h-space) * var(--h-around-left));\n    padding-right: calc(var(--h-space) * var(--h-around-right));\n    margin: 0;\n  }\n\n  ::slotted(*:not(:last-child)) {\n    margin-right: calc(var(--h-space) * (1 - var(--h-around)));\n  }\n\n  ::slotted(stzh-show) {\n    --show-display: block;\n  }\n\n  ::slotted(stzh-vspace),\n  ::slotted(stzh-hspace),\n  ::slotted(stzh-row),\n  ::slotted(stzh-container),\n  ::slotted(stzh-section) {\n    align-self: stretch;\n    flex-grow: 1;\n  }\n}\n\n:host(:empty),\n:host([around]:not([around=\"false\"])) {\n  --h-around-left: 1;\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n:host(:empty) {\n  width: var(--h-space);\n}\n\n:host([around-left]:not([around-left=\"false\"])) {\n  --h-around-left: 1;\n  --h-around: 1;\n}\n\n:host([around-right]:not([around-right=\"false\"])) {\n  --h-around-right: 1;\n  --h-around: 1;\n}\n\n/* Border variants */\n\n:host([border=\"left\"]),\n:host([border=\"left-right\"]) {\n  border-left: 1px solid $baseBorderColor;\n}\n\n:host([border=\"right\"]),\n:host([border=\"left-right\"]) {\n  border-right: 1px solid $baseBorderColor;\n}\n\n/* Space variants */\n\n@each $spaceCurve, $value in $spaceCurves {\n  $defaultSize: map-get($value, 'size');\n  $breakpointSizes: map-get($value, 'sizes');\n\n  // :host([curve=\"#{$spaceCurve}\"]) > .stzh-h-space {\n  :host([curve=\"#{$spaceCurve}\"]) {\n    --h-space: #{space($defaultSize)};\n\n    @each $breakpoint, $size in $breakpointSizes {\n      @include mq($from: $breakpoint) {\n        --h-space: #{space($size)};\n      }\n    }\n  }\n}\n\n@mixin spaceProps($breakpoint: null) {\n  @each $space, $value in $spaceSizes {\n    @if $breakpoint {\n      // :host([size-#{$breakpoint}=\"#{$space}\"]) > .stzh-h-space {\n      :host([size-#{$breakpoint}=\"#{$space}\"]) {\n        @include mq($from: $breakpoint) {\n          --h-space: #{$value};\n        }\n      }\n    } @else {\n      // :host([size=\"#{$space}\"]) > .stzh-h-space {\n      :host([size=\"#{$space}\"]) {\n        --h-space: #{$value};\n      }\n    }\n  }\n}\n\n@include spaceProps();\n\n@each $breakpoint, $size in $breakpoints {\n  @include spaceProps($breakpoint);\n}\n\n.stzh-hspace {\n  flex-grow: 1;\n  width: 100%;\n  height: 100%;\n\n  display: flex;\n  justify-content: flex-start;\n  align-items: flex-start;\n  padding: 0;\n  margin: 0;\n\n  &--border-left {\n    border-left: 1px solid $baseBorderColor;\n  }\n\n  &--border-right {\n    border-right: 1px solid $baseBorderColor;\n  }\n\n  /* Justify content variants */\n\n  &--justify-center {\n    justify-content: center;\n  }\n\n  &--justify-end {\n    justify-content: flex-end;\n  }\n\n  &--justify-between {\n    justify-content: space-between;\n  }\n\n  &--justify-around {\n    justify-content: space-around;\n  }\n\n  &--justify-evenly {\n    justify-content: space-evenly;\n  }\n\n  /* Align items variants */\n\n  &--items-end {\n    align-items: flex-end;\n  }\n\n  &--items-center {\n    align-items: center;\n  }\n\n  &--items-baseline {\n    align-items: baseline;\n  }\n\n  &--items-stretch {\n    align-items: stretch;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n} from \"@stencil/core\";\n\nimport { Space, Layout } from \"../../index\";\n\n/**\n * @slot - Slot for any elements that should be horizontically spaced\n */\n@Component({\n  tag: \"stzh-hspace\",\n  styleUrl: \"stzh-hspace.scss\",\n  shadow: true\n})\nexport class StzhHspace {\n  /** Type of curve (see [Spacings docs page](/docs/tokens-spacings--docs#curves) for more info). */\n  @Prop({ reflect: true }) curve: Space.Curves = \"none\";\n\n  /** Type of size (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) size: Space.Sizes;\n  /** Type of size above small breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeSmall: Space.Sizes;\n  /** Type of size above medium breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeMedium: Space.Sizes;\n  /** Type of size above large breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeLarge: Space.Sizes;\n  /** Type of size above ultra breakpoint (see [Spacings docs page](/docs/tokens-spacings--docs#values) for more info). */\n  @Prop({ reflect: true }) sizeUltra: Space.Sizes;\n\n  /** Alignment */\n  @Prop({ reflect: true }) justify: Layout.Justify = \"start\";\n\n  /** Control how cells items are positioned along a container's cross axis */\n  @Prop({ reflect: true }) items: Layout.Items = \"start\";\n\n  /** Apply spacing to slotted elements (padding instead of margin) */\n  @Prop({ reflect: true }) around: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only left) */\n  @Prop({ reflect: true }) aroundLeft: boolean = false;\n\n  /** Apply spacing to slotted elements (padding instead of margin, only right) */\n  @Prop({ reflect: true }) aroundRight: boolean = false;\n\n  /** Add border */\n  @Prop({ reflect: true }) border: \"none\" | \"left\" | \"right\" | \"left-right\" = \"none\";\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            \"stzh-hspace\": true,\n            [`stzh-hspace--justify-${this.justify}`]: !!this.justify,\n            [`stzh-hspace--items-${this.items}`]: !!this.items\n          }}\n        >\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/stzh-input.entry.js

@@ -3,7 +3,7 @@ import { h as hasSlot } from './utils-54aead01.js';
 import { S as StzhInputDescription } from './stzh-input-description-766446dc.js';
 import './string-utils-e252977e.js';
 
-const stzhInputCss = ".sc-stzh-input-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-input-h{display:none}.sc-stzh-input-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-input-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-input-h *.sc-stzh-input,.sc-stzh-input-h *.sc-stzh-input::before,.sc-stzh-input-h *.sc-stzh-input::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-input-h .has-focus.sc-stzh-input{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input{outline-style:none !important}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input::-moz-focus-inner{border:0 !important}.sc-stzh-input-h{--text-align:left;--color:var(--stzh-color-secondary60);--border-color:var(--stzh-color-grey70);--border-radius:var(--stzh-form-input-border-radius);--background-color:var(--stzh-color-white);--padding-top:var(--stzh-space-xsmall);--padding-bottom:var(--stzh-space-xsmall);--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--height:var(--stzh-form-input-height);--input-width:100%;--label-color:var(--stzh-color-primary);--placeholder-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey80);--hover-color:var(--stzh-color-secondary60);--hover-border-color:var(--stzh-color-secondary50);--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-primary70);--focus-color:var(--stzh-color-black);--focus-border-color:var(--stzh-color-secondary50);--focus-background-color:var(--stzh-color-secondary20);--focus-button-right-color:var(--stzh-color-primary70);width:100%}[type=hidden].sc-stzh-input-h{position:absolute;top:-624.9375rem;left:-624.9375rem;visibility:hidden}[size=small].sc-stzh-input-h{--height:var(--stzh-form-input-small-height)}[is-filled].sc-stzh-input-h:not([is-filled=false]){--button-right-color:var(--stzh-color-primary70);--hover-button-right-color:var(--stzh-color-primary70);--focus-button-right-color:var(--stzh-color-black)}[is-invalid].sc-stzh-input-h{--color:var(--stzh-color-error60);--border-color:var(--stzh-color-error60);--background-color:var(--stzh-color-white);--label-color:var(--stzh-color-error60);--placeholder-color:var(--stzh-color-error60);--button-right-color:var(--stzh-color-error60);--hover-color:var(--stzh-color-error60);--hover-border-color:var(--stzh-color-error60);--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-error60);--focus-color:var(--stzh-color-error60);--focus-border-color:var(--stzh-color-error60);--focus-background-color:var(--stzh-color-white);--focus-button-right-color:var(--stzh-color-error60)}[readonly].sc-stzh-input-h:not([readonly=false]),[disabled].sc-stzh-input-h:not([disabled=false]){--color:var(--stzh-color-grey70);--border-color:var(--stzh-color-grey70);--background-color:var(--stzh-color-grey10);--label-color:var(--stzh-color-grey70);--placeholder-color:var(--stzh-color-grey70);--description-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey70);--hover-color:var(--stzh-color-grey70);--hover-border-color:var(--stzh-color-grey70);--hover-background-color:var(--stzh-color-grey10);--hover-button-right-color:var(--stzh-color-grey70);--focus-color:var(--stzh-color-grey70);--focus-border-color:var(--stzh-color-grey70);--focus-background-color:var(--stzh-color-grey10);--focus-button-right-color:var(--stzh-color-grey70)}.sc-stzh-input-h:is(:has(.stzh-input__input:hover)){--button-right-color:var(--hover-button-right-color)}.sc-stzh-input-h:is(:has(.stzh-input__input:focus)){--button-right-color:var(--focus-button-right-color)}.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right],.stzh-input__button-right.sc-stzh-input{position:absolute;top:0px;right:0px}.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right] stzh-popover{display:block}.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[disabled]:not([disabled=false]),.stzh-input__button-right.sc-stzh-input,.stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false]){--color:var(--button-right-color);--background-color:transparent;--border-color:transparent;--hover-color:var(--button-right-color);--hover-background-color:transparent;--hover-border-color:transparent}.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][size=default][icon-only]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.stzh-input__button-right[size=default][icon-only].sc-stzh-input:not([icon-only=false]){--icon-size:var(--stzh-icon-size-medium)}.stzh-input__marker-symbol.sc-stzh-input{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-input__marker-text.sc-stzh-input{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input__description-wrapper.sc-stzh-input{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-input__error.sc-stzh-input,.stzh-input__description.sc-stzh-input{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-input__error.sc-stzh-input{color:var(--stzh-color-error60)}.stzh-input__error-list.sc-stzh-input{list-style:none;margin:0;padding:0}.stzh-input__description.sc-stzh-input{display:flex;align-items:flex-start;color:var(--stzh-input-description-color, var(--description-color, var(--stzh-color-coolgrey70)));transition:color var(--stzh-base-transition-animation-speed)}.stzh-input__description-long.sc-stzh-input{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-input__description-long.sc-stzh-input{margin-top:0}}.stzh-input__description-long-popover.sc-stzh-input{--width:auto;--max-width:27.3125rem}.stzh-input__description-long-button.sc-stzh-input{display:flex;justify-content:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-input.sc-stzh-input stzh-icon.stzh-input__description-long-icon.sc-stzh-input{--size:var(--stzh-icon-size-xsmall)}.stzh-input--has-error.sc-stzh-input .stzh-input__error.sc-stzh-input,.stzh-input--has-description.sc-stzh-input .stzh-input__description.sc-stzh-input{margin-top:var(--stzh-space-xxxsmall)}.stzh-input__field-wrapper.sc-stzh-input{position:relative;display:flex;width:var(--input-width)}.stzh-input__input.sc-stzh-input{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-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);border:0.125rem solid var(--border-color);transition-property:color, border-color, background-color;transition-duration:var(--stzh-base-transition-animation-speed);border-radius:var(--border-radius);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);padding-left:var(--padding-left);padding-right:var(--padding-right);margin:0;width:100%;color:var(--color);background-color:var(--background-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:var(--text-align)}.stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:hover{color:var(--hover-color);border-color:var(--hover-border-color);background-color:var(--hover-background-color)}.stzh-input__input.sc-stzh-input:focus{color:var(--focus-color);border-color:var(--focus-border-color);background-color:var(--focus-background-color)}.stzh-input__input.sc-stzh-input:-webkit-autofill{-webkit-background-clip:text;background-clip:text}.stzh-input__input.sc-stzh-input:-moz-placeholder-shown{text-overflow:ellipsis}.stzh-input__input.sc-stzh-input:placeholder-shown{text-overflow:ellipsis}.stzh-input__input[type=search].sc-stzh-input::-webkit-search-decoration,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-cancel-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-decoration{-webkit-appearance:none}.stzh-input__input--input.sc-stzh-input{height:var(--height)}.stzh-input__input--textarea.sc-stzh-input{min-height:var(--height);resize:vertical}.stzh-input__label.sc-stzh-input{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-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;color:var(--label-color);width:auto;max-width:100%;margin-bottom:var(--stzh-space-xxxsmall)}.stzh-input__label.sc-stzh-input:empty{display:none}.stzh-input__marker.sc-stzh-input{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);margin-left:calc(-0.25em + var(--stzh-space-xsmall))}.stzh-input--type-password.stzh-input--is-not-clearable.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-clearable.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input{pointer-events:none}.stzh-input--has-button-right.sc-stzh-input .stzh-input__input.sc-stzh-input{padding-right:var(--height)}.stzh-input--size-small.sc-stzh-input .stzh-input__input.sc-stzh-input{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-outer-spin-button,.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input[type=number].sc-stzh-input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.stzh-input--has-label-hidden.sc-stzh-input .stzh-input__label.sc-stzh-input{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input{cursor:not-allowed}";
+const stzhInputCss = ".sc-stzh-input-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-input-h{display:none}.sc-stzh-input-h::-moz-selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-input-h::selection{color:var(--stzh-selection-color);background-color:var(--stzh-selection-background-color)}.sc-stzh-input-h *.sc-stzh-input,.sc-stzh-input-h *.sc-stzh-input::before,.sc-stzh-input-h *.sc-stzh-input::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-input-h .has-focus.sc-stzh-input{outline:var(--stzh-flyingfocus-color) solid 0.125rem;outline-offset:0.125rem}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input{outline-style:none !important}.sc-stzh-input-h .stzh-fylingfocus-focused.sc-stzh-input::-moz-focus-inner{border:0 !important}.sc-stzh-input-h{--text-align:left;--color:var(--stzh-color-secondary60);--border-color:var(--stzh-color-grey70);--border-radius:var(--stzh-form-input-border-radius);--background-color:var(--stzh-color-white);--padding-top:var(--stzh-space-xsmall);--padding-bottom:var(--stzh-space-xsmall);--padding-left:var(--stzh-space-medium);--padding-right:var(--stzh-space-medium);--height:var(--stzh-form-input-height);--input-width:100%;--label-color:var(--stzh-color-primary);--placeholder-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey80);--hover-color:var(--stzh-color-secondary60);--hover-border-color:var(--stzh-color-secondary50);--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-primary70);--focus-color:var(--stzh-color-black);--focus-border-color:var(--stzh-color-secondary50);--focus-background-color:var(--stzh-color-secondary20);--focus-button-right-color:var(--stzh-color-primary70);--text-selection-background-color:var(--stzh-color-secondary30);width:100%}[type=hidden].sc-stzh-input-h{position:absolute;top:-624.9375rem;left:-624.9375rem;visibility:hidden}[size=small].sc-stzh-input-h{--height:var(--stzh-form-input-small-height)}[is-filled].sc-stzh-input-h:not([is-filled=false]){--button-right-color:var(--stzh-color-primary70);--hover-button-right-color:var(--stzh-color-primary70);--focus-button-right-color:var(--stzh-color-black)}[is-invalid].sc-stzh-input-h{--color:var(--stzh-color-error60);--border-color:var(--stzh-color-error60);--background-color:var(--stzh-color-white);--label-color:var(--stzh-color-error60);--placeholder-color:var(--stzh-color-error60);--button-right-color:var(--stzh-color-error60);--hover-color:var(--stzh-color-error60);--hover-border-color:var(--stzh-color-error60);--hover-background-color:var(--stzh-color-white);--hover-button-right-color:var(--stzh-color-error60);--focus-color:var(--stzh-color-error60);--focus-border-color:var(--stzh-color-error60);--focus-background-color:var(--stzh-color-white);--focus-button-right-color:var(--stzh-color-error60)}[readonly].sc-stzh-input-h:not([readonly=false]),[disabled].sc-stzh-input-h:not([disabled=false]){--color:var(--stzh-color-grey70);--border-color:var(--stzh-color-grey70);--background-color:var(--stzh-color-grey10);--label-color:var(--stzh-color-grey70);--placeholder-color:var(--stzh-color-grey70);--description-color:var(--stzh-color-grey70);--button-right-color:var(--stzh-color-grey70);--hover-color:var(--stzh-color-grey70);--hover-border-color:var(--stzh-color-grey70);--hover-background-color:var(--stzh-color-grey10);--hover-button-right-color:var(--stzh-color-grey70);--focus-color:var(--stzh-color-grey70);--focus-border-color:var(--stzh-color-grey70);--focus-background-color:var(--stzh-color-grey10);--focus-button-right-color:var(--stzh-color-grey70)}.sc-stzh-input-h:is(:has(.stzh-input__input:hover)){--button-right-color:var(--hover-button-right-color)}.sc-stzh-input-h:is(:has(.stzh-input__input:focus)){--button-right-color:var(--focus-button-right-color)}.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right],.stzh-input__button-right.sc-stzh-input{position:absolute;top:0px;right:0px}.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>[slot=button-right] stzh-popover{display:block}.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right],.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[disabled]:not([disabled=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button,.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[disabled]:not([disabled=false]),.stzh-input__button-right.sc-stzh-input,.stzh-input__button-right[disabled].sc-stzh-input:not([disabled=false]){--color:var(--button-right-color);--background-color:transparent;--border-color:transparent;--hover-color:var(--button-right-color);--hover-background-color:transparent;--hover-border-color:transparent}.sc-stzh-input-h .sc-stzh-input-s>stzh-button[slot=button-right][size=default][icon-only]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-popover[slot=button-right] .stzh-popover__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.sc-stzh-input-h .sc-stzh-input-s>stzh-tooltip[slot=button-right] .stzh-tooltip__trigger stzh-button[icon-only][size=default]:not([icon-only=false]),.stzh-input__button-right[size=default][icon-only].sc-stzh-input:not([icon-only=false]){--icon-size:var(--stzh-icon-size-medium)}.stzh-input__marker-symbol.sc-stzh-input{font-family:var(--stzh-font-family-medium);font-weight:var(--stzh-font-weight-medium);font-style:var(--stzh-font-style-medium)}.stzh-input__marker-text.sc-stzh-input{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input__description-wrapper.sc-stzh-input{display:flex;flex-direction:column-reverse;min-height:var(--description-min-height, var(--stzh-description-min-height, none))}.stzh-input__error.sc-stzh-input,.stzh-input__description.sc-stzh-input{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height)}.stzh-input__error.sc-stzh-input{color:var(--stzh-color-error60)}.stzh-input__error-list.sc-stzh-input{list-style:none;margin:0;padding:0}.stzh-input__description.sc-stzh-input{display:flex;align-items:flex-start;color:var(--stzh-input-description-color, var(--description-color, var(--stzh-color-coolgrey70)));transition:color var(--stzh-base-transition-animation-speed)}.stzh-input__description-long.sc-stzh-input{margin-right:var(--stzh-space-xxsmall);margin-top:0.125rem}@supports (font: -apple-system-body) and (-webkit-appearance: none){.stzh-input__description-long.sc-stzh-input{margin-top:0}}.stzh-input__description-long-popover.sc-stzh-input{--width:auto;--max-width:27.3125rem}.stzh-input__description-long-button.sc-stzh-input{display:flex;justify-content:center;align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;padding:0;border:none;background-color:transparent;border-radius:0.5rem;cursor:pointer}.stzh-input.sc-stzh-input stzh-icon.stzh-input__description-long-icon.sc-stzh-input{--size:var(--stzh-icon-size-xsmall)}.stzh-input--has-error.sc-stzh-input .stzh-input__error.sc-stzh-input,.stzh-input--has-description.sc-stzh-input .stzh-input__description.sc-stzh-input{margin-top:var(--stzh-space-xxxsmall)}.stzh-input.sc-stzh-input .sc-stzh-input::-moz-selection{background:var(--text-selection-background-color)}.stzh-input.sc-stzh-input .sc-stzh-input::selection{background:var(--text-selection-background-color)}.stzh-input__field-wrapper.sc-stzh-input{position:relative;display:flex;width:var(--input-width)}.stzh-input__input.sc-stzh-input{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-milli-font-size);line-height:var(--stzh-font-milli-text-line-height);letter-spacing:var(--stzh-font-curve---text-letter-spacing);border:0.125rem solid var(--border-color);transition-property:color, border-color, background-color;transition-duration:var(--stzh-base-transition-animation-speed);border-radius:var(--border-radius);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);padding-left:var(--padding-left);padding-right:var(--padding-right);margin:0;width:100%;color:var(--color);background-color:var(--background-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:var(--text-align)}.stzh-input__input.sc-stzh-input::-webkit-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input::-moz-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:-ms-input-placeholder{color:var(--placeholder-color)}.stzh-input__input.sc-stzh-input:hover{color:var(--hover-color);border-color:var(--hover-border-color);background-color:var(--hover-background-color)}.stzh-input__input.sc-stzh-input:focus{color:var(--focus-color);border-color:var(--focus-border-color);background-color:var(--focus-background-color)}.stzh-input__input.sc-stzh-input:-webkit-autofill{-webkit-background-clip:text;background-clip:text}.stzh-input__input.sc-stzh-input:-moz-placeholder-shown{text-overflow:ellipsis}.stzh-input__input.sc-stzh-input:placeholder-shown{text-overflow:ellipsis}.stzh-input__input[type=search].sc-stzh-input::-webkit-search-decoration,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-cancel-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-button,.stzh-input__input[type=search].sc-stzh-input::-webkit-search-results-decoration{-webkit-appearance:none}.stzh-input__input--input.sc-stzh-input{height:var(--height)}.stzh-input__input--textarea.sc-stzh-input{min-height:var(--height);resize:vertical}.stzh-input__label.sc-stzh-input{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-micro-font-size);line-height:var(--stzh-font-micro-text-line-height);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;color:var(--label-color);width:auto;max-width:100%;margin-bottom:var(--stzh-space-xxxsmall)}.stzh-input__label.sc-stzh-input:empty{display:none}.stzh-input__marker.sc-stzh-input{font-size:var(--stzh-font-nano-font-size);line-height:var(--stzh-font-nano-text-line-height);margin-left:calc(-0.25em + var(--stzh-space-xsmall))}.stzh-input--type-password.stzh-input--is-not-clearable.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-password.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-clearable.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-not-filled.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-readonly.sc-stzh-input .stzh-input__button-right.sc-stzh-input,.stzh-input--type-search.stzh-input--is-disabled.sc-stzh-input .stzh-input__button-right.sc-stzh-input{pointer-events:none}.stzh-input--has-button-right.sc-stzh-input .stzh-input__input.sc-stzh-input{padding-right:var(--height)}.stzh-input--size-small.sc-stzh-input .stzh-input__input.sc-stzh-input{font-size:var(--stzh-font-micro-font-size);line-height:var(--stzh-font-micro-text-line-height)}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-outer-spin-button,.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input.sc-stzh-input::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}.stzh-input.sc-stzh-input:not(.stzh-input--has-spin) .stzh-input__input[type=number].sc-stzh-input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.stzh-input--has-label-hidden.sc-stzh-input .stzh-input__label.sc-stzh-input{border:0;clip:rect(0 0 0 0);-webkit-clip-path:inset(100%);clip-path:inset(100%);width:0.0625rem;height:0.0625rem;overflow:hidden;padding:0;position:absolute}.stzh-input--is-readonly.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__input.sc-stzh-input,.stzh-input--is-readonly.sc-stzh-input .stzh-input__label.sc-stzh-input,.stzh-input--is-disabled.sc-stzh-input .stzh-input__label.sc-stzh-input{cursor:not-allowed}";
 
 let inputCounter = 0;
 const StzhInput = class {
@@ -21,12 +21,12 @@ const StzhInput = class {
       this.stzhChange.emit({
         component: "stzh-input",
         originalEvent: event,
-        value: this.value
+        value: this.value,
       });
       this.stzhChanged.emit({
         component: "stzh-input",
         originalEvent: event,
-        value: this.value
+        value: this.value,
       });
     };
     this.handleReset = async () => {
@@ -46,7 +46,7 @@ const StzhInput = class {
       this.stzhChange.emit({
         component: "stzh-input",
         originalEvent: event,
-        value: this.value
+        value: this.value,
       });
     };
     this.onChange = (event) => {
@@ -54,7 +54,7 @@ const StzhInput = class {
       this.stzhChanged.emit({
         component: "stzh-input",
         originalEvent: event,
-        value: this.value
+        value: this.value,
       });
     };
     this.onRootFocus = () => {
@@ -65,29 +65,29 @@ const StzhInput = class {
     };
     this.onFocus = (event) => {
       this.focusedByInput = true;
-      const focusEvent = new FocusEvent('focus', {
+      const focusEvent = new FocusEvent("focus", {
         view: window,
         bubbles: false,
-        cancelable: false
+        cancelable: false,
       });
       this.element.dispatchEvent(focusEvent);
       this.stzhFocus.emit({
         component: "stzh-input",
-        originalEvent: event
+        originalEvent: event,
       });
     };
     this.onBlur = (event) => {
       // fixes weird bug where autofill selection doesn't get removed
       this.input.value = this.input.value;
-      const blurEvent = new FocusEvent('blur', {
+      const blurEvent = new FocusEvent("blur", {
         view: window,
         bubbles: false,
-        cancelable: false
+        cancelable: false,
       });
       this.element.dispatchEvent(blurEvent);
       this.stzhBlur.emit({
         component: "stzh-input",
-        originalEvent: event
+        originalEvent: event,
       });
     };
     this.localization = undefined;
@@ -154,21 +154,19 @@ const StzhInput = class {
     }
   }
   typeWatcher(newValue) {
-    const types = [
-      "text", "search", "password", "email", "url", "tel", "number", "hidden"
-    ];
+    const types = ["text", "search", "password", "email", "url", "tel", "number", "hidden"];
     if (!this.multiline && !types.includes(newValue)) {
       throw new Error(`Type ${newValue} not supported`);
     }
   }
   waitForNextRender() {
-    return new Promise(resolve => this.renderPromiseResolve = resolve);
+    return new Promise(resolve => (this.renderPromiseResolve = resolve));
   }
   renderTextarea() {
-    return (h("textarea", { class: "stzh-input__input stzh-input__input--textarea", ref: (el) => (this.input = el), id: this.inputId, name: this.name, value: this.value, rows: this.rows, disabled: this.disabled, readonly: this.readonly, minlength: this.minlength, maxlength: this.maxlength, "aria-describedby": `${this.inputId}-description ${this.a11yDescribedby}`, "aria-required": this.required ? "true" : "false", "aria-invalid": this.invalid ? "true" : "false", onChange: this.onChange, onInput: this.onInput, onFocus: this.onFocus, onBlur: this.onBlur }));
+    return (h("textarea", { class: "stzh-input__input stzh-input__input--textarea", ref: el => (this.input = el), id: this.inputId, name: this.name, value: this.value, rows: this.rows, disabled: this.disabled, readonly: this.readonly, minlength: this.minlength, maxlength: this.maxlength, "aria-describedby": `${this.inputId}-description ${this.a11yDescribedby}`, "aria-required": this.required ? "true" : "false", "aria-invalid": this.invalid ? "true" : "false", onChange: this.onChange, onInput: this.onInput, onFocus: this.onFocus, onBlur: this.onBlur }));
   }
   renderInput() {
-    return (h("input", { class: "stzh-input__input stzh-input__input--input", ref: (el) => (this.input = el), id: this.inputId, type: this.type, name: this.name, value: this.value, defaultValue: this.defaultValue, min: this.min, max: this.max, step: this.step, inputmode: this.inputmode, disabled: this.disabled, readonly: this.readonly, minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.noAutocomplete ? "off" : this.autocomplete, "aria-autocomplete": this.noAutocomplete ? "none" : undefined, "aria-describedby": `${this.inputId}-description ${this.a11yDescribedby}`, "aria-required": this.required ? "true" : "false", "aria-invalid": this.invalid ? "true" : "false", onChange: this.onChange, onInput: this.onInput, onFocus: this.onFocus, onBlur: this.onBlur }));
+    return (h("input", { class: "stzh-input__input stzh-input__input--input", ref: el => (this.input = el), id: this.inputId, type: this.type, name: this.name, value: this.value, defaultValue: this.defaultValue, min: this.min, max: this.max, step: this.step, inputmode: this.inputmode, disabled: this.disabled, readonly: this.readonly, minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.noAutocomplete ? "off" : this.autocomplete, "aria-autocomplete": this.noAutocomplete ? "none" : undefined, "aria-describedby": `${this.inputId}-description ${this.a11yDescribedby}`, "aria-required": this.required ? "true" : "false", "aria-invalid": this.invalid ? "true" : "false", onChange: this.onChange, onInput: this.onInput, onFocus: this.onFocus, onBlur: this.onBlur }));
   }
   componentDidRender() {
     if (this.renderPromiseResolve) {
@@ -186,16 +184,16 @@ const StzhInput = class {
     }
   }
   render() {
-    var _a;
-    const buttonRightSlotUsed = hasSlot(this.element, 'button-right');
-    const descriptionUsed = hasSlot(this.element, 'description') || !!this.description;
-    const descriptionLongUsed = hasSlot(this.element, 'description-long') || !!this.descriptionLong;
-    const errorUsed = hasSlot(this.element, 'error') || ((_a = this._error) === null || _a === void 0 ? void 0 : _a.length) > 0;
+    var _a, _b;
+    const buttonRightSlotUsed = hasSlot(this.element, "button-right");
+    const descriptionUsed = hasSlot(this.element, "description") || !!this.description;
+    const descriptionLongUsed = hasSlot(this.element, "description-long") || !!this.descriptionLong;
+    const errorUsed = hasSlot(this.element, "error") || ((_a = this._error) === null || _a === void 0 ? void 0 : _a.length) > 0;
     const classes = {
       "stzh-input": true,
-      "stzh-input--has-button-right": buttonRightSlotUsed
-        || this.type === "search"
-        || (this.clearable && this.filled && !this.readonly && !this.disabled),
+      "stzh-input--has-button-right": buttonRightSlotUsed ||
+        this.type === "search" ||
+        (this.clearable && this.filled && !this.readonly && !this.disabled),
       "stzh-input--has-description": descriptionUsed,
       "stzh-input--has-description-long": descriptionLongUsed,
       "stzh-input--has-error": errorUsed,
@@ -212,25 +210,12 @@ const StzhInput = class {
       [`stzh-input--size-${this.size}`]: !!this.size,
       [`stzh-input--type-${this.type}`]: !!this.type,
     };
-    return (h(Host, { "is-invalid": this.invalid || errorUsed, tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus, "is-filled": this.filled }, h("div", { class: classes }, h("label", { class: "stzh-input__label", htmlFor: this.inputId }, this.label ? this.label : h("slot", null), !this.hideOptional &&
-      h("span", { class: "stzh-input__marker" }, h("span", { class: "stzh-input__marker-symbol", "aria-hidden": "true" }, this.required
-        ? this.localization.$globals.requiredFieldMarker
-        : this.localization.$globals.optionalFieldMarker), h("span", { class: "stzh-input__marker-text" }, this.required
-        ? this.localization.$globals.requiredFieldText
-        : this.localization.$globals.optionalFieldText))), h("div", { class: "stzh-input__field-wrapper" }, this.multiline ? this.renderTextarea() : this.renderInput(), (this.clearable || this.type === "search" || this.type === "password")
-      ?
-        ((!this.clearable || this.disabled || this.readonly || !this.filled)
-          && (this.type === "search" || this.type === "password")
-          ?
-            h("stzh-button", { class: "stzh-input__button-right", icon: this.type === "search" ? "search" : "view", size: this.size, iconOnly: true, disabled: true })
-          :
-            this.filled
-              ?
-                h("stzh-button", { class: "stzh-input__button-right", icon: "close", size: this.size, iconOnly: true, onClick: this.onClearClick, a11yLabel: this.localization.$globals.clearButtonLabel, "aria-controls": this.inputId })
-              :
-                h("slot", { name: "button-right" }))
-      :
-        h("slot", { name: "button-right" })), h(StzhInputDescription, { classPrefix: "stzh-input", id: `${this.inputId}-description`, error: this._error, description: this.description, descriptionLong: this.descriptionLong, descriptionLongTitle: this.descriptionLongTitle, descriptionLongUsed: descriptionLongUsed, moreInfoButtonLabel: this.localization.$globals.moreInfoButtonLabel }))));
+    return (h(Host, { "is-invalid": this.invalid || errorUsed, tabindex: this.disabled ? null : "-1", onFocus: this.onRootFocus, "is-filled": this.filled }, h("div", { class: classes }, h("label", { class: "stzh-input__label", htmlFor: this.inputId }, this.label ? this.label : h("slot", null), !this.hideOptional && (h("span", { class: "stzh-input__marker" }, h("span", { class: "stzh-input__marker-symbol", "aria-hidden": "true" }, this.required
+      ? this.localization.$globals.requiredFieldMarker
+      : this.localization.$globals.optionalFieldMarker), h("span", { class: "stzh-input__marker-text" }, this.required
+      ? this.localization.$globals.requiredFieldText
+      : this.localization.$globals.optionalFieldText)))), h("div", { class: "stzh-input__field-wrapper" }, this.multiline ? this.renderTextarea() : this.renderInput(), this.clearable || this.type === "search" || this.type === "password" ? ((!this.clearable || this.disabled || this.readonly || !this.filled) &&
+      (this.type === "search" || this.type === "password") ? (h("stzh-button", { class: "stzh-input__button-right", icon: this.type === "search" ? "search" : "view", size: this.size, iconOnly: true, disabled: true })) : this.filled ? (h("stzh-button", { class: "stzh-input__button-right", icon: "close", size: this.size, iconOnly: true, onClick: this.onClearClick, a11yLabel: this.localization.$globals.clearButtonLabel, "aria-controls": this.inputId })) : (h("slot", { name: "button-right" }))) : (h("slot", { name: "button-right" }))), (((_b = this._error) === null || _b === void 0 ? void 0 : _b.length) > 0 || this.description) && (h(StzhInputDescription, { classPrefix: "stzh-input", id: `${this.inputId}-description`, error: this._error, description: this.description, descriptionLong: this.descriptionLong, descriptionLongTitle: this.descriptionLongTitle, descriptionLongUsed: descriptionLongUsed, moreInfoButtonLabel: this.localization.$globals.moreInfoButtonLabel })))));
   }
   get element() { return getElement(this); }
   static get watchers() { return {