{"version":3,"file":"static/css/500.58c40793.chunk.css","mappings":"AAAA,gBAGE,mCACE,sCACA,gCACA,gCACA,yBAGF,8BACE,sCAEA,uCACE,gBACA,6CAGF,YACE,iBAIJ,sCACE,qBACA,aACA,sBACA,SACA,cACA,aACA,wBAEA,kBACE,0BACA,aACA,eACA,gBACA,UACA,4CACA,iBACA,8BAEA,gCACE,eACA,cACA,sCAGF,kBACE,qBACA,cACA,iBACA,gBACA,wBACA,iBACA,qBACA,yBACA,6BAGF,2BACE,qCACA,iBACA,kBAKN,oCACE,qBACA,yDACA,8CAGE,wBACE,0BAIJ,kBACE,4BACA,eACA,aACA,eACA,kBACA,gBACA,4CACA,iBACA,gBACA,CACA,6BACA,kBACA,kDAEA,YAEE,+BAGF,oBACE,0BACA,kBACA,gBACA,iBACA,iBACA,mBACA,uBACA,8BACA,4BAGF,oCACE,kBACA,wCAGF,0CACE,+CAEA,WACE,qBACA,0CAIJ,2CACE,iDAEA,WACE,qBACA,kCAIJ,gBACE,sCAEA,mBACE,6CAEA,YACE,oDAEA,YACE,wCAMR,iBACE,WACA,sBAIJ,YACE,sBACA,SACA,mBACA,0BAEA,8BACE,kCACA,qBACA,aACA,eACA,UACA,8BAEA,iBACE,uCAIJ,QACE,WACA,6CAEA,SACE,sEAIJ,YAEE,gCAGF,QACE,sBAKN,cACE,cACA,CCnMJ,eACE,kBACA,WAEA,qCACE,YAGF,wBARF,eASI,mBACA,aACA,UACA,UAIJ,oBACE,wBACA,2CACA,uCACA,iCACA,0BACA,+BACA,eACA,mBACA,WAEA,0BACE,8BAIA,gEACE,cACA,aAIJ,iCACE,2BAGF,gDACE,aC7CJ,eAEA,YACE,eACA,UACA,eACA,iCAEA,gBACE,yDAEA,UACE,8BAIJ,QACE,yBAIJ,iBACE,yBACA,wEAEA,UAEE,sCAGF,uCACE,mBACA,6CAIA,WACE,oEAGF,iBACE,yBAKN,eACE,gBACE,yBAGF,6BACE,CADF,qBACE,QACA,gEAGF,UAEE,qDAGF,SACE,QACA,mBACA","sources":["plus/updates/index.scss","ui/atoms/search/index.scss","plus/search-filter/index.scss"],"sourcesContent":["@use \"../../ui/vars\" as *;\n\n.updates {\n  > header {\n    --plus-header: var(--updates-header);\n    --plus-mandala: var(--updates-mandala);\n    --plus-icon: var(--updates-icon);\n    --plus-link: var(--updates-link);\n  }\n\n  .reset-filters {\n    --button-action-transform: none;\n\n    .button-wrap {\n      font-size: var(--type-smaller-font-size);\n      font-weight: 400;\n    }\n\n    .button-wrap:before {\n      content: \"✖️\";\n    }\n  }\n\n  .group {\n    background: var(--background-secondary);\n    border-radius: 0.25rem;\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n    margin: 1rem 0;\n    padding: 1rem;\n\n    header {\n      align-items: center;\n      color: var(--text-primary);\n      display: flex;\n      flex-wrap: wrap;\n      font-weight: 500;\n      gap: 0.5rem;\n      letter-spacing: var(--header-letter-spacing);\n      line-height: 175%;\n\n      .icon {\n        background: var(--text-secondary);\n        height: 1.25rem;\n        width: 1.25rem;\n      }\n\n      .number-badge {\n        background: #{$mdn-color-light-theme-blue-10};\n        border-radius: 0.25rem;\n        color: #{$mdn-color-light-theme-blue-70};\n        font-size: 0.75rem;\n        font-weight: 700;\n        letter-spacing: 0.0938rem;\n        line-height: 120%;\n        padding: 0.25rem 0.5rem;\n        text-transform: uppercase;\n      }\n\n      time {\n        color: var(--text-secondary);\n        font-size: var(--type-tiny-font-size);\n        margin-left: auto;\n      }\n    }\n  }\n\n  details {\n    background: var(--background-primary);\n    border-radius: 0.25rem;\n    box-shadow: inset 0.25rem 0 0 var(--category-color-engage);\n\n    &[open] {\n      summary .icon-chevron {\n        transform: rotate(180deg);\n      }\n    }\n\n    summary {\n      align-items: center;\n      color: var(--text-secondary);\n      cursor: pointer;\n      display: flex;\n      flex-wrap: wrap;\n      font-size: 0.875rem;\n      font-weight: 500;\n      letter-spacing: var(--header-letter-spacing);\n      line-height: 175%;\n      list-style: none;\n      padding: 0.5rem 1rem;\n      padding-right: 3rem;\n      position: relative;\n\n      &::-webkit-details-marker {\n        // remove arrow from older versions of safari\n        display: none;\n      }\n\n      code {\n        border-radius: 0.25rem;\n        color: var(--text-primary);\n        font-size: 0.875rem;\n        font-weight: 400;\n        letter-spacing: 0;\n        line-height: 150%;\n        margin-right: 0.5rem;\n        overflow-wrap: anywhere;\n        padding: 0.25rem 0.25rem 0.125rem;\n      }\n\n      i {\n        font-size: var(--type-tiny-font-size);\n        margin-right: 1rem;\n      }\n\n      .status-added {\n        background-color: var(--background-success);\n\n        &:before {\n          content: \"✓\";\n          padding-right: 0.25rem;\n        }\n      }\n\n      .status-removed {\n        background-color: var(--background-critical);\n\n        &:before {\n          content: \"✗\";\n          padding-right: 0.25rem;\n        }\n      }\n\n      .status {\n        margin-left: auto;\n\n        svg {\n          margin-right: 0.75rem;\n\n          circle {\n            fill: #{$mdn-color-neutral-20};\n\n            &.active {\n              fill: #{$mdn-color-light-theme-green-40};\n            }\n          }\n        }\n      }\n\n      .icon-chevron {\n        position: absolute;\n        right: 1rem;\n      }\n    }\n\n    > div {\n      display: flex;\n      flex-direction: column;\n      gap: 1rem;\n      padding: 0.5rem 1rem;\n\n      > nav {\n        --button-action-transform: none;\n        --article-actions-position-left: 0;\n        align-items: baseline;\n        display: flex;\n        flex-wrap: wrap;\n        gap: 0.5rem;\n\n        > div {\n          position: relative;\n        }\n      }\n\n      .table-container {\n        margin: 0;\n        width: auto;\n\n        &-inner {\n          padding: 0;\n        }\n      }\n\n      .bc-github-link,\n      .bc-legend {\n        display: none;\n      }\n\n      .bc-table {\n        margin: 0;\n      }\n    }\n  }\n\n  .pagination {\n    flex-wrap: wrap;\n    padding-top: 0;\n  }\n}\n","@use \"../../vars.scss\" as *;\n\n.search-widget {\n  position: relative;\n  width: 100%;\n\n  .search-filter-button {\n    right: 0.5rem;\n  }\n\n  @media (min-width: $screen-md) {\n    align-items: center;\n    display: flex;\n    gap: 0.5rem;\n    margin: 0;\n  }\n}\n\n.search-input-field {\n  -webkit-appearance: none; /* stylelint-disable-line property-no-vendor-prefix */\n  background-color: var(--background-primary);\n  border: 1px solid var(--border-primary);\n  border-radius: var(--elem-radius);\n  color: var(--text-primary);\n  height: var(--form-elem-height);\n  min-width: 60px;\n  padding-left: 0.5rem;\n  width: 100%;\n\n  &:focus {\n    outline: var(--border-primary);\n  }\n\n  &:not([value=\"\"]) {\n    ~ .button.clear-search-button {\n      display: block;\n      right: 2.1rem;\n    }\n  }\n\n  &::placeholder {\n    color: var(--text-inactive);\n  }\n\n  .button.clear-search-button {\n    display: none;\n  }\n}\n","@use \"../../ui/vars\" as *;\n\n.search-filter {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n  padding: 1rem 0;\n\n  &.inline-on-mobile {\n    flex-wrap: nowrap;\n\n    .search-filter-category {\n      width: auto;\n    }\n  }\n\n  [type=\"search\"] {\n    flex: 1;\n  }\n}\n\n.search-filter-category {\n  position: relative;\n  width: calc(50% - 0.25rem);\n\n  > .button,\n  .dropdown-list {\n    width: 100%;\n  }\n\n  .button-wrap {\n    font-size: var(--type-smaller-font-size);\n    white-space: nowrap;\n  }\n\n  .action {\n    > span:before {\n      content: \"✓\";\n    }\n\n    &:not(.active-menu-item) > span:before {\n      visibility: hidden;\n    }\n  }\n}\n\n@media (min-width: $screen-md) {\n  .search-filter {\n    flex-wrap: nowrap;\n  }\n\n  .search-filter .submenu {\n    max-width: max-content;\n    right: 0;\n  }\n\n  .search-filter-category,\n  .search-filter-category .dropdown-list {\n    width: auto;\n  }\n\n  .search-filter-category .dropdown-list.filters-menu {\n    left: auto;\n    right: 0;\n    white-space: nowrap;\n  }\n}\n"],"names":[],"sourceRoot":""}