@axa-fr/design-system-look-and-feel-css 0.1.1

package/dist/Accordion/Accordion.css

@@ -0,0 +1 @@
+.af-accordion{--summary-areas:"tag-date-container title-container value arrow";--summary-columns:auto 1fr repeat(2,auto);--title-container-areas:"icon title" "icon subtitle";--title-container-columns:min-content 1fr}.af-accordion__summary{grid-template-areas:var(--summary-areas);grid-template-columns:var(--summary-columns)}.af-accordion__summary:not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container value arrow";--summary-columns:1fr repeat(2,auto)}.af-accordion__summary:not(:has(.af-accordion__value)){--summary-areas:"tag-date-container title-container arrow";--summary-columns:auto 1fr auto}.af-accordion__summary:not(:has(.af-accordion__value)):not(:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}.af-accordion__summary .af-accordion__icon{align-items:center;display:grid;grid-area:icon}.af-accordion__summary .af-accordion__title-container{display:grid;gap:.125rem 1rem;grid-area:title-container;grid-template:var(--title-container-areas);grid-template-columns:var(--title-container-columns)}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__icon)){--title-container-areas:"title" "subtitle";--title-container-columns:1fr;column-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)){--title-container-areas:"icon title";row-gap:0}.af-accordion__summary .af-accordion__title-container:not(:has(.af-accordion__subtitle)):not(:has(.af-accordion__icon)){--title-container-areas:"title"}.af-accordion__summary .af-accordion__title-container .af-accordion__title{grid-area:title}.af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{color:#5f5f5f;font-size:1rem;font-weight:400;grid-area:subtitle;line-height:1.25rem}.af-accordion__summary .af-accordion__value{color:#118635;display:grid;grid-area:value;justify-items:center;min-width:9.375rem}.af-accordion__summary .af-accordion__tag-date-container{display:grid;grid-area:tag-date-container;grid-template:"tag" "date";padding-right:3.93rem;row-gap:.5rem}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container{grid-area:tag;justify-items:center;text-align:center}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__tag-container .af-tag{cursor:inherit}.af-accordion__summary .af-accordion__tag-date-container .af-accordion__date{align-items:center;color:#5f5f5f;display:grid;grid-area:date;text-align:center}.af-accordion__summary--title-first{--summary-areas:"title-container tag-date-container value arrow";--summary-columns:repeat(3,auto) min-content}.af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"title-container tag-date-container arrow";--summary-columns:repeat(2,auto) min-content}.af-accordion__summary--title-first .af-accordion__tag-date-container{column-gap:inherit;grid-template:"tag date";padding:0}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0 1.688rem}.af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date{padding:0 3.125rem}.af-accordion__summary--title-first .af-accordion__value{min-width:auto}.af-accordion__summary .af-accordion__tag-date-container:has(>:only-child){row-gap:0}@media (width <= 1023px){.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__date,.af-accordion .af-accordion__summary--title-first .af-accordion__tag-date-container .af-accordion__tag-container{padding:0}}@media (width <= 667px){.af-accordion .af-accordion__summary{--summary-areas:"tag-date-container arrow" "title-container arrow" "value arrow";--summary-columns:1fr;column-gap:0}.af-accordion .af-accordion__summary .af-accordion__title-container{justify-content:start}.af-accordion .af-accordion__summary .af-accordion__title-container .af-accordion__subtitle{font-size:.875rem;line-height:1.1rem}.af-accordion .af-accordion__summary .af-accordion__tag-date-container{display:flex;gap:.5rem}.af-accordion .af-accordion__summary .af-accordion__value{justify-content:start}.af-accordion .af-accordion__summary--title-first{--summary-areas:"icon title-container arrow" "icon tag-date-container arrow" "icon value arrow";--summary-columns:auto 1fr auto;column-gap:.75rem}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon)){--summary-areas:"title-container arrow" "tag-date-container arrow" "value arrow";--summary-columns:1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container)){--summary-areas:"icon title-container arrow" "icon value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__value)){--summary-areas:"icon title-container arrow" "icon tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container)){--summary-areas:"title-container arrow" "value arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"icon title-container arrow";--summary-columns:auto 1fr auto}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__value)){--summary-areas:"title-container arrow" "tag-date-container arrow"}.af-accordion .af-accordion__summary--title-first:not(:has(.af-accordion__icon),:has(.af-accordion__tag-date-container),:has(.af-accordion__value)){--summary-areas:"title-container arrow";--summary-columns:1fr auto}}

package/dist/Accordion/Accordion.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Accordion/Accordion.scss%23sass","../../src/Accordion/Accordion.scss","../../src/common/common.scss"],"names":[],"mappings":"AAEA,cACE,gEAAA,CCDF,yCAAA,CDGE,oDAAA,CACA,yCCDF,CDGE,uBACE,wCAAA,CACA,4CCDJ,CDGI,oEACE,6CAAA,CACA,oCCDN,CDII,uDACE,0DAAA,CACA,+BCFN,CDIM,oGACE,uCAAA,CACA,0BCFR,CDOM,2CAGE,kBAAA,CAFA,YAAA,CACA,cCJR,CDQM,sDACE,YAAA,CAIA,gBAAA,CAHA,yBAAA,CACA,0CAAA,CACA,oDCLR,CDQQ,qFACE,0CAAA,CACA,6BAAA,CAEA,YCPV,CDUQ,yFACE,oCAAA,CAEA,SCTV,CDWU,wHACE,+BCTZ,CDcU,2EACE,eCZZ,CDeU,8EAKE,aEjCK,CF8BL,cAAA,CACA,eAAA,CAFA,kBAAA,CAGA,mBCZZ,CDkBM,4CAKE,aEzCU,CFqCV,YAAA,CAEA,eAAA,CACA,oBAAA,CAFA,kBCbR,CDmBM,yDACE,YAAA,CAEA,4BAAA,CACA,0BAAA,CAFA,qBAAA,CAGA,aCjBR,CDoBU,sFACE,aAAA,CACA,oBAAA,CACA,iBClBZ,CDoBY,8FACE,cClBd,CDsBU,6EAGE,kBAAA,CAEA,aAAA,CAJA,YAAA,CACA,cAAA,CAEA,iBCnBZ,CD0BI,oCACE,gEAAA,CACA,4CCxBN,CD0BM,oEACE,0DAAA,CACA,4CCxBR,CD4BQ,sEAGE,kBAAA,CADA,wBAAA,CADA,SCxBV,CD6BY,mGACE,kBC3Bd,CD8BY,0FACE,kBC5Bd,CDiCQ,yDACE,cC/BV,CDoCI,2EACE,SClCN,CDsCE,yBAII,yNAEE,SCxCN,CACF,CD4CE,wBACE,qCACE,gFAAA,CAEA,qBAAA,CAEA,YC3CJ,CD8CM,oEACE,qBC5CR,CD+CU,4FACE,iBAAA,CACA,kBC7CZ,CDkDM,uEACE,YAAA,CACA,SChDR,CDmDM,0DACE,qBCjDR,CDqDI,kDACE,+FAAA,CAEA,+BAAA,CAEA,iBCpDN,CDsDM,iFACE,gFAAA,CCnDR,0BACA,CDuDM,+FACE,+DCrDR,CDwDM,kFACE,4ECrDR,CDyDM,yHCtDN,qDACA,CD4DM,0HAIE,4CAAA,CACA,+BC5DR,CD+DM,4GACE,kEC7DR,CDgEM,oJAKE,uCAAA,CACA,0BChER,CACF","file":"Accordion.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n  --summary-areas: \"tag-date-container title-container value arrow\";\n  --summary-columns: auto 1fr repeat(2, auto);\n  --title-container-areas: \"icon title\" \"icon subtitle\";\n  --title-container-columns: min-content 1fr;\n\n  &__summary {\n    grid-template-areas: var(--summary-areas);\n    grid-template-columns: var(--summary-columns);\n\n    &:not(:has(.af-accordion__tag-date-container)) {\n      --summary-areas: \"title-container value arrow\";\n      --summary-columns: 1fr repeat(2, auto);\n    }\n\n    &:not(:has(.af-accordion__value)) {\n      --summary-areas: \"tag-date-container title-container arrow\";\n      --summary-columns: auto 1fr auto;\n\n      &:not(:has(.af-accordion__tag-date-container)) {\n        --summary-areas: \"title-container arrow\";\n        --summary-columns: 1fr auto;\n      }\n    }\n\n    .af-accordion {\n      &__icon {\n        display: grid;\n        grid-area: icon;\n        align-items: center;\n      }\n\n      &__title-container {\n        display: grid;\n        grid-area: title-container;\n        grid-template: var(--title-container-areas);\n        grid-template-columns: var(--title-container-columns);\n        gap: 0.125rem 1rem;\n\n        &:not(:has(.af-accordion__icon)) {\n          --title-container-areas: \"title\" \"subtitle\";\n          --title-container-columns: 1fr;\n\n          column-gap: 0;\n        }\n\n        &:not(:has(.af-accordion__subtitle)) {\n          --title-container-areas: \"icon title\";\n\n          row-gap: 0;\n\n          &:not(:has(.af-accordion__icon)) {\n            --title-container-areas: \"title\";\n          }\n        }\n\n        .af-accordion {\n          &__title {\n            grid-area: title;\n          }\n\n          &__subtitle {\n            grid-area: subtitle;\n            font-size: 1rem;\n            font-weight: 400;\n            line-height: 1.25rem;\n            color: common.$color-gray-700;\n          }\n        }\n      }\n\n      &__value {\n        display: grid;\n        min-width: 9.375rem;\n        grid-area: value;\n        justify-items: center;\n        color: common.$color-green-600;\n      }\n\n      &__tag-date-container {\n        display: grid;\n        padding-right: 3.93rem;\n        grid-area: tag-date-container;\n        grid-template: \"tag\" \"date\";\n        row-gap: 0.5rem;\n\n        .af-accordion {\n          &__tag-container {\n            grid-area: tag;\n            justify-items: center;\n            text-align: center;\n\n            .af-tag {\n              cursor: inherit;\n            }\n          }\n\n          &__date {\n            display: grid;\n            grid-area: date;\n            align-items: center;\n            text-align: center;\n            color: common.$color-gray-700;\n          }\n        }\n      }\n    }\n\n    &--title-first {\n      --summary-areas: \"title-container tag-date-container value arrow\";\n      --summary-columns: repeat(3, auto) min-content;\n\n      &:not(:has(.af-accordion__value)) {\n        --summary-areas: \"title-container tag-date-container arrow\";\n        --summary-columns: repeat(2, auto) min-content;\n      }\n\n      .af-accordion {\n        &__tag-date-container {\n          padding: 0;\n          grid-template: \"tag date\";\n          column-gap: inherit;\n\n          .af-accordion {\n            &__tag-container {\n              padding: 0 1.688rem;\n            }\n\n            &__date {\n              padding: 0 3.125rem;\n            }\n          }\n        }\n\n        &__value {\n          min-width: auto;\n        }\n      }\n    }\n\n    .af-accordion__tag-date-container:has(> :only-child) {\n      row-gap: 0;\n    }\n  }\n\n  @media (width <= #{common.$breakpoint-md}) {\n    .af-accordion__summary--title-first\n      .af-accordion__tag-date-container\n      .af-accordion {\n      &__tag-container,\n      &__date {\n        padding: 0;\n      }\n    }\n  }\n\n  @media (width <= #{common.$breakpoint-sm}) {\n    .af-accordion__summary {\n      --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n        \"value arrow\";\n      --summary-columns: 1fr;\n\n      column-gap: 0;\n\n      .af-accordion {\n        &__title-container {\n          justify-content: start;\n\n          .af-accordion {\n            &__subtitle {\n              font-size: 0.875rem;\n              line-height: 1.1rem;\n            }\n          }\n        }\n\n        &__tag-date-container {\n          display: flex;\n          gap: 0.5rem;\n        }\n\n        &__value {\n          justify-content: start;\n        }\n      }\n\n      &--title-first {\n        --summary-areas: \"icon title-container arrow\"\n          \"icon tag-date-container arrow\" \"icon value arrow\";\n        --summary-columns: auto 1fr auto;\n\n        column-gap: 0.75rem;\n\n        &:not(:has(.af-accordion__icon)) {\n          --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n            \"value arrow\";\n          --summary-columns: 1fr auto;\n        }\n\n        &:not(:has(.af-accordion__tag-date-container)) {\n          --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n        }\n\n        &:not(:has(.af-accordion__value)) {\n          --summary-areas: \"icon title-container arrow\"\n            \"icon tag-date-container arrow\";\n        }\n\n        &:not(\n            :has(.af-accordion__icon),\n            :has(.af-accordion__tag-date-container)\n          ) {\n          --summary-areas: \"title-container arrow\" \"value arrow\";\n        }\n\n        &:not(\n            :has(.af-accordion__tag-date-container),\n            :has(.af-accordion__value)\n          ) {\n          --summary-areas: \"icon title-container arrow\";\n          --summary-columns: auto 1fr auto;\n        }\n\n        &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n          --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n        }\n\n        &:not(\n            :has(.af-accordion__icon),\n            :has(.af-accordion__tag-date-container),\n            :has(.af-accordion__value)\n          ) {\n          --summary-areas: \"title-container arrow\";\n          --summary-columns: 1fr auto;\n        }\n      }\n    }\n  }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n  --summary-areas: \"tag-date-container title-container value arrow\";\n  --summary-columns: auto 1fr repeat(2, auto);\n  --title-container-areas: \"icon title\" \"icon subtitle\";\n  --title-container-columns: min-content 1fr;\n\n  &__summary {\n    grid-template-areas: var(--summary-areas);\n    grid-template-columns: var(--summary-columns);\n\n    &:not(:has(.af-accordion__tag-date-container)) {\n      --summary-areas: \"title-container value arrow\";\n      --summary-columns: 1fr repeat(2, auto);\n    }\n\n    &:not(:has(.af-accordion__value)) {\n      --summary-areas: \"tag-date-container title-container arrow\";\n      --summary-columns: auto 1fr auto;\n\n      &:not(:has(.af-accordion__tag-date-container)) {\n        --summary-areas: \"title-container arrow\";\n        --summary-columns: 1fr auto;\n      }\n    }\n\n    .af-accordion {\n      &__icon {\n        display: grid;\n        grid-area: icon;\n        align-items: center;\n      }\n\n      &__title-container {\n        display: grid;\n        grid-area: title-container;\n        grid-template: var(--title-container-areas);\n        grid-template-columns: var(--title-container-columns);\n        gap: 0.125rem 1rem;\n\n        &:not(:has(.af-accordion__icon)) {\n          --title-container-areas: \"title\" \"subtitle\";\n          --title-container-columns: 1fr;\n\n          column-gap: 0;\n        }\n\n        &:not(:has(.af-accordion__subtitle)) {\n          --title-container-areas: \"icon title\";\n\n          row-gap: 0;\n\n          &:not(:has(.af-accordion__icon)) {\n            --title-container-areas: \"title\";\n          }\n        }\n\n        .af-accordion {\n          &__title {\n            grid-area: title;\n          }\n\n          &__subtitle {\n            grid-area: subtitle;\n            font-size: 1rem;\n            font-weight: 400;\n            line-height: 1.25rem;\n            color: common.$color-gray-700;\n          }\n        }\n      }\n\n      &__value {\n        display: grid;\n        min-width: 9.375rem;\n        grid-area: value;\n        justify-items: center;\n        color: common.$color-green-600;\n      }\n\n      &__tag-date-container {\n        display: grid;\n        padding-right: 3.93rem;\n        grid-area: tag-date-container;\n        grid-template: \"tag\" \"date\";\n        row-gap: 0.5rem;\n\n        .af-accordion {\n          &__tag-container {\n            grid-area: tag;\n            justify-items: center;\n            text-align: center;\n\n            .af-tag {\n              cursor: inherit;\n            }\n          }\n\n          &__date {\n            display: grid;\n            grid-area: date;\n            align-items: center;\n            text-align: center;\n            color: common.$color-gray-700;\n          }\n        }\n      }\n    }\n\n    &--title-first {\n      --summary-areas: \"title-container tag-date-container value arrow\";\n      --summary-columns: repeat(3, auto) min-content;\n\n      &:not(:has(.af-accordion__value)) {\n        --summary-areas: \"title-container tag-date-container arrow\";\n        --summary-columns: repeat(2, auto) min-content;\n      }\n\n      .af-accordion {\n        &__tag-date-container {\n          padding: 0;\n          grid-template: \"tag date\";\n          column-gap: inherit;\n\n          .af-accordion {\n            &__tag-container {\n              padding: 0 1.688rem;\n            }\n\n            &__date {\n              padding: 0 3.125rem;\n            }\n          }\n        }\n\n        &__value {\n          min-width: auto;\n        }\n      }\n    }\n\n    .af-accordion__tag-date-container:has(> :only-child) {\n      row-gap: 0;\n    }\n  }\n\n  @media (width <= #{common.$breakpoint-md}) {\n    .af-accordion__summary--title-first\n      .af-accordion__tag-date-container\n      .af-accordion {\n      &__tag-container,\n      &__date {\n        padding: 0;\n      }\n    }\n  }\n\n  @media (width <= #{common.$breakpoint-sm}) {\n    .af-accordion__summary {\n      --summary-areas: \"tag-date-container arrow\" \"title-container arrow\"\n        \"value arrow\";\n      --summary-columns: 1fr;\n\n      column-gap: 0;\n\n      .af-accordion {\n        &__title-container {\n          justify-content: start;\n\n          .af-accordion {\n            &__subtitle {\n              font-size: 0.875rem;\n              line-height: 1.1rem;\n            }\n          }\n        }\n\n        &__tag-date-container {\n          display: flex;\n          gap: 0.5rem;\n        }\n\n        &__value {\n          justify-content: start;\n        }\n      }\n\n      &--title-first {\n        --summary-areas: \"icon title-container arrow\"\n          \"icon tag-date-container arrow\" \"icon value arrow\";\n        --summary-columns: auto 1fr auto;\n\n        column-gap: 0.75rem;\n\n        &:not(:has(.af-accordion__icon)) {\n          --summary-areas: \"title-container arrow\" \"tag-date-container arrow\"\n            \"value arrow\";\n          --summary-columns: 1fr auto;\n        }\n\n        &:not(:has(.af-accordion__tag-date-container)) {\n          --summary-areas: \"icon title-container arrow\" \"icon value arrow\";\n        }\n\n        &:not(:has(.af-accordion__value)) {\n          --summary-areas: \"icon title-container arrow\"\n            \"icon tag-date-container arrow\";\n        }\n\n        &:not(\n            :has(.af-accordion__icon),\n            :has(.af-accordion__tag-date-container)\n          ) {\n          --summary-areas: \"title-container arrow\" \"value arrow\";\n        }\n\n        &:not(\n            :has(.af-accordion__tag-date-container),\n            :has(.af-accordion__value)\n          ) {\n          --summary-areas: \"icon title-container arrow\";\n          --summary-columns: auto 1fr auto;\n        }\n\n        &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {\n          --summary-areas: \"title-container arrow\" \"tag-date-container arrow\";\n        }\n\n        &:not(\n            :has(.af-accordion__icon),\n            :has(.af-accordion__tag-date-container),\n            :has(.af-accordion__value)\n          ) {\n          --summary-areas: \"title-container arrow\";\n          --summary-columns: 1fr auto;\n        }\n      }\n    }\n  }\n}\n","@import \"./mixins\";\n\n$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n"]}

package/dist/Accordion/Accordion.scss

@@ -0,0 +1,241 @@
+@use "../common/common.scss" as common;
+
+.af-accordion {
+  --summary-areas: "tag-date-container title-container value arrow";
+  --summary-columns: auto 1fr repeat(2, auto);
+  --title-container-areas: "icon title" "icon subtitle";
+  --title-container-columns: min-content 1fr;
+
+  &__summary {
+    grid-template-areas: var(--summary-areas);
+    grid-template-columns: var(--summary-columns);
+
+    &:not(:has(.af-accordion__tag-date-container)) {
+      --summary-areas: "title-container value arrow";
+      --summary-columns: 1fr repeat(2, auto);
+    }
+
+    &:not(:has(.af-accordion__value)) {
+      --summary-areas: "tag-date-container title-container arrow";
+      --summary-columns: auto 1fr auto;
+
+      &:not(:has(.af-accordion__tag-date-container)) {
+        --summary-areas: "title-container arrow";
+        --summary-columns: 1fr auto;
+      }
+    }
+
+    .af-accordion {
+      &__icon {
+        display: grid;
+        grid-area: icon;
+        align-items: center;
+      }
+
+      &__title-container {
+        display: grid;
+        grid-area: title-container;
+        grid-template: var(--title-container-areas);
+        grid-template-columns: var(--title-container-columns);
+        gap: 0.125rem 1rem;
+
+        &:not(:has(.af-accordion__icon)) {
+          --title-container-areas: "title" "subtitle";
+          --title-container-columns: 1fr;
+
+          column-gap: 0;
+        }
+
+        &:not(:has(.af-accordion__subtitle)) {
+          --title-container-areas: "icon title";
+
+          row-gap: 0;
+
+          &:not(:has(.af-accordion__icon)) {
+            --title-container-areas: "title";
+          }
+        }
+
+        .af-accordion {
+          &__title {
+            grid-area: title;
+          }
+
+          &__subtitle {
+            grid-area: subtitle;
+            font-size: 1rem;
+            font-weight: 400;
+            line-height: 1.25rem;
+            color: common.$color-gray-700;
+          }
+        }
+      }
+
+      &__value {
+        display: grid;
+        min-width: 9.375rem;
+        grid-area: value;
+        justify-items: center;
+        color: common.$color-green-600;
+      }
+
+      &__tag-date-container {
+        display: grid;
+        padding-right: 3.93rem;
+        grid-area: tag-date-container;
+        grid-template: "tag" "date";
+        row-gap: 0.5rem;
+
+        .af-accordion {
+          &__tag-container {
+            grid-area: tag;
+            justify-items: center;
+            text-align: center;
+
+            .af-tag {
+              cursor: inherit;
+            }
+          }
+
+          &__date {
+            display: grid;
+            grid-area: date;
+            align-items: center;
+            text-align: center;
+            color: common.$color-gray-700;
+          }
+        }
+      }
+    }
+
+    &--title-first {
+      --summary-areas: "title-container tag-date-container value arrow";
+      --summary-columns: repeat(3, auto) min-content;
+
+      &:not(:has(.af-accordion__value)) {
+        --summary-areas: "title-container tag-date-container arrow";
+        --summary-columns: repeat(2, auto) min-content;
+      }
+
+      .af-accordion {
+        &__tag-date-container {
+          padding: 0;
+          grid-template: "tag date";
+          column-gap: inherit;
+
+          .af-accordion {
+            &__tag-container {
+              padding: 0 1.688rem;
+            }
+
+            &__date {
+              padding: 0 3.125rem;
+            }
+          }
+        }
+
+        &__value {
+          min-width: auto;
+        }
+      }
+    }
+
+    .af-accordion__tag-date-container:has(> :only-child) {
+      row-gap: 0;
+    }
+  }
+
+  @media (width <= #{common.$breakpoint-md}) {
+    .af-accordion__summary--title-first
+      .af-accordion__tag-date-container
+      .af-accordion {
+      &__tag-container,
+      &__date {
+        padding: 0;
+      }
+    }
+  }
+
+  @media (width <= #{common.$breakpoint-sm}) {
+    .af-accordion__summary {
+      --summary-areas: "tag-date-container arrow" "title-container arrow"
+        "value arrow";
+      --summary-columns: 1fr;
+
+      column-gap: 0;
+
+      .af-accordion {
+        &__title-container {
+          justify-content: start;
+
+          .af-accordion {
+            &__subtitle {
+              font-size: 0.875rem;
+              line-height: 1.1rem;
+            }
+          }
+        }
+
+        &__tag-date-container {
+          display: flex;
+          gap: 0.5rem;
+        }
+
+        &__value {
+          justify-content: start;
+        }
+      }
+
+      &--title-first {
+        --summary-areas: "icon title-container arrow"
+          "icon tag-date-container arrow" "icon value arrow";
+        --summary-columns: auto 1fr auto;
+
+        column-gap: 0.75rem;
+
+        &:not(:has(.af-accordion__icon)) {
+          --summary-areas: "title-container arrow" "tag-date-container arrow"
+            "value arrow";
+          --summary-columns: 1fr auto;
+        }
+
+        &:not(:has(.af-accordion__tag-date-container)) {
+          --summary-areas: "icon title-container arrow" "icon value arrow";
+        }
+
+        &:not(:has(.af-accordion__value)) {
+          --summary-areas: "icon title-container arrow"
+            "icon tag-date-container arrow";
+        }
+
+        &:not(
+            :has(.af-accordion__icon),
+            :has(.af-accordion__tag-date-container)
+          ) {
+          --summary-areas: "title-container arrow" "value arrow";
+        }
+
+        &:not(
+            :has(.af-accordion__tag-date-container),
+            :has(.af-accordion__value)
+          ) {
+          --summary-areas: "icon title-container arrow";
+          --summary-columns: auto 1fr auto;
+        }
+
+        &:not(:has(.af-accordion__icon), :has(.af-accordion__value)) {
+          --summary-areas: "title-container arrow" "tag-date-container arrow";
+        }
+
+        &:not(
+            :has(.af-accordion__icon),
+            :has(.af-accordion__tag-date-container),
+            :has(.af-accordion__value)
+          ) {
+          --summary-areas: "title-container arrow";
+          --summary-columns: 1fr auto;
+        }
+      }
+    }
+  }
+}

package/dist/AccordionCore/AccordionCore.css

@@ -0,0 +1 @@
+.af-accordion{font-family:Source Sans Pro,arial,sans-serif}.af-accordion__summary{align-items:center;color:#333;column-gap:2.5rem;cursor:pointer;display:grid;font-size:1.125rem;font-weight:600;grid-template-areas:"summary arrow";grid-template-columns:1fr auto;line-height:1.4rem;padding:1rem}.af-accordion__summary p{margin:0}.af-accordion__summary:first-child{grid-area:summary}.af-accordion__summary:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='none' viewBox='0 0 32 32'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2300008F' d='m24 13.333-1.88-1.88L16 17.56l-6.12-6.107L8 13.333l8 8z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M32 0v32H0V0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");background-repeat:no-repeat;background-size:100%;content:"";display:inline-block;flex-shrink:0;grid-area:arrow;height:2rem;margin-left:auto;transition:transform .2s ease-in-out;width:2rem}.af-accordion[open]>.af-accordion__summary:after{transform:rotate(180deg)}.af-accordion__separator{border:0;border-top:1px solid #e9ecf2;margin:0}.af-accordion__content{color:#5f5f5f;font-size:1rem;font-weight:400;line-height:1.25rem;padding:1rem}@media (width <= 667px){.af-accordion__summary{font-size:1rem;font-weight:600;line-height:1.25rem;row-gap:.25rem}.af-accordion__content{font-size:.875rem;line-height:1.1rem}}

package/dist/AccordionCore/AccordionCore.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/AccordionCore/AccordionCore.scss%23sass","../../src/AccordionCore/AccordionCore.scss"],"names":[],"mappings":"AAEA,cACE,4CCDF,CDGE,uBAKE,kBAAA,CAKA,UAAA,CAJA,iBAAA,CAKA,cAAA,CAVA,YAAA,CAMA,kBAAA,CACA,eAAA,CALA,mCAAA,CACA,8BAAA,CAKA,kBAAA,CAPA,YCQJ,CDGI,yBACE,QCDN,CDII,mCACE,iBCFN,CDKI,6BAOE,uYAAA,CACA,2BAAA,CACA,oBAAA,CAEA,UAAA,CAVA,oBAAA,CAKA,aAAA,CADA,eAAA,CAFA,WAAA,CACA,gBAAA,CAMA,oCAAA,CARA,UCMN,CDOE,iDACE,wBCLJ,CDQE,yBAEE,QAAA,CACA,4BAAA,CAFA,QCJJ,CDSE,uBAKE,aAAA,CAHA,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,YCHJ,CDWA,wBAEI,uBAEE,cAAA,CACA,eAAA,CACA,mBAAA,CAHA,cCNJ,CACF,uBDYM,iBAAA,CCVN,kBACE,CACF","file":"AccordionCore.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-accordion {\n  font-family: common.$font-family-base;\n\n  &__summary {\n    display: grid;\n    padding: 1rem;\n    grid-template-areas: \"summary arrow\";\n    grid-template-columns: 1fr auto;\n    align-items: center;\n    column-gap: 2.5rem;\n    font-size: 1.125rem;\n    font-weight: 600;\n    line-height: 1.4rem;\n    color: common.$color-gray-900;\n    cursor: pointer;\n\n    p {\n      margin: 0;\n    }\n\n    &:first-child {\n      grid-area: summary;\n    }\n\n    &::after {\n      display: inline-block;\n      width: 2rem;\n      height: 2rem;\n      margin-left: auto;\n      grid-area: arrow;\n      flex-shrink: 0;\n      background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n      background-repeat: no-repeat;\n      background-size: 100%;\n      transition: transform 0.2s ease-in-out;\n      content: \"\";\n    }\n  }\n\n  &[open] > .af-accordion__summary::after {\n    transform: rotate(180deg);\n  }\n\n  &__separator {\n    margin: 0;\n    border: 0;\n    border-top: 1px solid common.$color-gray-300;\n  }\n\n  &__content {\n    padding: 1rem;\n    font-size: 1rem;\n    font-weight: 400;\n    line-height: 1.25rem;\n    color: common.$color-gray-700;\n  }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n  .af-accordion {\n    &__summary {\n      row-gap: 0.25rem;\n      font-size: 1rem;\n      font-weight: 600;\n      line-height: 1.25rem;\n    }\n\n    &__content {\n      font-size: 0.875rem;\n      line-height: 1.1rem;\n    }\n  }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-accordion {\n  font-family: common.$font-family-base;\n\n  &__summary {\n    display: grid;\n    padding: 1rem;\n    grid-template-areas: \"summary arrow\";\n    grid-template-columns: 1fr auto;\n    align-items: center;\n    column-gap: 2.5rem;\n    font-size: 1.125rem;\n    font-weight: 600;\n    line-height: 1.4rem;\n    color: common.$color-gray-900;\n    cursor: pointer;\n\n    p {\n      margin: 0;\n    }\n\n    &:first-child {\n      grid-area: summary;\n    }\n\n    &::after {\n      display: inline-block;\n      width: 2rem;\n      height: 2rem;\n      margin-left: auto;\n      grid-area: arrow;\n      flex-shrink: 0;\n      background-image: url(\"data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A\");\n      background-repeat: no-repeat;\n      background-size: 100%;\n      transition: transform 0.2s ease-in-out;\n      content: \"\";\n    }\n  }\n\n  &[open] > .af-accordion__summary::after {\n    transform: rotate(180deg);\n  }\n\n  &__separator {\n    margin: 0;\n    border: 0;\n    border-top: 1px solid common.$color-gray-300;\n  }\n\n  &__content {\n    padding: 1rem;\n    font-size: 1rem;\n    font-weight: 400;\n    line-height: 1.25rem;\n    color: common.$color-gray-700;\n  }\n}\n\n@media (width <= #{common.$breakpoint-sm}) {\n  .af-accordion {\n    &__summary {\n      row-gap: 0.25rem;\n      font-size: 1rem;\n      font-weight: 600;\n      line-height: 1.25rem;\n    }\n\n    &__content {\n      font-size: 0.875rem;\n      line-height: 1.1rem;\n    }\n  }\n}\n"]}

package/dist/AccordionCore/AccordionCore.scss

@@ -0,0 +1,75 @@
+@use "../common/common.scss" as common;
+
+.af-accordion {
+  font-family: common.$font-family-base;
+
+  &__summary {
+    display: grid;
+    padding: 1rem;
+    grid-template-areas: "summary arrow";
+    grid-template-columns: 1fr auto;
+    align-items: center;
+    column-gap: 2.5rem;
+    font-size: 1.125rem;
+    font-weight: 600;
+    line-height: 1.4rem;
+    color: common.$color-gray-900;
+    cursor: pointer;
+
+    p {
+      margin: 0;
+    }
+
+    &:first-child {
+      grid-area: summary;
+    }
+
+    &::after {
+      display: inline-block;
+      width: 2rem;
+      height: 2rem;
+      margin-left: auto;
+      grid-area: arrow;
+      flex-shrink: 0;
+      background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cg%20clip-path%3D%22url(%23clip0_14583_27882)%22%3E%0A%3Cpath%20d%3D%22M24%2013.3331L22.12%2011.4531L16%2017.5598L9.88%2011.4531L8%2013.3331L16%2021.3331L24%2013.3331Z%22%20fill%3D%22%2300008F%22%2F%3E%0A%3C%2Fg%3E%0A%3Cdefs%3E%0A%3CclipPath%20id%3D%22clip0_14583_27882%22%3E%0A%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%20transform%3D%22matrix(0%201%20-1%200%2032%200)%22%2F%3E%0A%3C%2FclipPath%3E%0A%3C%2Fdefs%3E%0A%3C%2Fsvg%3E%0A");
+      background-repeat: no-repeat;
+      background-size: 100%;
+      transition: transform 0.2s ease-in-out;
+      content: "";
+    }
+  }
+
+  &[open] > .af-accordion__summary::after {
+    transform: rotate(180deg);
+  }
+
+  &__separator {
+    margin: 0;
+    border: 0;
+    border-top: 1px solid common.$color-gray-300;
+  }
+
+  &__content {
+    padding: 1rem;
+    font-size: 1rem;
+    font-weight: 400;
+    line-height: 1.25rem;
+    color: common.$color-gray-700;
+  }
+}
+
+@media (width <= #{common.$breakpoint-sm}) {
+  .af-accordion {
+    &__summary {
+      row-gap: 0.25rem;
+      font-size: 1rem;
+      font-weight: 600;
+      line-height: 1.25rem;
+    }
+
+    &__content {
+      font-size: 0.875rem;
+      line-height: 1.1rem;
+    }
+  }
+}

package/dist/Alert/Alert.css

@@ -0,0 +1 @@
+.af-alert{background-color:#fff;border-radius:12px;display:flex;flex:1 1;font-family:Source Sans Pro,arial,sans-serif;padding:1rem}.af-alert .af-alert__icon{aspect-ratio:1;flex-shrink:0;margin-right:1rem}.af-alert--information{border:1px solid #00008f}.af-alert--information .af-alert__icon{color:#00008f;transform:rotate(180deg);fill:#00008f}.af-alert--information .af-alert__title{color:#00008f}.af-alert--error{border:1px solid #c91432}.af-alert--error .af-alert__icon{color:#c91432;fill:#c91432}.af-alert--error .af-alert__title{color:#c91432}.af-alert--neutral{border:1px solid #5f5f5f}.af-alert--neutral .af-alert__icon{color:#5f5f5f;fill:#5f5f5f}.af-alert--neutral .af-alert__title{color:#5f5f5f}.af-alert--warning{border:1px solid #c94e14}.af-alert--warning .af-alert__icon{color:#c94e14;fill:#c94e14}.af-alert--warning .af-alert__title{color:#c94e14}.af-alert--validation{border:1px solid #118635}.af-alert--validation .af-alert__icon{color:#118635;fill:#118635}.af-alert--validation .af-alert__title{color:#118635}.af-alert .af-alert-client__content{width:100%}.af-alert .af-alert-client__content .af-alert__action{display:flex;justify-content:end;text-align:right}.af-alert .af-alert-client__content .af-alert__title{font-weight:600;line-height:1.5rem;padding-bottom:.25rem}.af-alert *{font-size:1.125rem;font-weight:400;margin:0}

package/dist/Alert/Alert.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Alert/Alert.scss%23sass","../../src/common/common.scss","../../src/Alert/Alert.scss"],"names":[],"mappings":"AAEA,UAME,qBAAA,CAHA,kBAAA,CAFA,YAAA,CAGA,QAAA,CACA,4CCLuB,CCAzB,YAKA,CFGE,0BACE,cAAA,CAEA,aAAA,CADA,iBEAJ,CFIE,uBACE,wBEFJ,CFII,uCACE,aAAA,CACA,wBAAA,CACA,YEFN,CFKI,wCACE,aEHN,CFOE,iBACE,wBELJ,CFOI,iCACE,aAAA,CACA,YELN,CFQI,kCACE,aENN,CFUE,mBACE,wBERJ,CFUI,mCACE,aAAA,CACA,YERN,CFWI,oCACE,aETN,CFaE,mBACE,wBEXJ,CFaI,mCACE,aAAA,CACA,YEXN,CFcI,oCACE,aEZN,CFgBE,sBACE,wBEdJ,CFgBI,sCACE,aCpCY,CDqCZ,YEdN,CFiBI,uCACE,aEfN,CFmBE,oCACE,UEjBJ,CFmBI,sDACE,YAAA,CACA,mBAAA,CACA,gBEjBN,CFoBI,qDAEE,eAAA,CACA,kBAAA,CAFA,qBEhBN,CFsBE,YAEE,kBAAA,CACA,eAAA,CAFA,QElBJ","file":"Alert.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-alert {\n  display: flex;\n  padding: 1rem;\n  border-radius: 12px;\n  flex: 1 1 0;\n  font-family: common.$font-family-base;\n  background-color: white;\n\n  .af-alert__icon {\n    aspect-ratio: 1;\n    margin-right: 1rem;\n    flex-shrink: 0;\n  }\n\n  &--information {\n    border: 1px solid common.$color-axa;\n\n    .af-alert__icon {\n      color: common.$color-axa;\n      transform: rotate(180deg);\n      fill: common.$color-axa;\n    }\n\n    .af-alert__title {\n      color: common.$color-axa;\n    }\n  }\n\n  &--error {\n    border: 1px solid common.$color-red-700;\n\n    .af-alert__icon {\n      color: common.$color-red-700;\n      fill: common.$color-red-700;\n    }\n\n    .af-alert__title {\n      color: common.$color-red-700;\n    }\n  }\n\n  &--neutral {\n    border: 1px solid common.$color-gray;\n\n    .af-alert__icon {\n      color: common.$color-gray;\n      fill: common.$color-gray;\n    }\n\n    .af-alert__title {\n      color: common.$color-gray;\n    }\n  }\n\n  &--warning {\n    border: 1px solid common.$color-btn-business;\n\n    .af-alert__icon {\n      color: common.$color-btn-business;\n      fill: common.$color-btn-business;\n    }\n\n    .af-alert__title {\n      color: common.$color-btn-business;\n    }\n  }\n\n  &--validation {\n    border: 1px solid common.$color-green-600;\n\n    .af-alert__icon {\n      color: common.$color-green-600;\n      fill: common.$color-green-600;\n    }\n\n    .af-alert__title {\n      color: common.$color-green-600;\n    }\n  }\n\n  .af-alert-client__content {\n    width: 100%;\n\n    .af-alert__action {\n      display: flex;\n      justify-content: end;\n      text-align: right;\n    }\n\n    .af-alert__title {\n      padding-bottom: 0.25rem;\n      font-weight: 600;\n      line-height: 1.5rem;\n    }\n  }\n\n  * {\n    margin: 0;\n    font-size: 1.125rem;\n    font-weight: 400;\n  }\n}\n","@import \"./mixins\";\n\n$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n","@use \"../common/common\" as common;\n\n.af-alert {\n  display: flex;\n  padding: 1rem;\n  border-radius: 12px;\n  flex: 1 1 0;\n  font-family: common.$font-family-base;\n  background-color: white;\n\n  .af-alert__icon {\n    aspect-ratio: 1;\n    margin-right: 1rem;\n    flex-shrink: 0;\n  }\n\n  &--information {\n    border: 1px solid common.$color-axa;\n\n    .af-alert__icon {\n      color: common.$color-axa;\n      transform: rotate(180deg);\n      fill: common.$color-axa;\n    }\n\n    .af-alert__title {\n      color: common.$color-axa;\n    }\n  }\n\n  &--error {\n    border: 1px solid common.$color-red-700;\n\n    .af-alert__icon {\n      color: common.$color-red-700;\n      fill: common.$color-red-700;\n    }\n\n    .af-alert__title {\n      color: common.$color-red-700;\n    }\n  }\n\n  &--neutral {\n    border: 1px solid common.$color-gray;\n\n    .af-alert__icon {\n      color: common.$color-gray;\n      fill: common.$color-gray;\n    }\n\n    .af-alert__title {\n      color: common.$color-gray;\n    }\n  }\n\n  &--warning {\n    border: 1px solid common.$color-btn-business;\n\n    .af-alert__icon {\n      color: common.$color-btn-business;\n      fill: common.$color-btn-business;\n    }\n\n    .af-alert__title {\n      color: common.$color-btn-business;\n    }\n  }\n\n  &--validation {\n    border: 1px solid common.$color-green-600;\n\n    .af-alert__icon {\n      color: common.$color-green-600;\n      fill: common.$color-green-600;\n    }\n\n    .af-alert__title {\n      color: common.$color-green-600;\n    }\n  }\n\n  .af-alert-client__content {\n    width: 100%;\n\n    .af-alert__action {\n      display: flex;\n      justify-content: end;\n      text-align: right;\n    }\n\n    .af-alert__title {\n      padding-bottom: 0.25rem;\n      font-weight: 600;\n      line-height: 1.5rem;\n    }\n  }\n\n  * {\n    margin: 0;\n    font-size: 1.125rem;\n    font-weight: 400;\n  }\n}\n"]}

package/dist/Alert/Alert.scss

@@ -0,0 +1,104 @@
+@use "../common/common" as common;
+
+.af-alert {
+  display: flex;
+  padding: 1rem;
+  border-radius: 12px;
+  flex: 1 1 0;
+  font-family: common.$font-family-base;
+  background-color: white;
+
+  .af-alert__icon {
+    aspect-ratio: 1;
+    margin-right: 1rem;
+    flex-shrink: 0;
+  }
+
+  &--information {
+    border: 1px solid common.$color-axa;
+
+    .af-alert__icon {
+      color: common.$color-axa;
+      transform: rotate(180deg);
+      fill: common.$color-axa;
+    }
+
+    .af-alert__title {
+      color: common.$color-axa;
+    }
+  }
+
+  &--error {
+    border: 1px solid common.$color-red-700;
+
+    .af-alert__icon {
+      color: common.$color-red-700;
+      fill: common.$color-red-700;
+    }
+
+    .af-alert__title {
+      color: common.$color-red-700;
+    }
+  }
+
+  &--neutral {
+    border: 1px solid common.$color-gray;
+
+    .af-alert__icon {
+      color: common.$color-gray;
+      fill: common.$color-gray;
+    }
+
+    .af-alert__title {
+      color: common.$color-gray;
+    }
+  }
+
+  &--warning {
+    border: 1px solid common.$color-btn-business;
+
+    .af-alert__icon {
+      color: common.$color-btn-business;
+      fill: common.$color-btn-business;
+    }
+
+    .af-alert__title {
+      color: common.$color-btn-business;
+    }
+  }
+
+  &--validation {
+    border: 1px solid common.$color-green-600;
+
+    .af-alert__icon {
+      color: common.$color-green-600;
+      fill: common.$color-green-600;
+    }
+
+    .af-alert__title {
+      color: common.$color-green-600;
+    }
+  }
+
+  .af-alert-client__content {
+    width: 100%;
+
+    .af-alert__action {
+      display: flex;
+      justify-content: end;
+      text-align: right;
+    }
+
+    .af-alert__title {
+      padding-bottom: 0.25rem;
+      font-weight: 600;
+      line-height: 1.5rem;
+    }
+  }
+
+  * {
+    margin: 0;
+    font-size: 1.125rem;
+    font-weight: 400;
+  }
+}

package/dist/Button/Button.css

@@ -0,0 +1 @@
+.af-btn-client{align-items:center;background-color:#00008f;border:0;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-family:Source Sans Pro,arial,sans-serif;font-weight:600;gap:1rem;justify-content:center;min-height:3.5rem;padding:.8rem 1.2rem;transition-duration:.2s;transition-property:width,height,border,color,background-color,outline,box-shadow;transition-timing-function:linear}.af-btn-client:hover{background-color:#000072;color:#fff}.af-btn-client:active,.af-btn-client:focus{background-color:#3333a5;color:#fff;outline:none}.af-btn-client:focus-visible{outline:2px solid #36f;outline-offset:3px}.af-btn-client>svg{aspect-ratio:1}.af-btn-client--ghost{background-color:initial;color:#00008f;gap:.25rem;min-height:auto;min-width:auto;padding:0}.af-btn-client--ghost:hover{background-color:initial;color:#000072}.af-btn-client--ghost:active,.af-btn-client--ghost:focus{background-color:initial;color:#3333a5}.af-btn-client--primary-business{background-color:#c94e14}.af-btn-client--primary-business:hover{background-color:#a8391c}.af-btn-client--primary-business:focus{background-color:#df7e65}.af-btn-client--tertiary{background-color:#eef;color:#00008f}.af-btn-client--tertiary:hover{background-color:#e4e4ff;color:#00008f}.af-btn-client--tertiary:active,.af-btn-client--tertiary:focus{background-color:#f8f8ff;color:#00008f}.af-btn-client--secondary{background-color:#fff;box-shadow:inset 0 0 0 1px #00008f;color:#00008f}.af-btn-client--secondary:active,.af-btn-client--secondary:focus,.af-btn-client--secondary:hover{background-color:#fff;box-shadow:inset 0 0 0 2px #000072;color:#000072}.af-btn-client--secondary:active{background-color:#f8f8ff}.af-btn-client--secondary-error{background-color:#fff;box-shadow:inset 0 0 0 1px #c91432;color:#c91432}.af-btn-client--secondary-error:active,.af-btn-client--secondary-error:focus,.af-btn-client--secondary-error:hover{background-color:#fff;box-shadow:inset 0 0 0 2px #a11028;color:#a11028}.af-btn-client--secondary-error:active{background-color:#fff3f5}.af-btn-client__wrapper{align-items:center;display:flex;justify-content:center;line-height:1}.af-btn-client:disabled,.af-btn-client[aria-disabled=true]{background-color:#e9ecf2;box-shadow:none;color:#999;cursor:not-allowed}.af-btn-client:disabled:focus,.af-btn-client:disabled:hover,.af-btn-client[aria-disabled=true]:focus,.af-btn-client[aria-disabled=true]:hover{background-color:#e9ecf2;border-color:#0000;color:#999}

package/dist/Button/Button.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Button/Button.scss%23sass","../../src/common/common.scss","../../src/Button/Button.scss"],"names":[],"mappings":"AAEA,eAME,kBAAA,CAMA,wBAAA,CARA,QAAA,CACA,iBAAA,CAMA,UAAA,CAMA,cAAA,CAhBA,YAAA,CAQA,4CCTuB,CDUvB,eAAA,CAFA,QAAA,CADA,sBAAA,CEPF,iBAAA,CFGE,oBAAA,CAUA,uBAAA,CACA,iFAAA,CAEA,iCEDF,CFIE,qBAEE,wBCRW,CDOX,UEDJ,CFKE,2CAGE,wBAAA,CADA,UAAA,CAEA,YEJJ,CFOE,6BACE,sBAAA,CACA,kBELJ,CFQE,mBACE,cENJ,CFSE,sBAME,wBAAA,CADA,aAAA,CADA,UAAA,CAFA,eAAA,CADA,cAAA,CAEA,SEJJ,CFSI,4BAEE,wBAAA,CADA,aENN,CFUI,yDAGE,wBAAA,CADA,aERN,CFaE,iCACE,wBEXJ,CFaI,uCACE,wBEXN,CFcI,uCACE,wBEZN,CFgBE,yBAEE,qBClDoB,CDiDpB,aEbJ,CFgBI,+BAEE,wBAAA,CADA,aEbN,CFiBI,+DAGE,wBAAA,CADA,aEfN,CFoBE,0BAEE,qBClFU,CDmFV,kCAAA,CAFA,aEhBJ,CFoBI,iGAIE,qBAAA,CACA,kCAAA,CAFA,aElBN,CFuBI,iCACE,wBErBN,CFyBE,gCAEE,qBAAA,CACA,kCAAA,CAFA,aErBJ,CFyBI,mHAIE,qBAAA,CACA,kCAAA,CAFA,aEvBN,CF4BI,uCACE,wBE1BN,CF8BE,wBAEE,kBAAA,CADA,YAAA,CAEA,sBAAA,CACA,aE5BJ,CF+BE,2DAGE,wBAAA,CACA,eAAA,CAFA,UAAA,CAGA,kBE9BJ,CFgCI,8IAIE,wBChHW,CD8GX,kBAAA,CACA,UE9BN","file":"Button.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-btn-client {\n  display: flex;\n  min-height: 3.5rem;\n  padding: 0.8rem 1.2rem;\n  border: 0;\n  border-radius: 8px;\n  align-items: center;\n  justify-content: center;\n  gap: 1rem;\n  font-family: common.$font-family-base;\n  font-weight: 600;\n  color: common.$color-white;\n  background-color: common.$color-axa;\n  transition-duration: common.$transition-duration;\n  transition-property: width, height, border, color, background-color, outline,\n    box-shadow;\n  transition-timing-function: linear;\n  cursor: pointer;\n\n  &:hover {\n    color: common.$color-white;\n    background-color: common.$color-blue-1;\n  }\n\n  &:active,\n  &:focus {\n    color: common.$color-white;\n    background-color: common.$color-btn-light;\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: 2px solid common.$color-blue-3;\n    outline-offset: 3px;\n  }\n\n  & > svg {\n    aspect-ratio: 1;\n  }\n\n  &--ghost {\n    min-width: auto;\n    min-height: auto;\n    padding: 0;\n    gap: 0.25rem;\n    color: common.$color-axa;\n    background-color: transparent;\n\n    &:hover {\n      color: common.$color-blue-1;\n      background-color: transparent;\n    }\n\n    &:focus,\n    &:active {\n      color: common.$color-btn-light;\n      background-color: transparent;\n    }\n  }\n\n  &--primary-business {\n    background-color: common.$color-btn-business;\n\n    &:hover {\n      background-color: common.$color-btn-business-dark;\n    }\n\n    &:focus {\n      background-color: common.$color-btn-business-light;\n    }\n  }\n\n  &--tertiary {\n    color: common.$color-axa;\n    background-color: common.$color-btn-tertiary-bg;\n\n    &:hover {\n      color: common.$color-axa;\n      background-color: common.$color-btn-tertiary-bg-darker;\n    }\n\n    &:focus,\n    &:active {\n      color: common.$color-axa;\n      background-color: common.$color-btn-tertiary-bg-lighter;\n    }\n  }\n\n  &--secondary {\n    color: common.$color-axa;\n    background-color: common.$color-white;\n    box-shadow: 0 0 0 1px common.$color-axa inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: common.$color-blue-1;\n      background-color: common.$color-white;\n      box-shadow: 0 0 0 2px common.$color-blue-1 inset;\n    }\n\n    &:active {\n      background-color: common.$color-blue-2;\n    }\n  }\n\n  &--secondary-error {\n    color: common.$color-red-700;\n    background-color: common.$color-white;\n    box-shadow: 0 0 0 1px common.$color-red-700 inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: common.$color-btn-error-text;\n      background-color: common.$color-white;\n      box-shadow: 0 0 0 2px common.$color-btn-error-text inset;\n    }\n\n    &:active {\n      background-color: common.$color-btn-error-bg;\n    }\n  }\n\n  &__wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n  }\n\n  &:disabled,\n  &[aria-disabled=\"true\"] {\n    color: common.$color-btn-disabled-text;\n    background-color: common.$color-gray-300;\n    box-shadow: none;\n    cursor: not-allowed;\n\n    &:hover,\n    &:focus {\n      border-color: transparent;\n      color: common.$color-btn-disabled-text;\n      background-color: common.$color-gray-300;\n    }\n  }\n}\n","@import \"./mixins\";\n\n$font-family-sans-serif: \"Source Sans Pro\", arial, sans-serif !default;\n$font-family-serif: georgia, times, \"Times New Roman\", serif !default;\n$font-family-base: $font-family-sans-serif !default;\n$font-family-publico-bold: \"Publico Headline Bold\" !default;\n$font-family-publico: \"Publico Headline\" !default;\n// colors\n\n$color-axa: #00008f !default;\n$color-white: #fff !default;\n$color-black: #000 !default;\n$color-red: #ff1721 !default;\n$color-gray: #5f5f5f !default;\n$color-red-700: #c91432 !default;\n$color-blue-1: #000072 !default;\n$color-blue-2: #f8f8ff !default;\n$color-blue-3: #36f !default;\n$color-btn-light: #3333a5 !default;\n$color-btn-business: #c94e14 !default;\n$color-btn-business-dark: #a8391c !default;\n$color-btn-business-light: #df7e65 !default;\n$color-btn-disabled-text: #999 !default;\n$color-btn-disabled-border: #e5e5e5 !default;\n$color-btn-error-text: #a11028 !default;\n$color-btn-error-bg: #fff3f5 !default;\n$color-btn-tertiary-bg: #eef !default;\n$color-btn-tertiary-bg-darker: #e4e4ff !default;\n$color-btn-tertiary-bg-lighter: #f8f8ff !default;\n$color-oceanBlue: #4976ba !default;\n$color-gray-1: #ccc !default;\n$color-gray-200: #f3f3f3;\n$color-gray-300: #e9ecf2;\n$color-gray-400: #e5e5e5;\n$color-gray-500: #999;\n$color-gray-700: #5f5f5f;\n$color-gray-900: #333 !default;\n$color-green-600: #118635 !default;\n$color-border: #f3f3f3 !default;\n$color-focus: #36f !default;\n\n// others\n\n$default-border-radius: 4px !default;\n\n$transition-duration: 0.2s !default;\n\n// spacing\n\n$sizing-u0: 0 !default;\n$sizing-u05: 0.4rem !default;\n$sizing-u1: 0.8rem !default;\n$sizing-u2: 1.6rem !default;\n$sizing-u3: 2.4rem !default;\n$sizing-u4: 3.2rem !default;\n$sizing-u5: 4rem !default;\n$sizing-u6: 4.8rem !default;\n$sizing-u7: 5.6rem !default;\n$sizing-u8: 6.4rem !default;\n$sizing-u9: 7.2rem !default;\n$sizing-u10: 8rem !default;\n$spacing-u0: 0 !default;\n$spacing-u05: 0.4rem !default;\n$spacing-u1: 0.8rem !default;\n$spacing-u2: 1.6rem !default;\n$spacing-u3: 2.4rem !default;\n$spacing-u4: 3.2rem !default;\n$spacing-u5: 4rem !default;\n$spacing-u6: 4.8rem !default;\n$spacing-u7: 5.6rem !default;\n$spacing-u8: 6.4rem !default;\n$spacing-u9: 7.2rem !default;\n$spacing-u10: 8rem !default;\n$spacing-u11: 8.8rem !default;\n$spacing-u12: 9.6rem !default;\n$spacing-u13: 10.4rem !default;\n$spacing-u14: 11.2rem !default;\n$spacing-u15: 12rem !default;\n$spacing-u16: 12.8rem !default;\n$spacing-u17: 13.6rem !default;\n$spacing-u18: 14.4rem !default;\n$spacing-u19: 15.2rem !default;\n$spacing-u20: 16rem !default;\n$screen-size-668: s !default;\n$screen-size-1024: m !default;\n$screen-size-1200: oldl !default;\n$screen-size-1280: l !default;\n$screen-size-1540: oldxl !default;\n$screen-size-1600: xl !default;\n$screen-size-s: 668px !default;\n$screen-size-m: 1024px !default;\n$screen-size-l: 1280px !default;\n$screen-size-xl: 1600px !default;\n$screen-size-oldl: 1200px !default;\n$screen-size-oldxl: 1540px !default;\n\n$error-custom-border: #d18e8e !default;\n$error-custom-bg: #ffbfbf !default;\n\n$color-alertDanger-colorBorder: #c8b282 !default;\n$color-alertDanger-bgColor: #f1d596 !default;\n\n// breakpoints\n\n$breakpoint-xs: 0 !default;\n$breakpoint-sm: 667px !default;\n$breakpoint-md: 1023px !default;\n$breakpoint-lg: 1279px !default;\n$breakpoint-xl: 1599px !default;\n","@use \"../common/common\" as common;\n\n.af-btn-client {\n  display: flex;\n  min-height: 3.5rem;\n  padding: 0.8rem 1.2rem;\n  border: 0;\n  border-radius: 8px;\n  align-items: center;\n  justify-content: center;\n  gap: 1rem;\n  font-family: common.$font-family-base;\n  font-weight: 600;\n  color: common.$color-white;\n  background-color: common.$color-axa;\n  transition-duration: common.$transition-duration;\n  transition-property: width, height, border, color, background-color, outline,\n    box-shadow;\n  transition-timing-function: linear;\n  cursor: pointer;\n\n  &:hover {\n    color: common.$color-white;\n    background-color: common.$color-blue-1;\n  }\n\n  &:active,\n  &:focus {\n    color: common.$color-white;\n    background-color: common.$color-btn-light;\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: 2px solid common.$color-blue-3;\n    outline-offset: 3px;\n  }\n\n  & > svg {\n    aspect-ratio: 1;\n  }\n\n  &--ghost {\n    min-width: auto;\n    min-height: auto;\n    padding: 0;\n    gap: 0.25rem;\n    color: common.$color-axa;\n    background-color: transparent;\n\n    &:hover {\n      color: common.$color-blue-1;\n      background-color: transparent;\n    }\n\n    &:focus,\n    &:active {\n      color: common.$color-btn-light;\n      background-color: transparent;\n    }\n  }\n\n  &--primary-business {\n    background-color: common.$color-btn-business;\n\n    &:hover {\n      background-color: common.$color-btn-business-dark;\n    }\n\n    &:focus {\n      background-color: common.$color-btn-business-light;\n    }\n  }\n\n  &--tertiary {\n    color: common.$color-axa;\n    background-color: common.$color-btn-tertiary-bg;\n\n    &:hover {\n      color: common.$color-axa;\n      background-color: common.$color-btn-tertiary-bg-darker;\n    }\n\n    &:focus,\n    &:active {\n      color: common.$color-axa;\n      background-color: common.$color-btn-tertiary-bg-lighter;\n    }\n  }\n\n  &--secondary {\n    color: common.$color-axa;\n    background-color: common.$color-white;\n    box-shadow: 0 0 0 1px common.$color-axa inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: common.$color-blue-1;\n      background-color: common.$color-white;\n      box-shadow: 0 0 0 2px common.$color-blue-1 inset;\n    }\n\n    &:active {\n      background-color: common.$color-blue-2;\n    }\n  }\n\n  &--secondary-error {\n    color: common.$color-red-700;\n    background-color: common.$color-white;\n    box-shadow: 0 0 0 1px common.$color-red-700 inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: common.$color-btn-error-text;\n      background-color: common.$color-white;\n      box-shadow: 0 0 0 2px common.$color-btn-error-text inset;\n    }\n\n    &:active {\n      background-color: common.$color-btn-error-bg;\n    }\n  }\n\n  &__wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n  }\n\n  &:disabled,\n  &[aria-disabled=\"true\"] {\n    color: common.$color-btn-disabled-text;\n    background-color: common.$color-gray-300;\n    box-shadow: none;\n    cursor: not-allowed;\n\n    &:hover,\n    &:focus {\n      border-color: transparent;\n      color: common.$color-btn-disabled-text;\n      background-color: common.$color-gray-300;\n    }\n  }\n}\n"]}