/* src/component/src/component/index.module.css */
@layer ddsweb-molecules {
  @layer ddsweb-filter-tabs {
    .dyenXG_container {
      display: flex;
      position: relative;
      overflow: hidden;
    }
    .dyenXG_itemsContainer {
      --mask-fadeout-width: 20px;
      box-sizing: border-box;
      padding: var(--ddsweb-theme-spacing-xx);
      gap: var(--ddsweb-theme-spacing-xs);
      white-space: nowrap;
      scroll-padding: var(--ddsweb-theme-spacing-xx);
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
      display: flex;
      overflow: auto hidden;
    }
    .dyenXG_itemsContainer::-webkit-scrollbar {
      display: none;
    }
    .dyenXG_fadeOutEnd {
      -webkit-mask-image:
        linear-gradient(
          to left,
          #0000 0%,
          #000 var(--mask-fadeout-width));
      mask-image:
        linear-gradient(
          to left,
          #0000 0%,
          #000 var(--mask-fadeout-width));
    }
    .dyenXG_fadeOutStart {
      -webkit-mask-image:
        linear-gradient(
          to right,
          #0000 0%,
          #000 var(--mask-fadeout-width));
      mask-image:
        linear-gradient(
          to right,
          #0000 0%,
          #000 var(--mask-fadeout-width));
    }
    button.dyenXG_item {
      --ddsweb-link-text-decoration: none;
      --ddsweb-link-text-decoration-hover: underline;
      padding: var(--ddsweb-theme-spacing-xx) var(--ddsweb-theme-spacing-md);
      scroll-snap-align: start;
    }
    button.dyenXG_item:hover {
      text-decoration: none;
    }
    button.dyenXG_item:focus:after {
      opacity: 0;
    }
    button.dyenXG_item:hover:after,
    button.dyenXG_item:focus-visible:after {
      opacity: 1;
    }
    :is(button.dyenXG_item:hover .ddsweb-filter-tabs__item-text, button.dyenXG_item:focus .ddsweb-filter-tabs__item-text) {
      text-decoration: underline;
    }
    button.dyenXG_item .ddsweb-filter-tabs__item-count {
      margin-left: var(--ddsweb-theme-spacing-xx);
    }
    button.dyenXG_itemUnSelected {
      --ddsweb-button-shadow-width: 0;
      padding: var(--ddsweb-theme-spacing-xx) calc(var(--ddsweb-theme-spacing-md) + 2px);
      border: none;
    }
    button.dyenXG_itemUnSelected:focus-visible {
      --ddsweb-button-border-radius: 0;
      outline: var(--ddsweb-theme-colors-primary) solid 3px;
      outline-offset: 1px;
    }
    button.dyenXG_itemSelected {
      --ddsweb-theme-colors-primary: var(--ddsweb-theme-colors-active);
    }
    .dyenXG_controls {
      padding: 0 var(--ddsweb-theme-spacing-xs);
      align-items: center;
      gap: var(--ddsweb-theme-spacing-xs);
      display: inline-flex;
    }
    .dyenXG_controlButton {
      --ddsweb-button-border-color: var(--ddsweb-theme-colors-white);
    }
  }
}


/*# sourceMappingURL=e2f85058df7118bea7b8.css.map*/