#pied-de-page {
    font-size: 12px;
  }
  #pied-de-page, #pied-de-page li, #pied-de-page a, [data-roles=footerCols] a {
    color: var(--color-white);
  }
  
  footer#pied-de-page ul {
    list-style: none !important;
  }
  
  @media screen and (min-width: 1024px) {
    footer#pied-de-page ul {
      margin-left: 0;
    }

    [data-roles=footerCols] details summary {
        pointer-events: none;
    }  

  }
  
  [data-roles=sub-icons] {
    margin: 0 !important;
  }
  
  [data-roles=sub-icons] > div {
    gap: 8px;
    display: inline-flex;
    align-items: center;
  }
  
  [data-roles=sub-icons] > div > p {
    margin: 0 !important;
  }
  
  [data-roles=sub-icons] ul {
    display: inline-flex;
    align-items: center;
    margin: 0 !important;
  }
  
  [data-roles=sub-icons] ul {
    gap: 4px;
    margin: 0 !important;
  }
  
  [data-roles=footerLegals] li {
    padding: 12px;
  }
  
  [data-roles=footerCols] details ::-webkit-details-marker {
    display: none;
  }
  [data-roles=footerCols] details ::marker {
    content: '';
  }
  
  [data-roles=footerCols] details summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  [data-roles="supMenu"] button, #pied-de-page button {
    background-color: transparent;
    border: none;
    color: var(--color-white);
    font-size: 12px;
    padding: 0;
    cursor: pointer;
  }
  
  .sr-only{
    border: 0 !important;
    clip: rect(1px,1px,1px,1px) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important;
  }
  
  summary {
    cursor: pointer;
  }
  
  @media screen and (max-width: 1024px) {
  
    [data-roles=footerCols] details summary::after, details[data-header-menu] summary::after, div[data-header-menu]::after {
      display: flex;
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat;
      -webkit-mask-position: center;
      mask-position: center;
      -webkit-mask-size: cover;
      mask-size: cover;
      background-color: currentColor;
      -webkit-mask-image: var(--iconDown);
      mask-image: var(--iconDown);
      content: '';
      width: 24px;
      height: 24px;
      transition: transform 0.3s;
    }
  
    div[data-header-menu]::after {
      transition: transform 0s;
      transform: rotate(-90deg);
      transform-origin: center;
    }
  
    [data-roles=footerCols] details[open] summary::after {
      transform: rotate(180deg);
      transform-origin: center;
    }
  }