.cookies-selector {
  margin-top: 30px;

  .submit-button-container {
    width: 468px;
    margin: 0 auto;
  }

  .cookies-category-selector {
    cursor: pointer;
  }

  .active-arrow {
    transform: rotateX(90deg);
  }

  .dark-title-4 {
    font-size: $font-size-sm;
  }

  .cookies-toggles {
    margin: 10px 0;
  }

  .button-submit {
    margin-top: 20px;
  }

  .cookies-instructions {
    font-family: $font-family4;
    font-size: $font-size-sm;
  }

  .cookie-title {
    width: 45%;
    margin-left: 20px;
    display: flex;

    .dark-title-3 {
      font-family: $font-family;
    }
  }

  .cookie-with-link {
    display: flex;

    .matomo-settings-link {
      width: 100%;
    }
  }

  .cookie-toggle {
    display: flex;
    align-items: center;
    margin: 5px;

    .cookie-helper {
      margin-top: 3px;
    }

    .cookie-helper-popover {
      width: 320px;
      padding-bottom: 10px;
    }

    .rsbc-switch-button {
      margin-top: 6px;
      width: 100%;
    }
  }

  .dark-title-2 {
    margin: 30px 0;
  }

  .cookies-categories {
    margin: 25px 0;
  }
}

@media screen and (max-width: $screen-xxs-max) {
  .cookies-selector {
    .cookie-with-link {
      flex-direction: column;
      margin-top: 20px;

      > span {
        margin-left: 10px;
      }
    }

    .cookie-title {
      display: inline-block;
      width: 100%;
      margin-left: 10px;

      .dark-title-3 {
        &.ellipsis {
          overflow: hidden;
          text-overflow: initial;
          white-space: normal;
        }
      }

      .cookie-helper {
        display: inline-block;
      }
    }
  }
}
