https://www.thecignagroup.com/static/www-thecignagroup-com/bundle/value-props-_5PvjJDd.js

1import{r as p,n as l,L as g,x as m,e as c}from"./main-DdEGjCiE.js";import"./row-b6tsRdeF.js";import"./light-dom-styles-BIHJ4wFY.js";const v=`@charset "UTF-8";
2/*------------------------------------*\\
3    #RESET
4\\*------------------------------------*/
5/**
6 * Border-Box http:/paulirish.com/2012/box-sizing-border-box-ftw/
7 */
8*,
9::slotted(*),
10*:before,
11*:after {
12  box-sizing: border-box;
13}
14
15:host *,
16:host *::before,
17:host *::after {
18  box-sizing: inherit;
19}
20
21[hidden] {
22  display: none !important;
23}
24
25/* ------------------------------------*\\
26    #TYPOGRAPHY PLACEHOLDERS
27\\*------------------------------------ */
28.base-c-value-props--columns-2, .base-c-value-props--columns-3, .base-c-value-props--columns-4 {
29  display: grid;
30}
31
32/*
33  Hiding class, making content visible only to screen readers but not visually ("sr" meaning "screen-reader")
34  Is the hidden content read by a screen reader?	- Yes
35  Will the hidden element affect the document layout? - No
36  Will the hidden element’s box model be rendered? - No
37  Does the element detect clicks or focus? - Yes
38  https://css-tricks.com/comparing-various-ways-to-hide-things-in-css/#method-5-the-visually-hidden-class
39*/
40.base-c-value-props--background-white {
41  background: var(--leaf-color-bg-default);
42  border-radius: var(--leaf-border-radius-container);
43  padding: var(--leaf-spacing-32) !important;
44}
45@media (min-width: 48rem) {
46  .base-c-value-props--background-white {
47    padding: var(--leaf-spacing-48) !important;
48  }
49}
50@media (min-width: 60rem) {
51  .base-c-value-props--background-white {
52    padding: var(--leaf-spacing-64) !important;
53  }
54}
55
56.base-c-value-props--row {
57  display: grid;
58  gap: var(--leaf-spacing-48) var(--leaf-spacing-24);
59}
60
61@media (min-width: 48rem) {
62  .base-c-value-props--columns-2 {
63    grid-gap: var(--leaf-spacing-48) var(--leaf-spacing-24);
64    grid-template-columns: minmax(0, calc(8.3333333333% * 6 - 12px)) minmax(0, calc(8.3333333333% * 6 - 12px));
65  }
66}
67
68@media (min-width: 48rem) {
69  .base-c-value-props--columns-3 {
70    grid-gap: var(--leaf-spacing-48) var(--leaf-spacing-24);
71    grid-template-columns: minmax(0, calc(8.3333333333% * 4 - 16px)) minmax(0, calc(8.3333333333% * 4 - 16px)) minmax(0, calc(8.3333333333% * 4 - 16px));
72  }
73}
74
75@media (min-width: 48rem) {
76  .base-c-value-props--columns-4 {
77    grid-gap: var(--leaf-spacing-48) var(--leaf-spacing-24);
78    grid-template-columns: minmax(0, calc(8.3333333333% * 6 - 12px)) minmax(0, calc(8.3333333333% * 6 - 12px));
79  }
80}
81@media (min-width: 60rem) and (min-width: 60rem) {
82  .base-c-value-props--columns-4 {
83    grid-gap: var(--leaf-spacing-48) var(--leaf-spacing-24);
84    grid-template-columns: minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px)) minmax(0, calc(8.3333333333% * 3 - 18px));
85  }
86}`;var b=Object.defineProperty,i=(r,e,n,x)=>{for(var a=void 0,o=r.length-1,t;o>=0;o--)(t=r[o])&&(a=t(e,n,a)||a);return a&&b(e,n,a),a};const d=class extends g{constructor(){super(...arguments),this.background="transparent",this.columns=1}updated(e){if(super.updated(e),e.has("iconColorName")&&this.iconColorName){let n="leaf-color-bg";this.iconColorName==="accent-1-xstrong"?n="leafdcws":this.iconColorName==="accent-2-xstrong"&&(n="leafdcws-color-bg"),this.style.setProperty("--value-prop-icon-color",`var(--${n}-${this.iconColorName})`)}}render(){const e={"base-c-value-props":!0,[`base-c-value-props--background-${this.background}`]:!0},n={"base-c-value-props--row":!0,"base-c-value-props--columns-2":this.columns===2,"base-c-value-props--columns-3":this.columns===3,"base-c-value-props--columns-4":this.columns===4};return m`<div class=${c(e)}>
87      <slot name="heading"></slot>
88      <div class=${c(n)}>
89        <slot></slot>
90      </div>
91    </div> `}};d.styles=p(v);let s=d;i([l()],s.prototype,"background");i([l({type:Number})],s.prototype,"columns");i([l({attribute:"icon-color-name"})],s.prototype,"iconColorName");const h="",u=class extends s{render(){return m`<div class="tcg-c-value-props">${super.render()}</div>`}};u.styles=p([s.styles,h]);let f=u;customElements.define("tcg-value-props",f);export{f as TCGValueProps};
92//# sourceMappingURL=value-props-_5PvjJDd.js.map