{"version":3,"sources":["webpack://./src/components/notification/_notification.scss"],"names":[],"mappings":"AAiEA,iBAvDE,mDAAA,CACA,kEAAA,CACA,sEAAA,CACA,yBAAA,CACA,2BAAA,CACA,iDAAA,CAIA,yCAAA,CACA,qCAAA,CACA,qCAAA,CACA,mCAAA,CACA,aAAA,CACA,SAXF,CAeE,sCACE,4BAAA,CACA,mCAbJ,CAcI,kDACE,eAZN,CAoBM,sDACE,SAlBR,CAoBM,yDACE,eAlBR,CAmBQ,kEACE,yCAAA,CACA,8BAAA,CACA,mCAAA,CACA,iBAAA,CACA,kBAjBV,CAkBU,0EACE,8BAAA,CACA,iBAAA,CACA,2BAhBZ,CAkBU,uEACE,aAhBZ,CA4BA,yBACE,iBACE,0BAzBF,CACF","file":"notification.min.min.css","sourcesContent":["@import \"../../partial/scss/base\";\n\n@mixin notification {\n  @include notification-tokens;\n  @include notification-base;\n  @include notification-header;\n  @include notification-body;\n}\n\n@mixin notification-tokens {\n  --notification-background: var(--color-secondary-01);\n  --notification-shadow: 0 3px 6px rgba(var(--rgb-secondary-09), 0.16);\n  --notification-padding: var(--spacing-scale-2x) var(--spacing-scale-4x);\n  --notification-width: 50vw;\n  --notification-height: 100vh;\n  --notification-tab: var(--font-size-scale-down-01);\n}\n\n@mixin notification-base {\n  background: var(--notification-background);\n  box-shadow: var(--notification-shadow);\n  max-height: var(--notification-height);\n  max-width: var(--notification-width);\n  overflow: auto;\n  z-index: 1;\n}\n\n@mixin notification-header {\n  .notification-header {\n    border-bottom: 1px solid $color-secondary-04;\n    padding: var(--notification-padding);\n    *:last-child {\n      margin-bottom: 0;\n    }\n  }\n}\n\n@mixin notification-body {\n  .notification-body {\n    .#{$prefix}tab {\n      .tab-item {\n        padding: 0;\n      }\n      .tab-content {\n        overflow-y: auto;\n        .#{$prefix}item {\n          --interactive-rgb: var(--rgb-secondary-08);\n          --item-color: var(--text-color);\n          padding: var(--notification-padding);\n          position: relative;\n          white-space: normal;\n          .status {\n            left: var(--spacing-scale-base);\n            position: absolute;\n            top: var(--spacing-scale-3x);\n          }\n          span {\n            display: block;\n          }\n        }\n      }\n    }\n  }\n}\n\n.#{$prefix}notification {\n  @include notification;\n}\n\n@media (max-width: $grid-breakpoint-sm) {\n  .#{$prefix}notification {\n    --notification-width: 100vw;\n  }\n}\n"]}